サイト分析（2021.06.01-06.04）
MEITEC
credit：Shhh inc.さん
FVはキャッチコピーをセンターに置き、画像を見切れさせている。
→スクロールしてもらうために、続きがあることが分かるようにしているのと最初にメイテックとは何なのかを伝えたい。
写真を２つ並べて高さを変えることで短調な印象になっていない。またコードの写真と働く様子を合わせることで、１枚では伝わりにくい内容をうまく補い合って伝えている。
写真の１枚に人物を入れることで冷たい印象を回避している、また仕事に対しての誠実さ、熱心さを感じる（写真も明るめにしている）
FV直下にニュースを設置することですぐに目的の情報を拾えるようにしている。
ピックアップにはサムネを入れることでビジュアルで惹きつけて目に入るようにしている。ニュースと見せ方を変えることで、別なコンテンツだということをわかるようにしている。
ニュースはタグがついており並べ替えることができる。下層に飛ばなくてもすぐ確認できる。
ボタンは矢印やviewmoreなどではなく「私たちの強み」などその先に何があるのかわかるような言葉にしている。（見出しも同様）
見出しには小さい英語と線を入れることで短調さを回避している。
サービスの中の「技術分野別ソリューション」は文字の前に線を入れている。見出しにつく飾りを全て線にすることで統一感を出している
インタビューは写真を暗くし、大きくエリアを取っている。スクロールするといきなりモノクロになるため視線が集中する。うまく引っ掛けている。また写真もモデルではなく、顔のアップのためきつくならないようにしているのではないか。
ヘッダーはスクロール中は非表示、逆スクロールで表示、またフッターで表示される。ユーザーがコンテンツを読みやすいようにした配慮。
FVではメニューの位置を下げてお問い合わせボタンを右上に設置、また黒い座布団を敷くことで目立たせている。
バナーは簡単な説明文を添えることでなんのコンテンツかユーザーが理解できるよう配慮している。
グリッドの線を入れる、写真に視差効果を入れるなど短調にならないようにしている。
気になったサイト
スクロールだけでコンテンツの切り替えができるのがいいなと思ったのと、おじさんの目が該当のコンテンツの方を向いているところなど芸が細かいなと思った。
https://www.tiger.jp/feature/space/
背景に敷いてある画像や動画が全体の黒い背景に馴染んでいてすごく自然に見えた。背景に強いてある線の重なっているところが十字になっているところや画像の端に「」のあしらいをつけているがこの小さいあしらいが決まって見える要因のひとつなんだろうなと思った。
真ん中にメニュードーンで、ホバーすると左右にイメージ画像と説明が出てくるのが珍しい見せ方だなーと思った。
この記事が気に入ったらサポートをしてみませんか？