PR|無料レッスン20本を受け取る

Webデザイナー ポートフォリオ 架空サイト|実績ゼロでも案件を獲る5つの設計術

◆ ◆ ◆

Home › フリーランスの仕事術 › Webデザイナー ポートフォリ...

FREELANCE CAREER GUIDE
フリーランスの仕事術
Webデザイナー ポートフォリオ 架空サイト|実績ゼロでも案件を獲る5つの設計術
フリ転。

▼ 2問・30秒の診断で、あなたに合う働き方をチェック

目次

この記事でわかること

架空サイトを「課題解決の証拠」として設計すると実績なしでも案件が獲得できること、カフェ・美容室・コーポレートサイトの3業種が評価されやすい理由、作品説明に「課題・方針・工夫・成果想定」の4項目を揃えると発注者の評価基準に刺さること。

実績ゼロのWebデザイナーでも、架空サイトを正しく設計すれば案件獲得につながるポートフォリオが作れます。競合5サイトの共通項目をカバーしつつ、「想定クライアントの課題解決」という視点で制作した作品は、スクール課題との差を明確に示せます。この記事では架空サイトの設計から掲載方法まで5ステップで解説します。

30秒診断全2問・あなたに合う働き方のタイプが分かります

Q1. 今のデザインの仕事で、一番近い悩みは?

この記事の結論

架空サイトをポートフォリオに活用する最大のポイントは、「見た目のよさ」ではなく「課題解決プロセスの可視化」です。想定クライアント・ターゲット・目的を事前に設定し、その解決策としてデザインを位置づけることで、発注者はあなたのデザイン思考を評価できます。作品は3〜5点を目安に、各作品の説明の質を最優先してください。

今日やるべき1つ

架空サイトの制作テーマを1つ決め、想定クライアント・ターゲット・サイトの目的(予約/問い合わせ/来店のいずれか1つ)を紙に書き出してください(15分)。

状況別ショートカット

状況読むべきセクション所要時間
架空サイトのテーマが決まらない架空サイトのテーマは3業種が最短で評価される3分
作ったが練習作品に見える架空サイトは設定の具体化で実績相当に変わる4分
作品説明の書き方がわからないポートフォリオの説明は4項目で案件獲得率が上がる4分
自分の実力を過小評価されないか不安架空サイトと実績の区別は2つのラベルで解決2分
何点作れば営業できるか知りたいポートフォリオは3点から営業開始できる3分

架空サイトのテーマは3業種が最短で評価される

テーマ選びで時間を使いすぎてしまうことは、架空サイト制作あるあるの落とし穴です。カフェ・美容室・コーポレートサイトの3業種は、発注者側が比較しやすく評価コストが低いため、実績ゼロの段階では最も選びやすい選択肢です。

カフェサイトは情報設計の基礎力を示しやすい

カフェサイトに必要な要素は、メニュー・アクセス・予約・雰囲気の伝達という4つに整理されます。これらを過不足なく設計できているかどうかだけで、発注者はあなたの情報設計力を判断できます。テーマとしての「難易度の低さ」がかえって評価の透明性を生み出す、という逆説があります。写真の選定、フォントの統一、CTAの配置という基礎スキルが問われるため、スキルの底上げとポートフォリオ充実を同時に進められます。

Webデザインスクールで架空の美容室やカフェを制作したスクール生は「サービス内容、料金、連絡先などを具体化しないと、練習作品の印象になりやすい」と語っています(Webデザインスクール生「架空のサイト」をポートフォリオに)。

料金・営業時間・席数まで設定することで、架空サイトは「本物に見える」水準に近づきます。この具体性が評価の分岐点です。画像トリミング無料サイト7選も活用すると、写真選定とトリミングの質が一段上がり、カフェサイトの完成度が上がります。

美容室サイトはターゲット設定の幅が広い

美容室サイトは、30代女性向けのナチュラル系から20代男性向けのストリート系まで、ターゲットによってビジュアルの方向性が大きく変わります。この幅の広さは、ターゲット設定スキルを示す絶好の機会です。制作前にペルソナを1人決め(例:30代会社員女性、月2回通う、予算5,000〜8,000円)、そのペルソナに刺さるビジュアルと導線を設計することで、「考えてデザインしている人」という印象を与えられます。ペルソナ設定は6フェーズで完成を参考にすると、架空サイトのターゲット設計が体系的に進みます。

コーポレートサイトは法人向け案件への適性を示す

BtoB向けコーポレートサイトは、事業内容・強み・実績・お問い合わせという4ページ構成が基本です。個人フリーランスへの発注が増えている業種は中小企業が多く、コーポレートサイトの制作経験(架空でも)があると、相手が具体的なイメージを持ちやすくなります。LPと異なり情報量が多いため、ナビゲーション設計・階層構造・読みやすさへの配慮が評価されます。

架空案件で実績を作ったWebデザイナーは「制作背景、ターゲット、制作意図、改善点を説明すれば、デザイン力や考え方を示せる」と述べています(実績ゼロでもOK!未経験Webデザイナーのためのポートフォリオ戦略)。

CHECK

▶ 今すぐやること: 上記3業種(カフェ・美容室・コーポレートサイト)のうち1つを選び、想定する地域と客単価を書き出してください(10分)

Q: 架空サイトのテーマはいくつ決めればよいですか?

A: ポートフォリオに載せる作品数(3〜5点)に合わせ、業種が重ならないように選んでください。同一業種の複数作品よりも、カフェ・美容室・コーポレートサイトと幅を持たせる方が、対応範囲の広さを示せます。

Q: LPや採用サイトを架空テーマにしてもよいですか?

A: 問題ありません。ただし、LPは目的(商品購入・資料請求等)が1つに絞られているため、CTAの設計とコピーライティングの質が特に問われます。ポートフォリオに加える場合は、コンバージョン設計の意図を説明に含めると評価されやすくなります。

架空サイトは設定の具体化で実績相当に変わる

架空サイトを作ったのに「練習作品っぽい」と言われる場合、原因はほぼ設定の具体性不足です。見た目のクオリティではなく、設定の解像度が評価の分岐点になります。

想定クライアントを1社だけ明確に決める

「カフェのサイトを作る」ではなく、「東京都世田谷区の住宅街にある8席の自家焙煎コーヒー専門店(客単価1,000〜1,500円)のサイトを作る」と決めることで、設計上の判断に一貫性が生まれます。席数が少ないなら予約導線を重視する、客単価が高いなら品質感のある写真選定が必要、といった判断がすべて想定クライアントの設定から導かれます。想定クライアントが決まっていないと、デザインの根拠を言葉にできず、説明不足の作品になります。

架空案件を活用して実績を作ったWebデザイナーは「自分が作りたいサイトではなく、想定したクライアントの課題を解決するサイトとして設計することが重要」と語っています(架空サイトで想定クライアントと課題を設定する重要性)。

これは架空サイトと実案件の最大の違いでもあります。実案件ではクライアントから課題を引き出しますが、架空案件では自分で課題を設定する力が問われます。この力を持っているかどうかを、発注者は作品を通じて見ています。

競合調査を2サイト分だけ実施する

架空であっても、同業種の実在するサイトを2〜3サイト確認し、「何が足りていないか」「差別化できるポイントはどこか」を言語化してから制作を始めてください。競合との差別化ポイントを制作意図として明記できると、デザインの根拠が明確になります。競合調査なしで制作した場合、「この業種ではよく見るデザイン」に収まりやすく、差別化が難しくなります。

課題を3つ書いてからワイヤーフレームを作る

制作前に「想定クライアントが抱えている課題」を3つ書き出す習慣は、デザインの根拠を作るうえで効果的です。たとえば「新規客の認知が弱い」「リピート客への再来店促進ができていない」「予約方法がわかりにくい」という3課題から、ファーストビューの見せ方・リピーター向けコンテンツの有無・予約フォームの配置という3つの設計判断が生まれます。課題からデザインが導かれる構造を作っておくと、説明文に書くことが自然に増えます。

CHECK

▶ 今すぐやること: 制作予定の架空サイトの想定クライアントについて、業種・地域・客単価・想定課題3つを書き出してください(20分)

Q: 架空の店舗に架空の住所を載せてもよいですか?

A: 実在する住所の無断使用は避けてください。架空の住所(例:〇〇区〇〇町1-2-3)を使用するか、「住所:非公開(架空案件)」と記載する方法が一般的です。作品に架空であることを明示するラベルを添えれば問題は生じにくくなります。

Q: 競合調査は架空案件でも必要ですか?

A: あると説明の質が上がります。「同業種の一般的なサイトと比べて〇〇を差別化した」という1文が加わるだけで、調査・設計・制作の流れを理解していることが伝わります。

架空サイト制作の進め方を3分で診断

自分がどの段階で詰まっているかを確認することで、次に取るべき行動が変わります。

Q1: 架空サイトの制作テーマは決まっていますか?

YesならQ2へ進んでください。Noなら「テーマは3業種(カフェ・美容室・コーポレートサイト)から選ぶ」が最優先です(所要時間10分)。

Q2: 想定クライアントの課題を3つ書けますか?

YesならQ3へ進んでください。Noなら「想定クライアントを1社設定し、課題を言語化する」が先です(所要時間20分)。

Q3: ワイヤーフレームを作成しましたか?

YesならResult Aへ進んでください。Noなら「ワイヤーフレームで情報設計を先に固める」ステップに進みます(所要時間1〜2時間)。

Result A: ビジュアルデザイン制作フェーズ

ワイヤーフレームに基づいてビジュアルを制作し、PC版とスマートフォン版の両方を作成します。制作後は、「課題・方針・工夫・成果想定」の4項目で説明文を作成してください。

Result B: 設計フェーズ

まず想定クライアントの設定(業種・地域・課題3つ)から始め、ワイヤーフレームに進みます。ビジュアルより設計を先に固めることで、説明に一貫性が生まれます。

CHECK

▶ 今すぐやること: Q1から順番に回答し、自分がどのフェーズにいるかを確認してください(3分)

Q: ワイヤーフレームはどのツールで作ればよいですか?

A: Figmaが最も一般的です。無料プランで十分機能し、ポートフォリオ作品のプレビューURLを発行することもできます。紙のスケッチからスタートしてFigmaに移行する方法も、制作プロセスをポートフォリオに示す際に有効です。Figmaワイヤーフレームの作り方では初心者向けに5ステップで解説しているので、あわせて参考にしてください。

Q: コーディングまで必要ですか?

A: 必須ではありませんが、コーディングの有無は作品説明に明記してください。Figmaのデザインデータのみの作品も、説明が丁寧であれば評価されます。コーディングまで対応しているかどうかは、発注者が業務範囲を判断する際の重要な情報です。

ポートフォリオの説明は4項目で案件獲得率が上がる

架空サイトをポートフォリオに掲載する際、作品画像だけを並べた状態は評価につながりにくい状態です。制作プロセスを言語化できているかどうかが、架空サイトと実績の差を埋める最大の手段です。

「課題・方針・工夫・成果想定」の順で書く

作品説明の4項目は、課題(想定クライアントが抱えていた問題)・方針(それに対してどのようなアプローチをとったか)・工夫(デザイン上の具体的な判断)・成果想定(実装された場合に期待される効果)の順で記述します。たとえば「課題:新規客の認知が弱い→方針:ファーストビューに店の個性を凝縮→工夫:写真のトリミングと余白設計でブランド感を演出→成果想定:初回訪問者の滞在時間が1.5倍に改善すると想定」という構造です。この4項目が揃うことで、発注者はデザイン思考のプロセスを追えます。

担当範囲・ツール・制作期間を明記する

作品ごとに、担当範囲(デザインのみ/デザイン+コーディング)・使用ツール(Figma、Photoshop、VS Code等)・制作期間(例:2週間)を明記してください。この情報は発注者が「この人に何を頼めるか」を判断する際に直接使われます。制作期間は実際にかかった日数を正直に記載してください。架空案件であっても、作業量の見積もり力を間接的に示せます。

PC版とスマートフォン版の両方を掲載する

現在のWeb制作においてレスポンシブ対応は標準要件です。ポートフォリオに掲載する作品画像は、PC表示のみでなくスマートフォン表示も必ず含めてください。デバイスごとにレイアウトの意図が変わること(例:モバイルではCTAを固定表示にする等)を説明に加えると、設計力の高さが伝わります。スマートフォン表示の画像は縦長のスクリーンショットではなく、実機またはデバイスフレーム付きの画像で示すと視認性が高まります。

CHECK

▶ 今すぐやること: 制作済みの架空サイト1点について、「課題・方針・工夫・成果想定」の4項目を各1〜2文で書き出してください(30分)

Q: ワイヤーフレームもポートフォリオに載せた方がよいですか?

A: 載せてください。ワイヤーフレームは「デザイン前の情報設計段階も考えている」という証拠になります。最終デザインとの比較形式(Before/After)で掲載すると、判断のプロセスが伝わりやすくなります。

Q: 説明文の文字数はどのくらいが適切ですか?

A: 1作品あたり200〜400文字程度が目安です。長すぎると読まれにくく、短すぎると制作意図が伝わりません。4項目(課題・方針・工夫・成果想定)をそれぞれ1〜2文で書くと、自然にこの範囲に収まります。

デザインの仕事で単価を上げたい方へ

Webデザインの学び方をLINEで受け取る

LINEで無料で届くもの

  • 20本Webデザインの無料レッスン
  • 全工程Photoshopの解説動画
  • 4本限定のPDF・動画
無料レッスン20本を受け取る

登録1分・情報収集だけでもOK・セミナー参加は自由

タップするとLINEの友だち追加画面が開きます

LINE登録のよくある質問
お金はかかりますか?
LINEの登録と、届くレッスン・動画・PDFは無料です。
どんな連絡が来ますか?
レッスンや動画のほか、無料セミナーの案内が届きます。参加するかは自由です。
やめたいときは?
LINEでブロックすれば、それ以上は届きません。

PR提供: 日本デザインスクール(デザスク)

架空サイト5つの設計術で案件獲得率を上げる

ハック1: 想定クライアント設定で説明の根拠が自動生成される

【対象】: 架空サイトを作り始めたが、説明文に書くことが見つからない方

【手順】: 業種・地域・店舗規模・客単価の4項目を1枚の紙に書きます(15分)。次に、設定したクライアントが抱えているであろう課題を3つ書き出します(15分)。最後に、課題と対応するデザイン上の判断を紐づけてから制作を開始します(制作開始時)。

【ポイントと理由】: 「見た目のよい架空サイト」を作ることに終始すると、発注者の判断基準と噛み合いません。発注者が架空サイトを見るときに確認したいのは「この人は私のビジネス課題を理解してくれるか」という点であり、見た目の完成度よりもプロセスの透明性が評価されます。課題設定を先に行うと、ビジュアルの選択根拠が明確になるため、説明文に書くことが自然に増えます。

【注意点】: 想定クライアントの設定に1時間以上かけることは避けてください。設定は15〜30分で完了させ、残りの時間を制作と説明文作成に使ってください。

ハック2: ファーストビューの3秒ルールでCTA配置が決まる

【対象】: デザインを作ったが導線が弱いと感じている方

【手順】: 完成したデザインのファーストビューを3秒見て「何のサイトか・誰向けか・何をすべきか」が言えるか確認します(5分)。言えない場合、キャッチコピー・ターゲット訴求テキスト・CTAボタンの3要素を再配置します(30〜60分)。その後、スマートフォン表示で同じテストを実施し、CTAがスクロールなしで見えるか確認します(10分)。

【ポイントと理由】: 実務ではファーストビューの情報伝達速度が最優先されます。ユーザーが数秒でページを離脱するかどうかを判断するという傾向はUXリサーチで広く指摘されており、この時間内に「何のサイトか」が伝わらないデザインは、いかに美しくても機能しません。ファーストビューで伝達が完結するデザインを作る習慣は、架空サイトの評価だけでなく実案件にも直結するスキルです。

【注意点】: CTAのデザインに凝ることよりも、CTAの位置と文言の明確さを優先してください。ボタンの色や形に時間をかけすぎると逆効果になります。

ハック3: PC版とスマートフォン版の「比較掲載」で技術力を2倍伝える

【対象】: PC版のみ作成してポートフォリオに掲載している方

【手順】: 制作済みのデザインをスマートフォンサイズ(375px幅を目安)でレイアウトを再設計します(2〜4時間)。次に、PC版とスマートフォン版を並べた比較画像または上下並べ画像を作成します(30分)。説明文に「スマートフォンではCTAを固定表示にした理由」等のデバイス別設計意図を1文追加します(15分)。

【ポイントと理由】: モバイルファーストで設計を始めると、コンテンツの優先順位が明確になります。スマートフォン画面の制約(幅375px・タップ操作)から始めると、「何を最初に見せるか」の判断が自然に絞り込まれます。比較掲載によって「レスポンシブを理解している」という事実が画像1枚で伝わるため、説明文の補足コストも下がります。

【注意点】: スマートフォン版をPC版の単純な縮小版にすることは避けてください。ナビゲーションをハンバーガーメニューに変える・画像比率を縦長に変更するなど、デバイスに応じた設計判断を最低2箇所加えてください。

ハック4: 作品説明の「成果想定」で差別化できる

【対象】: 作品説明に「工夫した点」だけを書いて終わっている方

【手順】: 作品ごとに「このデザインが実装された場合、何が改善されると想定されるか」を1〜2文で書きます(15分)。数値を使える場合は使ってください(例:「予約ページへの遷移率が1.3倍に改善されると想定」)(15分)。成果想定の根拠(競合サイト比較・ユーザー行動の一般的な知見等)を1文追加します(15分)。

【ポイントと理由】: 「成果想定」まで書くことで、あなたがデザインをビジネス結果と結びつけて考えていることを示せます。架空案件では実際の数値を持てませんが、「なぜそうなると考えるか」の根拠を添えることで、思考の質を評価してもらえます。この習慣は実案件に進んだ際にそのままクライアントへの提案資料として使える形式でもあります。

【注意点】: 根拠のない数値は逆効果です。「想定」と明記したうえで、根拠(例:「一般的にCTA改善でクリック率が向上するとされる知見に基づく」)を必ず添えてください。

ハック5: 架空サイト完成後の発信で検索可能な実績を作る

【対象】: ポートフォリオを作ったが案件応募の実績がまだない方

【手順】: 架空サイト完成後、noteまたはZennで「制作背景・課題・設計意図・工夫」を記事として公開します(2〜3時間)。次に、ポートフォリオの該当作品ページにnote記事のリンクを追加します(15分)。SNS(XまたはInstagram)で作品画像と記事URLを投稿し、#ポートフォリオ等のタグを付けます(15分)。

【ポイントと理由】: note等で制作過程を発信する方が、検索・SNS経由の問い合わせ獲得に近道です。ポートフォリオサイト単体の検索順位を上げるより、note記事が個別に検索されることで露出機会が増えます。記事を書くプロセス自体が作品説明の質を高めるため、ポートフォリオの完成度も同時に向上します。フリーランスのnote集客は5ステップで仕事受注まで完結では、note記事から案件につなげる導線設計を詳しく解説しています。

【注意点】: SNS発信を毎日続けることは避けてください。作品1点ごとに1記事を公開することだけを目標にし、発信頻度よりも各作品の説明の深さを優先してください。

CHECK

▶ 今すぐやること: 上記5つのハックのうち、自分の現在の制作フェーズに最も該当する1つを選び、【手順】のステップ1だけを今日中に実施してください(15〜20分)

Q: noteに制作記事を書く場合、架空サイトであることを明記する必要はありますか?

A: 必ず明記してください。記事タイトルまたは冒頭に「架空案件」「自主制作」と記載することで、実案件と誤認されるリスクをなくせます。読者にとっても制作意図を理解しやすくなるため、評価につながりやすくなります。

Q: SNS発信は作品完成前から始めてよいですか?

A: 完成前から始めて問題ありません。ワイヤーフレームの段階・カラー選定の段階等を「制作日記」として発信すると、フォロワーが制作プロセスを追えるため、完成時の反応が大きくなる傾向があります。

架空サイトと実績の区別は2つのラベルで解決

架空サイトをポートフォリオに掲載することは問題ありませんが、実案件と誤認させることは信頼を損ないます。区別の方法はシンプルです。

「架空案件」「自主制作」ラベルを作品に添える

ポートフォリオの各作品に「架空案件」または「自主制作」と明示するラベルを添えてください。この表示は発注者への誠実な情報提供であり、架空サイトの評価を下げるものではありません。むしろ「架空でもここまで考えて作る人」という印象を与えるため、ラベルがあることで信頼度が上がります。

実案件と架空案件を並べる場合は、セクションを分けて掲載することをおすすめします。たとえば「制作実績」と「自主制作・架空案件」というセクション名で分類すると、見る側が情報を整理しやすくなります。

画像・フォント・素材のライセンス確認を先に行う

架空サイトに使用する写真・フォント・アイコンは、商用利用可能なライセンスのものを使用してください。ポートフォリオは営業資料であり商用利用に該当するため、個人利用のみ可能な素材や実在企業の画像を無断で使用することは避けてください。写真素材はUnsplash・Pexels、フォントはGoogle Fonts、アイコンはIconify等の商用利用可能な素材サービスを活用してください。画像フリーアイコン選びは3条件で即決では商用利用安全なサイト8選を紹介しています。制作時に使用した素材のライセンスを記録しておくと、後から確認が必要になった際にすぐ対応できます。

CHECK

▶ 今すぐやること: 制作予定または制作済みの架空サイトに使用する素材(写真・フォント・アイコン)のライセンスを1つずつ確認し、商用利用可否をメモしてください(15分)

Q: 実在する飲食店や企業のロゴ・写真を参考にして架空サイトを作ってもよいですか?

A: 参考にすること自体は問題ありませんが、実在するロゴ・写真をそのまま使用することは著作権・商標権の観点から避けてください。デザインの方向性を参考にする程度にとどめ、素材はすべて商用利用可能なものを使用してください。

Q: 架空の店舗名をポートフォリオに載せてよいですか?

A: 問題ありません。ただし、実在する店舗・企業・商標と同一または類似する名前は避けてください。架空であることを明示したうえで、オリジナルの店舗名を設定してください。

ポートフォリオは3点から営業開始できる

作品数が揃わないと営業できないと考えて、制作に時間をかけすぎてしまうことは珍しくありません。3点の質の高い作品は、10点の説明不足の作品より案件獲得に近づきます。

3点で構成する場合の作品バランス

3点ポートフォリオの基本構成は、コーポレートサイト系1点・カフェまたは美容室系1点・LP系1点という組み合わせが機能的です。この3点は、業種の幅(BtoB/BtoC)・サイト種別の幅(情報サイト/LP)・ターゲットの幅(法人/個人消費者)をカバーできるため、どの業種の発注者に対しても「対応できそう」という印象を与えやすくなります。

各作品に4項目(課題・方針・工夫・成果想定)の説明文と、PC版・スマートフォン版の画像が揃っていれば、3点でも十分な情報量です。

5点に増やす場合の追加方針

3点で営業を始めながら作品を追加していく方法が現実的です。案件応募を進める中で「この業種の作品が足りない」と感じた段階で4点目・5点目を追加する方が、市場のニーズと作品構成を一致させやすくなります。最初から5点揃えることを目標にすると、営業開始が遅れるリスクがあります。

完成後の公開先を2箇所以上に設定する

ポートフォリオの公開先は、専用のポートフォリオサイト(foriio、STUDIO、Wix等)に加え、フリーランス向けのプラットフォーム(クラウドワークス、ランサーズ等)のプロフィールにも同じ情報を掲載してください。フリーランス向けポートフォリオに対応可能な業務・料金の目安・連絡方法を記載すると、発注者が依頼を検討しやすくなります(フリーランスのポートフォリオ作成方法)。なお、フリーランスの仕事につながるポートフォリオの作り方では、実績・価格・著作権の記載ポイントをまとめているので参考にしてください。

CHECK

▶ 今すぐやること: 現在の作品数を確認し、「3点目の作品テーマ・想定クライアント・サイト種別」を決めてください(10分)

Q: ポートフォリオサイト自体も架空サイトと同様に設計すべきですか?

A: ポートフォリオサイトはあなた自身のサービスサイトとして設計してください。ターゲット(どの業種・規模の発注者に依頼してほしいか)を設定し、対応業務・料金目安・連絡先を明記することで、発注者が「依頼できるか」を判断しやすくなります。なお、ポートフォリオサイトのデザインそのものも、あなたのデザイン力を示す作品の1つとして評価されます。

Q: スクール課題の作品はポートフォリオに載せてよいですか?

A: 掲載しても問題ありませんが、架空案件・自主制作と同様に「スクール課題」と明示し、担当範囲と制作意図の説明を添えてください。スクール課題と架空サイトを一緒に掲載する場合は、各作品の位置づけを明確にしてください。

まとめ:架空サイトを課題解決で評価させる:今日からできる5つの行動

架空サイトは、想定クライアントの課題を設定し、それを解決するプロセスを可視化することで、発注者に「デザイン思考」を伝えられる唯一の手段です。見た目のクオリティは大前提ですが、それだけでは実績なしの状態から抜け出すことは難しく、課題・方針・工夫・成果想定の4項目の説明が作品の説得力を決めます。

今日の最初の一歩として、架空サイトのテーマを1つ選び、想定クライアントの業種・地域・課題3つを15分で書き出してください。設定が決まれば、デザインのすべての判断に根拠が生まれます。作品数は3点から始めて、営業と並行して追加していく方法が最もリスクの少ない進め方です。

状況次の一歩所要時間
テーマが決まっていない3業種(カフェ・美容室・コーポレート)から1つ選び、業種・地域・客単価を書く10分
設定が浅い想定クライアントの課題を3つ書き出し、各課題と対応する設計判断を紐づける20分
説明文が書けない「課題・方針・工夫・成果想定」の4項目を各1〜2文で書く30分
PC版のみ制作済みスマートフォン版を制作し、比較画像を作成してポートフォリオに追加する2〜4時間
作品は完成しているが発信していないnoteに制作背景記事を書き、ポートフォリオにリンクを追加する2〜3時間

Webデザイナー ポートフォリオ 架空サイトに関するよくある質問

Q: 架空サイトはポートフォリオに載せてよいですか?

A: 問題なく掲載できます。「架空案件」または「自主制作」と明示し、実案件と区別してください。架空サイトであっても、想定クライアントの課題・制作意図・担当範囲を丁寧に説明した作品は、発注者のデザイン思考の評価対象になります。

Q: 実績がゼロでも架空サイトだけでフリーランスの案件を獲得できますか?

A: 獲得できます。架空サイトの完成度と説明の質が高ければ、発注者は実案件の有無ではなくデザインスキルとプロセスを評価します。3点の作品が揃い、各作品に4項目(課題・方針・工夫・成果想定)の説明が揃っている状態で営業を開始してください。案件獲得後に実績が増えれば、架空サイトを徐々に実績に差し替えていけます。フリーランスが初営業で挫折しないためにでは、実績ゼロの状態から案件を積むステップを詳しく解説しています。

Q: 架空サイトの制作にはどのくらいの時間がかかりますか?

A: 設定・ワイヤーフレーム・ビジュアルデザイン・説明文作成の全工程を含めると、1作品あたり30〜80時間が目安です。コーディングまで対応する場合はさらに20〜40時間追加されます。最初の作品は時間がかかりますが、2点目以降は設計フロー(設定→課題→ワイヤーフレーム→デザイン)が身についているため、作業時間が短縮できる傾向があります。

【出典・参照元】

Webデザインスクール生「架空のサイト」をポートフォリオに – 架空サイトの設定具体化と練習作品との差異に関する考察

実績ゼロでもOK!未経験Webデザイナーのためのポートフォリオ戦略 – 架空案件を活用したポートフォリオ制作と発信方法

架空サイトで想定クライアントと課題を設定する重要性 – クライアント視点での設計アプローチの解説

フリーランスのポートフォリオ作成方法 – フリーランス向けポートフォリオの掲載項目と料金目安

デザインの仕事で単価を上げたい方へ

Webデザインの学び方をLINEで受け取る

LINEで無料で届くもの

  • 20本Webデザインの無料レッスン
  • 全工程Photoshopの解説動画
  • 4本限定のPDF・動画
無料レッスン20本を受け取る

登録1分・情報収集だけでもOK・セミナー参加は自由

タップするとLINEの友だち追加画面が開きます

LINE登録のよくある質問
お金はかかりますか?
LINEの登録と、届くレッスン・動画・PDFは無料です。
どんな連絡が来ますか?
レッスンや動画のほか、無料セミナーの案内が届きます。参加するかは自由です。
やめたいときは?
LINEでブロックすれば、それ以上は届きません。

PR提供: 日本デザインスクール(デザスク)

フリ転編集部 jpndesft
フリーランス専門メディア「フリ転。」編集部。独立・案件獲得・税務など、フリーランスが直面する課題をわかりやすく解説することを使命としています。

フリーランスデザイナーのためのキャリア・案件・税務情報をお届けしています

お問い合わせ →

人気キーワード

フリーランスの案件・単価を調べる

フリーランス求人を探す週1〜2日・リモートOKの案件を毎日自動収集職種別の単価相場を見る48職種の月額単価を実データから集計実務ツールを使う見積・請求書・税金計算など51種を無料で

カテゴリから記事を探す

フリーランスの独立術フリーランスの資金術フリーランス職種図鑑