PORTFOLIO KAITO KAWAUCHIYA

Web Study Sapporo

授業課題 ウェブスタディサッポロ リニューアルサイト

#WEB DESIGN

#SCHOOL WORKS

ウェブスタディサッポロ モック画像1

授業課題のグループワークで、職業訓練校のリニューアルサイトを制作しました。 エネルギッシュでインパクトのあるデザインで、熱量を感じるサイトに仕上げました。 ターゲットが求めているものを突き詰め、情報設計をこだわりました。

ウェブスタディサッポロ モック画像2

scroll

デザインカンプ top
デザインカンプ about
デザインカンプ interview
デザインカンプ bliefing
デザインカンプ recruit
デザインカンプ policy

ターゲット

20〜30代のWEB業界へ興味のある方々。
学ぶ意欲・熱量のある方々。

課題

既存サイトから説明会・入校申し込みができるようにしたい。
熱意のある方々に入校してもらいたい。

目的

興味を持っていただいた方々に説明会へ来たい・入校したいと思ってもらえるWEBサイトを制作する。

情報設計

ウェブスタディサッポロの取り組みや学べることについて知っていただき、興味を持っていただいた方々が説明会へ申し込みしやすいような流れを考えました。 在校生・卒業生インタビューを取り入れることで、入校後や就職後のイメージを持っていただくことができます。 サイトアクセス時に、画面に現れるボタンをクリックしてトップページが表示される演出にすることで、ユーザが自身の手で前に進んでいくような動線にしました。

デザインプロセス

活気のあるポジティブな印象を与えるため、彩度の高い赤をメインカラーにしました。 文章量が多くなることをふまえ、レイアウトに動きを持たせることで飽きさせないようなデザインに仕上げました。 ウェブスタディサッポロの特色や学べるツールなどは、ロゴやアイコンを用いてイメージしやすいようにしています。

制作期間

企画/情報設計/WF

デザイン

コーディング

約40時間

約30時間

約60時間

使用フォント

  • Inter
  • Noto sans JP

英文は"Inter"、和文は"Noto sans JP"を使用しています。 太いウェイトで、インパクトを与えるようなフォントを選定しました。

使用ツール

  • Adobe Photoshop
  • Figma
  • Visual Studio Code