▼概要

・Zoffのコーポレートサイト

▼目的

・Zoffの理念、事業内容、会社概要を知ってもらうため

▼ターゲット

・Zoffと取引をしている、したいと思っている企業
・Zoffで働きたい求職者

▼全体の印象

・フォントの強弱、適度な余白で写真が際立っており、シンプルで存在感があり誠実さが感じされる
・英語が多い、苦手な人には見づらいかも
・スライドとホバーの時に少し動くくらいで、動きがほとんどなく落ち着いて見れる
・「人」が写っている写真が多いので、信頼感があるし眼鏡の使用イメージがしやすい
・同じレイアウトのセクションがなく、全て異なっており見ていて飽きない。
・リンクがつながっているか部分は、矢印や丸＆矢印で表している部分が多い

▼メインビジュアル

<ヘッダー>
・画面上部固定、スクロールすると背景が白になる
・ナビにホバーすると英語が上に回転し日本語と下線が表示される
　→動きがあってわかりやすい
　→AboutUsとRecruitは青い背景に詳細が表示される
・右上オンラインストアのボタンは角丸の白線で白文字
　→ホバーすると青の塗りつぶしになる、別ページへ飛ぶ
・左側に黒文字のキャッチコピー
・右から画面の3/5は画像がスライドでテキストのfor~に合わせた画像が表示
　→画像の左下が角丸で優しさを感じる
　→右端に表示枚数と矢印があり、横線でスライド表示時間が動いてる

▼コンテンツ

<NEWS>

・左にタイトル、水色のラインのあしらい
　→コンテンツ幅の2割くらいに表示
　→単位はvw
・「View All」はホバーすると黒になり、下線が右に流れるようにアニメーションになる
・右側の8割にNEWSの内容
　→ホバーするとテキストと矢印が水色に変化する
　→アイコンのような役割で、丸い画像が左側にある

<Zoff Focus>

・スライドショーの矢印の周りの丸に線の動きで画像の表示時間がある
・スライドで一番左が大きく、次に表示するものが字小さくなっている
・画像の右上に縁取った番号が重なっている
・「Zoff Focus」のボタンは、ホバーすると水色になり、テキストが縦に回転、矢印が右側に動く

<Our Business 事業について>

・2カラムになっている
・左上にタイトルとテキストが左揃えである
・「インターメスティックグループ」のロゴにはリンクがつながっていない

<Sustainability サステナビリティ>

・スライドの矢印は、記事のリンク内にあるため、スライドを動かそうとするとリンクへ飛んでしまうことがある

<Recruit>

・写真の上にカラーオーバーレイで黒が薄くかかっている
・暗くすることで、画像の上にテキストをおいても可読性が失われない

<ホバー>
・画像：ズームする
・ボタン：テキストが上に回転し、背景色が黒→青に素早く変化する
・テキストリンク：黒→青に変化する

<フッター>

・SNSのボタンがある。前回のDIGITALISTもそうだが、フッターにのみSNSボタンを配置するサイトをちょくちょく見る気がする
・Pagetopはフッター固定、フッターに来ないと表示されない
・著作権表記などは背景が黒、最後に暗目の背景がくることで重みが感じられて、締まっている、サイトの終わりということがわかる

<コンテンツ幅>
・1170px（1440pxの場合）

▼カラー

▼フォント

・Noto Sans JP
・Montserrat

▼フォントサイズ

・ナビゲーション：15px
・タイトル：51px、32px、28px
・コンテンツ：23px、20px、18px、16px、14px

▼レスポンシブ

・メインビジュアルの「for〜」のテキストが縦書き
・ナビはハンバーガーメニューに格納される
・コンテンツは1カラム、縦積みになる
・コンテンツ幅：315px（375pxの場合）