![見出し画像](https://assets.st-note.com/production/uploads/images/100402354/rectangle_large_type_2_29a8928cae0386c7a6b0ad2fd6f74145.jpeg?width=800)
ウェブサイト考察レポート #002
本日考察するウェブサイトは、
コクヨ株式会社様の新卒採用サイトです。
ターゲット予測:新卒求職者
目的予測:応募者を増やす
文字(本文):Noto Sans JP PC 16px SP 12px
全体の印象:爽やか、新しさ、フレッシュ
![](https://assets.st-note.com/img/1678902262825-T5AzsFzS1A.png?width=800)
■ エントリーページへスムーズに誘導
ヘッダーには「インターン」と「エントリー」のボタンが固定されており、どのページに移動しても常に上部についてくる。メニューの中身はまとめて収納され、他の情報に惑わされず応募のボタンにすぐたどり着ける構造になっている。
![](https://assets.st-note.com/img/1678903120940-NwaXeH9orn.png?width=800)
■ 特徴的なタイトルのモーション
タイトルはパソコンで文字を打ち込んだ時のような動きをする。打ち込むまでの流れを見せることにより、思考の過程を表現しているのではと思った。「問い」を見つけ「答え」を模索することを大切にしているコクヨの個性を表現している。動きがついていることにより、目線がタイトルに誘導され、わかりやすさもある。
![](https://assets.st-note.com/img/1678902454146-P1Gfw38DSA.png?width=800)
■ 統一されたコンテンツトップのデザイン
基本的にコンテンツトップのデザインは統一されているが、メリハリを感じる。下の要素のレイアウトの展開に変化があり、ページによって2カラム・3カラム・4カラムを使い分け、印象に差をつけているためだと思った。コンテンツトップのデザインが統一されていることにより、潔く情報をまとめている。
![](https://assets.st-note.com/img/1678903249415-kNwaDqk1Kr.png?width=800)
![](https://assets.st-note.com/img/1678903212689-xBITiphQPG.png?width=800)
![](https://assets.st-note.com/img/1678903326317-asJqVPntLj.png?width=800)
文字まわりは密度があり、メリハリを感じる。文字の大小を使い分け、程よくスケール感がついているからだと思う。
![](https://assets.st-note.com/img/1678902576312-7ANnMiVEvZ.png?width=800)
まとめ
平面的なグラフィックを中心としたデザインで、文房具ブランドらしさを感じるデザイン。情報が多いサイトのため、見出しやボタンのルールを少なくしたらより構造が分かりやすくなるのではと思った。
この記事が気に入ったらサポートをしてみませんか?