タイトル:
ZHOUTIANCHI’S
Portfolio
(self work)
メディア:
Website
ターゲット:
制作会社の採用担当者の方
ゴール:
Webデザインの学習と実践を通じて得た成果を整理し、私のデザインスキルや制作への取り組み方を伝えることを目的としています。
時間:
2ヶ月
ツール:
Figma / Photoshop /
Illustrator / VsCode
情報設計:
本ポートフォリオは4つのページで構成されています。
Topページ： ファーストビューに大きくデザイン性のある文字で自分の名前を表示し、そのまま実績紹介に繋げました。シンプルさを保つため、詳細情報はホバー時に表示されるようにしています。その後、プロフィールや自己紹介を配置し、最後にメールアドレスを設置しました。
Worksページ：実績を一覧表示し、ホバーで詳細が見られるようにしました。クリックすると各作品のDetailsページに遷移し、作品の細部を紹介します。
Aboutページ：自己紹介を行い、スキル・強み・興味関心をまとめました。
また、どのページでもフッターに連絡先を固定し、スムーズにアクセスできるようにしました。さらに、全体のページ数を4つに絞ることで、閲覧者が迷わず回遊できる構成にしています。
デザイン:
本ポートフォリオは個人作品であるため、自分の好みに合わせて、タイポグラフィを重視したシンプルでポップなスタイルを採用しました。レイアウトでは余白を大きく取り、見出しに太字の大きな文字を使うことでメリハリを出し、本文には特徴の少ない細めのゴシック体を用いて、行間を広めに確保し可読性を高めています。
配色は黒・白・グレーのみを使い、色数を抑えることでシンプルさを保ち、文字の太さや大きさに自然と目が向くようにしました。全体の基調はモノトーンとし、実績部分の作品画像にはカラーを使うことで、閲覧者の視線が自然に作品そのものへ集中するようにデザインしています。
色:
