よしだかなこ

メニューを開く

ポートフォリオのWebサイトのモックアップ画像

ポートフォリオ

#Webサイト

転職活動で使用するためのポートフォリオサイトを自主制作しました。

  • 現状の課題

    自分の作品やスキルを魅せるWebサイトがなく、書類だけでは自分の強みや人柄が十分に伝わらない。

  • 制作目的

    「この人に会ってみたい」と思ってもらい、書類通過につなげること。
    実績を通じて、現時点のスキル・デザイン力・思考力を端的に伝えること。
    Webサイトから私の人柄を感じ取り、「一緒に働く姿」をイメージしてもらうこと。

  • ターゲット

    採用担当者の方
    現場で活躍されているデザイナーの方

サイトを見る
ポートフォリオのWebサイトのモックアップ画像

採用担当者の視点から逆算した
スキルも人柄もまっすぐ届くポートフォリオ

工夫した点

Design process

  • リサーチ

    • 忙しい採用担当者に効率よく情報を届けるため、まずは採用の悩みやニーズを調査しました。
      その結果をもとに、ポートフォリオ制作の3つの目標を設定しました。
    • ① 実績から「今できること」を明確化
      ② 熱量を行動で示し、「未来の可能性」を可視化
      ③ 適応力・人柄をデザインで表現

  • 情報設計

    • ・TOPページ
      採用担当者の心をつかむため、FVには自分らしさを表すキャッチコピーを配置。
      採用担当者が最も関心を持つであろう制作物を、見てもらいたい順に並べています。
    • ・各作品ページ
      デザインプロセスに重点を置き、思考力と細部へのこだわりが伝わるよう情報を整理しました。
    • ・各作品ページ
      自身の強みや日々のデザイン分析を掲載し、前職で得たスキルとデザイナーへの熱量を表現しました。

  • ビジュアル面の工夫

    • 四原則に基づくシンプルなデザインで、制作物が際立ち、迷わず閲覧できる導線を意識しました。
    • “素直さ”や“和やかさ”を、イエローとオレンジの柔らかなぼかしで表現しました。
    • 文章量が多いことを考慮し、ジャンプ率や余白を調整。統一感のあるモックアップを配置することで、閲覧ストレスを最小限にしました。

  • 使用ツール

    Illustrator / Figma / HTML / CSS / JavaScript

  • 制作期間

    2025年8月～9月（約2ヶ月）
    企画・ワイヤーフレーム約2週間
    デザイン約2週間
    コーディング約4週間
サイトを見る