Webデザイナーの職務経歴書は、職務要約で専門領域と成果を先出しし、プロジェクト別に役割と数値を明記するのが正解です。ポートフォリオへの評価は、この職務経歴書で「会ってみたい」と思われた後に得られます。未経験・フリーランス経験者向けの例文と、採用担当者が実際に見ているポイントを状況別に解説します。
Webデザイナーの職務経歴書の書き方と例文
結論：まず押さえるべき4つの構成要素
Webデザイナーの職務経歴書は「職務要約」「職務経歴詳細」「スキル・ツール欄」「自己PR」の4構成が基本です。採用担当者はこの順番で読み進めるため、それぞれで知りたい情報を過不足なく盛り込むことが通過率を左右します。
- 職務要約：専門領域・経験年数・対応範囲を200〜300文字で先出しする
- 職務経歴詳細：プロジェクト別に規模・役割・使用ツール・成果を記載する
- スキル・ツール欄：ツール名にレベルと経験年数をセットで書く
- 自己PR：課題をどうデザインで解決してきたかの思考プロセスを示す
職務要約の書き方と例文
職務要約は職務経歴書の冒頭に置く200〜300文字の文章で、採用担当者が最初に読む箇所です。盛り込むべき情報は3つあります。
- 専門領域と経験年数（コーポレートサイトかECサイトか、何年担当したか）
- 使用ツールと対応範囲（デザインのみか、コーディングまで対応できるか）
- 代表的な成果（数値で示せるものを1つ）
良い例文
Web制作会社にて5年間、コーポレートサイトおよびECサイトのUIデザインを担当しました。Figmaを主軸に、クライアントヒアリングからビジュアルデザインの納品まで一貫して対応しています。HTML/CSSのコーディングにも対応可能で、担当サイトの直帰率を平均15%改善した実績があります。
NG例
Webデザイナーとして長年働いてきました。デザインが好きで、さまざまな案件に携わりました。PhotoshopやIllustratorが使えます。クライアントの要望に応じて柔軟に対応してきました。
経験年数・プロジェクト規模・成果・コーディング対応の有無がすべて不明です。「さまざまな」「柔軟に」という表現からは、採用担当者に何も伝わりません。
職務経歴詳細の書き方と例文（プロジェクト別）
職務経歴詳細は在籍企業ごとにまとめ、担当したプロジェクトを個別に記載します。1案件につき次の4要素を揃えると、採用担当者がスキャンしやすい構成になります。
- プロジェクト概要と規模（コーポレートサイトか、月間PVはどの程度か）
- 自分の役割（UIデザイン全般か、コーディングやディレクションを含むか）
- 使用ツール（Figma・Photoshop・Adobe XDなど）
- 成果または貢献（数値・クライアント評価・社内指標の改善など）
良い例文
【在籍会社】株式会社○○（Web制作会社） 2019年4月〜2024年3月
事業内容：Webサイト制作・UI/UXデザイン
【主要案件①】ECサイトUIリニューアル（月間PV 50万〜200万規模）
担当：UIデザイン全般・Figmaでのワイヤーフレーム〜ビジュアルデザイン・コーダーへの仕様共有
成果：カート移行率12%改善、直帰率を平均15%削減
【主要案件②】中小企業コーポレートサイト新規制作（15社以上担当）
担当：ヒアリング〜サイトマップ設計〜ビジュアルデザイン〜HTML/CSS実装
案件ごとに規模と役割を書き分けるだけで、経験の解像度は大きく変わります。同じ技術・クリエイティブ職向けの記載フォーマットとして、エンジニアの職務経歴書テンプレートのプロジェクト単位の書き方も参考になります。
スキル・ツール欄の書き方
ツール名を並べるだけのスキル欄では、採用担当者に「どの程度使えるのか」が伝わりません。ツール名にレベルや経験年数を必ずセットで記載してください。
| ジャンル | ツール・スキル | レベル・経験年数 |
|---|---|---|
| デザイン | Figma | 業務使用3年（ワイヤーフレーム〜ビジュアルデザイン対応） |
| デザイン | Photoshop / Illustrator | 業務使用5年（バナー・LP制作） |
| コーディング | HTML / CSS | 基本的な実装対応可（コーダーへの仕様共有含む） |
| コーディング | JavaScript | 簡単なDOM操作レベル |
| その他 | Adobe XD | クライアント提案資料の作成まで使用経験あり |
自己PRの書き方と例文
自己PRで「デザインが好き」という感情だけを書いても評価は変わりません。採用担当者が知りたいのは、どんな課題をどうデザインで解決してきたかという思考プロセスと、チームでどう動ける人材かという点です。
良い例文
ユーザーの行動データを読み、デザインの仮説を立てて検証するサイクルを一貫して意識してきました。ECサイトのリニューアルでは、ヒートマップ分析で離脱ポイントを特定し、購入ボタンの配置とサイズを変更した結果、カート移行率を12%改善しました。コーダーとの仕様共有も積極的に担当し、デザインと実装の齟齬が起きにくい進め方を心がけています。
採用担当者がWebデザイナーの職務経歴書で見ている3つのポイント
作品の完成度が高くても、職務経歴書の書き方が甘いだけで選考から外れることがあります。採用担当者がポートフォリオを開くのは、職務経歴書で「会ってみたい」と判断した後です。ここでの言語化力が、作品を見てもらえるかどうかの分かれ目になります。
最初の30秒でスキャンされる3か所
採用担当者が職務経歴書を読む時間は、1件あたり平均30秒程度といわれています。この短時間で「面接に呼ぶかどうか」を判断する際、無意識に3か所を確認しています。
| 職務経歴書 | ポートフォリオ | |
|---|---|---|
| 伝えること | 経験・役割・成果・スキルレベル | デザインの質・センス |
| 判断タイミング | 書類選考の段階（最初） | 面接前〜面接時 |
| 採用担当者の見方 | 30秒でスキャン | じっくり確認 |
採用担当者はここを見ている
- 職務要約（冒頭3〜5行）：専門領域・経験年数・コーディング対応可否が書かれているか
- スキル・ツール欄：使用ツールのレベルと経験年数が明記されているか
- 職務経歴詳細：プロジェクト規模と成果の数値が読み取れるか
ポートフォリオより先に職務経歴書で判断される理由
応募数が多い求人ほど、採用担当者は全員のポートフォリオをじっくり見る時間を確保できません。職務経歴書で経験の解像度が伝わらない応募者は、作品を確認する順番まで進めないまま見送られます。職務経歴書と合わせて提出する履歴書も、項目の抜け漏れを防ぐなら転職用の履歴書テンプレートのような型を使うと作成しやすくなります。
数値実績がなくても評価される職務経歴書の書き方
担当した制作物のPVデータや転換率データを持っていない場合でも、成果を伝える方法はあります。採用担当者は「数値がない＝成果がない」とは判断しません。数値がなくても評価される代替表現があります。
「数値なし」でも伝わる成果表現
採用担当者が評価する成果表現の例
- 「クライアントから追加発注をいただいた」（継続依頼は品質の証明）
- 「社内デザインレビューで修正なし・1回承認で通過した」（質の高さの証明）
- 「リニューアル後、問い合わせ件数が増えたとクライアントから報告があった」（定性的な成果）
- 「担当デザインが社内の優秀事例として紹介された」（外部評価）
制作の過程を振り返れば、言語化できる実績は必ず見つかります。転職サイト経由で応募する場合は、書式の癖を踏まえて書くと通過率が上がります。
状況別・Webデザイナーの職務経歴書の書き方と例文
未経験・スクール卒業者の場合
前職でWebデザインの実務経験がなくても、評価される書き方があります。採用担当者が未経験者に求めるのは、完成したデザインスキルよりも仕事への取り組み方と学習の本気度です。
- スクールや独学での制作実績を職務経歴に含める（卒業制作も可）
- 前職のビジネス経験とWebデザインへの転身理由を明確に記載する
- ポートフォリオのURLを必ず記載し、制作物で実力を補完する
良い例文（未経験者の職務要約）
前職ではEC系販売スタッフとして3年間、商品のポップ作成や店舗ディスプレイのレイアウトを担当しました。顧客の動線を意識したレイアウト設計に興味を持ちWebデザインの学習を開始し、Figma・HTML/CSSを6か月継続して習得しました。スクールの卒業制作として架空のECサイト（ポートフォリオ掲載）を制作し、商品詳細ページのUI設計を担当した経験があります。
書式に迷った場合は、ハローワーク用の職務経歴書テンプレートのようなシンプルな型から項目を埋めていく方法もあります。
フリーランス経験者が正社員転職する場合
フリーランスや副業として受けてきた案件は、正社員転職の職務経歴書に記載できます。クライアントワークの実績は、企業採用でも有効なアピール材料になります。
採用担当者はここを見ている
- 案件の規模感を明記する（個人ブログ1ページ〜法人サイト複数ページなど）
- クライアント名が非公開の場合は「Webメディア運営企業（非公開）」と記載できる
- 案件数・対応期間・主要担当領域を職務経歴詳細に含める
- 「全工程を一人で担当」「ヒアリングから納品まで対応」など、正社員との違いを明記する
案件単位の書き方に迷う場合は、フリーランス出身者向けの記載例も参考になります。
Webデザイナーの職務経歴書でよくある3つのNG
NG①：スキルを羅列するだけで成果がない
最も多いNGが、使用ツールを箇条書きで並べるだけのスキル欄です。採用担当者が知りたいのは「何ができるか」ではなく「何をどのレベルでできるか」です。
NG例
・Photoshop
・Illustrator
・Figma
・HTML/CSS
習熟度・経験年数・どんな業務に使えるかが一切わかりません。採用担当者はスキルを見ても判断できず、流し読みで終わります。
良い例文
・Figma：業務使用3年、ワイヤーフレームからビジュアルデザインまで対応
・Photoshop / Illustrator：業務使用5年、バナー・ランディングページ制作
・HTML / CSS：基本的な実装対応可（コーダーへの仕様共有含む）
NG②：プロジェクト規模・役割が不明
「Webサイトのデザインを担当しました」という記述は、採用担当者にほぼ何も伝わりません。担当したのがバナー1枚か、大規模ECサイトのUIリニューアルかで評価は大きく変わります。
NG例
様々なWebサイトのデザインを担当。クライアントの要望に合わせて柔軟に対応しました。
規模・役割・担当範囲がまったく不明です。「様々な」「柔軟に」は情報ゼロに等しい表現です。
良い例文
ECサイトUIリニューアル（月間PV 100万規模）のUIデザインを一人で担当。Figmaでワイヤーフレームから最終デザインまで作成し、コーダーへの仕様共有まで対応しました。
NG③：ポートフォリオURLを記載していない
職務経歴書にポートフォリオのURLがないと、採用担当者は作品を確認するために連絡する手間を感じます。Webデザイナーの職務経歴書には、必ずポートフォリオのURLを明記してください。
採用担当者はここを見ている
- URLはスキル欄・自己PR欄・職務要約のいずれか1か所に必ず記載する
- アクセス直後に確認できる形式にする（パスワードロック・表示速度が遅いサービスは避ける）
- 書類送付前に、URLへ正しくアクセスできるか必ず確認する
そもそも職務経歴書自体が不要なケースもあるのか、迷う人もいます。判断基準を整理した記事もあわせて確認してください。
まとめ
- 採用担当者が職務経歴書を読む時間は30秒程度。職務要約で専門領域・成果・コーディング対応の有無を先出しする
- スキル欄はツール名だけでなく「レベル・経験年数・どんな業務に使えるか」をセットで記載する
- 職務経歴詳細はプロジェクト別に「担当業務・規模・役割・成果」の4要素を揃える
- 数値がない場合は「定性的な成果・継続依頼・評価」の代替表現で補完できる
- ポートフォリオのURLを必ず職務経歴書に記載し、職務経歴書と連動させる
Webデザイナーの職務経歴書で差がつくのは、ツールの豊富さでも経験年数の長さでもありません。採用担当者が読んで「この人の仕事の解像度が高い」と感じられる記述が、書類選考を通過する職務経歴書を作ります。
Webデザイナーの職務経歴書に関するよくある質問
- Webデザイナーの職務経歴書はA4何枚が適切ですか？
-
経験年数3年未満であれば1〜2枚、3年以上であれば2〜3枚を目安にしてください。枚数を揃えることより、採用担当者が30秒でスキャンして必要な情報を拾えるレイアウトになっているかを優先してください。プロジェクト別に整理し、読みやすさを崩さない範囲で情報を収めます。
- 未経験でもポートフォリオがあれば職務経歴書は簡単でいいですか？
-
いいえ。採用担当者がポートフォリオを確認するのは、職務経歴書で通過を判断した後が多いです。未経験の場合こそ、スクール制作の経緯・前職のビジネス経験・学習の本気度を職務経歴書でどう言語化するかが選考通過の鍵になります。ポートフォリオを見てもらうためにも、職務経歴書の完成度を先に高めてください。
- フリーランス・副業案件の経歴は職務経歴書に書けますか？
-
書けます。クライアントワークがある場合は職務経歴詳細に含め、案件の概要・担当業務・成果を記載してください。クライアント名が非公開の場合は「Webメディア運営会社（非公開）」のように記載できます。案件数・対応期間・使用ツールも明記し、実際の成果物はポートフォリオのURLで補完するのが効果的です。
