Works

ウェブサイト

2023.02.20制作

WSS

スクロール矢印

作品5

作品05デザインカンプ

デザインコンセプト

●クライアント:WSS WebStudySapporo(ウェブスタディサッポロ)様

●ターゲット:20~30代

●設定:全体のテーマは「楽しむ」
このテーマはそれぞれグループ内で何にするかを考えてクライアントに提案。

現在のサイトではまとまりがなく入り組んでいるので、整理されたわかりやすいサイトへのリニューアルのご依頼。写真をたくさん使用し新しいページを追加したいのでご提案くださいというご要望でした。説明会に来られて応募する方が多いので、説明会のページを増やして欲しい。

制作時間・制作人数

●4人で制作(グループワーク)
●クライアント様との打ち合わせやグループ内での方向性の話し合いや
入る内容が決まっている文章内容の文字起こし、素材の選定や写真加工「8日」
●デザインカンプ「4日(Topページのみ1日で制作)」
●コーディング「6日」=合計16日間(それぞれ同時進行のため合計日数は合わないです)
私は全ページのデザイン、構成、英語以外と新規で入る文章全て、
会社案内のコーディングを担当しました。

レスポンシブ

非対応

使用ソフト・使用言語

Figmaアイコン

Figma

Photoshopアイコン

Photoshop

htmlアイコン

HTML LS

cssアイコン

CSS 3

Sassアイコン

Sass

JQueryアイコン

JQuery

書体

英語:Roboto
日本語:Noto Sans JP
楽しむがテーマなので元気なイメージのゴシックで太めなものを使用しました。 筆文字の英語書体で元気な勢いと疾走感を表現しました。

使用色

ビタミンカラーである、オレンジよりの黄色をキーカラーにしました。

写真

フリー素材
Topの人物の切り抜き写真と補正はグループ内の方にお願いしました。解像度の高い写真を見つけることができず残念ですが季節感が傾かない服装で写真探しをお願いしました。ワイワイと楽しいコンセプトに合う雰囲気が出てよかったと思います。

こだわり

Topページでは視線の流れを重視し動きのあるレイアウトを目指して制作しました。
就職率の高さをぱっと目に入るように、文章よりも円グラフを先に持ってきました。セクションの枠線の上に重ねることでさらに強調するようにしています。新しいページではスペシャルコンテンツとして卒業生と在学生に登場してもらい受講のきっかけや感じたこと、最後に読み手への一言をお願いします。というような文章を制作しました。在学生には学校の1日を時間軸で紹介してもらうという設定にし、どのような流れで授業が進んでいくのかをあたかも取材したような雰囲気(訓練中、私がやっていたことですが)にしました。

反省点

Topページはだいぶ前に出来上がっていましたが、下層ページは色々な作業と並行しながらデザインカンプを進めていたので時間が足りずに残念な形になってしまいました。元気感を出すために筆文字のような書体を使用しましたが、この書体は合わないのではと反省。

Visit Website