PROJECT
ポートフォリオサイト制作
TYPE
Web Site
TOOL
STUDIO
Photoshop
Illustrator
ROLE
デザイン
企画
ライティング
CLIENT
自主制作
DURATION
約2ヶ月
自身の創作活動と転職のためのポートフォリオサイトを制作しました。各制作物のストーリやプロセスが伝わるように、モックアップやデザインコンセプトを詳細に作り込みました。
今までの活動や持っているスキルをしっかり伝わるように制作しました。
TARGET
採用担当の方々。
デザインをご依頼したい方々。
PURPOSE
自身のスキルやデザイナーとしてできることを、しっかりと伝える場所として制作。
また、ご依頼をいただくクライアント様が、どんなデザイナーなのかを伝えるようにしたい。
CONCEPT
トップページのファーストビューに「どんなデザイナーか」が伝わるようにし、すべてのページへスムーズにアクセスできる設計にしました。
作品は大きく魅力的に見せ、人柄が伝わるように、ボタンアニメーションなどで細かな遊び心を加えています。
他にも、完成までのプロセスをデザインに落とし込むことが強みなので、各制作物のストーリーを丁寧に作り込んで、どのような思考で制作したかを伝わるようにしました。
デザインストーリー
DESIGN STORY
情報が複雑にならないようにできる限りシンプルな設計にして、まずは制作物を見て欲しい想いからファーストビュー直下に制作実績を配置しました。
制作物がどのように使われるかをわかりやすく伝えるために、関連するモックアップでアイキャッチを制作しています。
またボタンのホバーなどでテキストを変化させるなど、人柄が出るような遊び心をデザインに表現しています。
デバイスの枠を越えて多くの人にアクセスしてもらえるように、レスポンシブ対応のデザインで制作しました。
またトップページだけではなく、どのページからでも全てのページにスムーズにアクセスできる動線作りを心がけ、どこに何があるかをわかりやすい設計にしています。
トップページのファーストビューにある円は、「どんなデザイナーになりたいか」「何を大切にしているのか」を伝えるために、グリーン・オレンジ・パープルの3色で構成されるグラデーションと円のオブジェクトで表現しています。
グリーン＝誠実・調和・寄り添う
オレンジ＝温かさ・やさしさ
パープル＝創造・洞察力・信頼
ご依頼いただいたクライアント様との縁を大切にし、「想いをつなぐデザインをしていきたい」「相手の想いに寄り添ったデザインをしていきたい」想いを込めて表現しています。
プロフィールページでは、今までの歩み・スキル・人柄を5つのセクションに分け、ボックスや図解で情報を整理することで、ひと目で理解しやすいような構成にしました。
視覚的なわかりやすさだけでなく、読み手が心地よく感じるリズムや余白、自然に視線が流れる動線を意識して設計しています。
STUDIOのテンプレート「THE PORTFOLIO」をもとにポートフォリオサイトを制作しています。
THE PORTFOLIOはこちら
