Nici 窒素循環社会プロジェクト / #38ch_SiteReview

サイト概要

そこで私たちは”ゼオライト”などの材料を使い
環境負荷をかけない
”窒素循環”を研究しています

Nici 窒素循環社会プロジェクト

---

ファーストビュー

• 画面幅いっぱいの、温かみあるアナログ手書き風のカラフルなイラスト。
  一部にアニメーションがついている。時間でループ。
  端から約190px～390pxの余白を持たせている。

• 左上にロゴ、左上にキャッチコピーとリード文、左下にMENU（画面固定）

• デザイン全体的にハンドメイド感があり柔らかい。
  MENUボタンのステッチデザイン。
  ベタ塗りを使わず、ノイズのある画像を使用。

構成

• TOPページはABOUTとお知らせ
  下層にメンバー、研究紹介、研究実績、お知らせ

• 研究関連の文章のため内容が堅い分、イラストをキャッチーなものにして身近なことに感じやすくさせている。
  コンテンツの切り替えで背景が波カットされていたり、使用されている図形が丸みのあるものであるところもお堅さを軽減させている。

• お知らせは、WEBサイトとしてもTOPページにおいても下層にあり、見たい人が見るコンテンツとして扱われている。

フォント

種類
欧文：Zen Kaku Gothic Antique

Antiqueを使用することで可読性を残したまま、丸みによって文章のお堅さが軽減されている。

サイズ・太さ
h3：20px または 28px
p：16px

配色

stylifyme.com調べ

イラストがカラフルな分、背景や文字は色数少なく落ち着いたラテカラー。
理系のイメージからかアクセントカラーは青。
イラスト含めトーンがしっかり合っている。

レスポンシブ対応

@media(max-width:768px)で切り替わる。

フロントページのサムネイル