( PROJECT )

ポートフォリオ

クライアント

個人制作

担当範囲

ディレクション, デザイン, コーディング

使用ツール

Figma, Photoshop, Illustrator

制作期間

企画

：

2日間

デザイン

：

1ヶ月

コーディング

：

1ヶ月

( DETAIL )

概要

就職活動時に使用することを目的とした自身のポートフォリオサイト

ターゲット

採用担当者、デザイナー、ディレクターの方々

目的

就職活動時に使用し、自分の制作物・強み・経歴を伝えることが目的

情報設計

01 短時間で情報を得られる設計

本サイトでは、採用担当者の方が多忙な中ポートフォリオを評価する状況を前提に、「短時間で実績とスキルを判断できる情報設計」を軸に構成しています。そのため、最も重要な情報である制作実績を優先的に配置し、全体を通して視覚情報のみで瞬時に内容を把握できる構造としています。また、TOPページではテキスト量を最小限に抑え、詳細は下層ページへ遷移することで、短時間でも効率よく概要が理解でき、必要に応じて深掘りできる導線にしています。

02 情報の優先順位を一貫させる

全体を通して、「ビジュアル → タイトル → 補足情報」の優先順位で情報を設計しています。ユーザーがどの場面でも同じ順序で情報を認識できるようにすることで、迷いなく内容を理解できる状況を作っています。

デザイン

01 信頼感とやわらかさの両立

全体の配色は、くすみブルーや淡いグリーンを基調に構成し、強い色を使用せず落ち着いたトーンで統一しています。これにより、信頼感や安心感を担保しつつ、やわらかく親しみやすい印象も同時に与えられるようにしました。また、彩度を抑えることで視覚的な主張をコントロールし、情報そのものが自然と引き立つバランスを意識しています。

02 デジタルと温度感のバランス

背景には紙のような質感を取り入れ、デジタル特有の無機質な印象を和らげています。Webでありながらも人の温度を感じられる表現を取り入れることで、丁寧さや親しみやすさが伝わるデザインを目指しました。

03 可読性を軸にしたレイアウト設計

ぱっと見て理解できることを重視し、余白を広めに確保しながらコンテンツを整理しています。情報同士の距離やまとまりを明確にすることで、視線が迷わず、直感的に内容を把握できる構造としました。また、要素の詰め込みを避けることで、視覚的な圧迫感を軽減し、落ち着いて閲覧できるようにしています。

04 遊びの要素による個性の付与

星やドットなどのあしらいを部分的に取り入れ、シンプルな構成の中に軽やかさと遊びを加えています。装飾は主張しすぎないように抑えつつ、視線の流れを補助するアクセントとして配置することで、可読性を保ちながら自分らしい世界観を表現しました。