【day29】♯花粉症バイバイ #1日1サイトレビュー
【概要】
花粉症にまつわる情報メディアのサイト
【選んだ理由】
・花粉症に悩んでいる人にフォーカスしたサイト
・イラストがメインで使われていて、キャッチー
→イラストメインのサイトで、使われているデザインやレイアウトを分析
【参考になるデザイン】
・ファーストビューは、イラストがメイン。花粉が多い環境（木がいっぱい）のなかで、花粉ウイルスやマスク・目薬などのグッズから解放されている
・全体的に、緑、白、ハイライトの黄色のカラーリング
・ファーストビュー右下にあるSCROLLは下向きやじるしがツンツンうごいている
・ABOUTなどのセクションタイトルは一文字ずつ表示されるモーション
→コミカルな、とっつきやすい感じ
・各セクションのコンテンツは線画イラストにあわせて枠線がある
→統一感がでる
・背景がドットになっているセクションもあり
→線画イラストや枠線と相性がよくて、漫画っぽさ、キャッチーさが表現できる
・TOPICSは、ジャンルによってイラスト背景が色分けされている
→色でどういうジャンルの記事なのかが判別しやすい
・セクションタイトルやその下のサブテキストの箇所は白背景になっている
→可読性をあげている
・全部のコンテンツの枠が枠のみなのではなく、影がついているものもある
→単調にならずにメリハリがつく
・各コンテンツの記事の文章は、緑色の見出しと黒色本文のみで表現されている
→文量がおおいものもあるけど、使用している色を絞ることで読みやすい
・線画イラストと枠線、楕円ボタン、影付きボックスボタン、SNSアイコンなどのトゲトゲな形が親和性があるんだなぁ〜！
【目的】
・花粉症で悩んでいる人に解決できるような情報を拡散したい
・SNSで拡散して、花粉症関連の研究をしってもらいたい
【フォント】
邦文：游ゴシック体
欧文：’Roboto Mono',monospace
【カラー】
全体的な背景やフォント：1fa29b（緑）
ハイライト：ffde00（黄）
背景：fff
【レスポンシブ（PC）】
・ファーストビュー右下にあるSCROLLは矢印じゃなくて下向きに流れる線と下向きマークになっている
・コンテンツはマウスオーバーするとボタンをおしたようなモーション
・スクロールすることでカードが左右に一回転するようなモーションもある
・余白の取り方がきゅうくつさを感じなくて良いな〜！
・モーションのスピードと要素が動く順番が、アニメっぽくてかわいい
→ここでもキャッチーらしさを感じる
▼SPサイズキャプチャ
いいなと思ったら応援しよう！
