Webポートフォリオの構築

PDFのスクロールから、更新性と探索性の高いWeb体験へ

従来のPDFポートフォリオは、作品追加や並び替え、レイアウト調整に手間がかかり、ページ数の増加によって関心のある作品にも辿り着きにくい状態でした。

本案件ではポートフォリオをWeb化し、更新しやすさと探索しやすさを両立する構造を設計しました。採用担当者が自社に関係する実績を短時間で把握しやすくし、候補者理解とマッチング判断の負荷を下げることを目指しています。

運用負荷

作品追加や順番変更のたびにレイアウト調整が発生し、更新のたびに全体構成への影響を考えながら作業する必要がありました。PDFポートフォリオでは、作品数の増加に伴ってページ追加や余白調整、前後関係の見直しが発生し、部分修正が全体に波及しやすい状態でした。

閲覧負荷

ページ数が増えるほど、閲覧者が必要な作品に辿り着きにくい問題を抱えていました。興味のある作品や自社に近い領域の実績へ直接アクセスしにくく、長い資料を先頭から順に追う読み方になりやすいことが懸念されました。

伝達の非効率

採用担当者が限られた時間の中で「この候補者は自社に合うか」を判断する必要があります。そのため、作品を単に並べるのではなく、関心のあるテーマや業務領域の事例に簡単に辿り着けること、そして作品ごとの要点を短時間で把握できることを目指しています。

一覧から探せる構造へ

作品一覧では、各案件をカード形式で並べ、タイトル / 概要 / タグ / サムネイルを通じて内容を素早く把握できるようにしました。

詳細は記事単位で育てられる構成

各作品はMDXによる記事単位で管理し、一覧全体を崩さずに追加 / 更新できる構成としました。全体を組み直す運用から離れ、案件ごとに継続的に育てやすい形へ置き換えています。

限られた時間内での確認しやすさ

実務案件とアート寄りの制作物を混在させながらも、採用担当者が確認しやすいよう業務系案件を上位に配置しました。また、実務案件を中心にトップ画面からの遷移ルートも用意し、画面移動の負荷を軽減しています。

探索性の向上

タグによる絞り込みを設け、閲覧者が関心のある切り口から作品を探せるようにしました。共通タグを持つ記事へ素早く辿れる構造とし、内部ではタグ情報を一元管理することで、不要な増加や表記揺れも防いでいます。

要約記載の徹底

冒頭から長文を読ませるのではなく、まず要約で関心のあるトピックか判断できる構成を意図しました。また、ページ内リンク機能は、画一的な記事構成と、本サイトの閲覧頻度を踏まえ、設けていません。

見てもらいやすく、更新しやすい構成へ

閲覧者はタグや一覧から関心のある案件へ直接アクセスできるようになり、長いポートフォリオを頭から順番に追う必要がありません。

また、PDF形式では、作品追加のたびに全体レイアウトへの影響を考慮する必要がありましたが、Web化によって作品を記事単位で更新しやすい形へ移行できました。

候補者理解とマッチング判断の支援

採用担当者にとっては、自社に近い業務領域やテーマの実績へ短時間で到達しやすくなり、候補者理解や相性判断の負荷軽減につながると考えています。自分自身の採用活動経験も活かせたと考えています。

閲覧者側の探索性と制作者側の更新性を同時に改善したことが、このプロジェクトの成果です。