Facebook 【サイト】自分のポートフォリオサイト
Logo

【サイト】自分のポートフォリオサイト

クレジット
Avatar
デザイナー
【サイト】自分のポートフォリオサイト-1
シェア
制作ノート
〜デザイン詳細〜

上から、
- モックアップ
- トップページ
- ABOUT MEの下層ページ
- WORKSの下層ページ
- 作品の詳細ページ

【TOPページの工夫点】
・自分のデザイナーについての考えから、

【作品詳細ページの工夫点】
・トップに作品名とモックアップを置いてインパクトを出しました。
・作品一覧のページとの統一感を出すために、グレーの背景を敷きました。
・ひとことコンセプトとデザインカンプをページ上部、かつ、それらを近くに配置することで、一目でどのようなデザインなのか理解しやすいようにしました。
・ひとことコンセプトの下線を各作品のイメージカラーにすることで、「そのページに統一感を出すこと」と「コンセプトへの視線誘導」を意識しました。
・作品の詳細に白い背景を置き、可読性を上げました。
・デザインカンプと作品の項目の配置を同じ高さにするとのっぺりとした印象に見えたので、少しずらしデザインカンプにシャドウを入れました。
・作品の詳細の項目名と内容のテキストカラーに差をつけ、それぞれの項目がどういう内容なのか分かりやすいようにしました。

・作品の詳細のテキストはページ左端から240pxのところから始まるように、デザインカンプの右端はページ右端から240pxのところに位置するように配置し、ぱっと見の違和感を無くしました。

・行間を広めに取り、窮屈な印象を減らしました。

シェア
maの他の作品