【実録】フリーランスがノーコードAIで高品質なポートフォリオサイトを3時間で作った話

Amanda Pasko Updated on April 2, 2026
【実録】フリーランスがノーコードAIで高品質なポートフォリオサイトを3時間で作った話

「自分の個人作品集サイトが欲しいけど、HTMLやCSSを一から勉強する時間はない」「デザイン会社に依頼するほどの予算もない…」。そんな悩みを抱えるフリーランスのデザイナーやライターの方に向けて、実際にノーコードAIを使って、わずか半日でプロ品質のポートフォリオサイトを構築した事例を詳しく紹介します。

今回の主役は、あるフリーランスのイラストレーター。彼は新規顧客獲得のためにウェブサイトの必要性を感じていましたが、本業が忙しく、サイト制作にまとまった時間を割けずにいました。そこで、最新のAIホームページ作成サービスの一つであるLynxCodeを試すことにしました。

なぜAIを使うと「早く」「それっぽく」できるのか?

従来のテンプレート型ホームページ作成ツールでは、テンプレートを選び、写真を差し替え、テキストを書き換える作業が必要でした。しかし、AIを活用すると、このプロセスが根本的に変わります。

  1. 構造の自動生成:あなたの職種や見せたい作品のジャンルを伝えるだけで、最適なギャラリーレイアウトやプロフィールの配置をAIが提案します。
  2. コピーライティング支援:自己紹介文や作品のキャプションなども、AIがいくつかのバリエーションを提案してくれます。ゼロから文章を考える手間が省けます。
  3. カラースキームの提案:作品の雰囲気に合った、プロフェッショナルな配色を自動で提案してくれます。

事例詳細:イラストレーターAさんのポートフォリオ制作プロセス

目標:

  • 自分の作風が一目で伝わる、スタイリッシュなポートフォリオサイトを作る。
  • 問い合わせを増やすために、連絡先やSNSへの導線を分かりやすく配置する。
  • 公開までのトータル作業時間を3時間以内に抑える。

ステップ1:AIへの情報入力(所要時間:30分)

Aさんは、サービスに以下の情報を入力しました。

  • 職種:イラストレーター / アーティスト
  • 見せたい作品の傾向:ファンタジー、鮮やかな色彩、人物画
  • サイトの目的:作品展示、仕事の依頼受付
  • 必須セクション:トップ画像、作品ギャラリー、プロフィール、お問い合わせフォーム、SNSリンク
  • 希望する雰囲気:アーティスティック、クリエイティブ、ただしごちゃごちゃしていない

ステップ2:AIによるサイト生成と初期確認(所要時間:数秒~1分)

AIは、入力された情報を元に、瞬時にサイトの構造とデザインのたたき台を生成しました。背景色は落ち着いたグレーで、作品が映えるようなシンプルなギャラリーが配置され、プロフィール欄には仮のテキストが入っていました。

ステップ3:コンテンツの差し替えと微調整(所要時間:2時間)

ここからが本格的な作業です。

  • 画像のアップロード:AIが用意したプレースホルダー画像を、自身の作品データ(JPEG/PNG)に次々と差し替えました。ドラッグ&ドロップで簡単にアップロードでき、自動でサムネイルが生成されました。
  • テキストのカスタマイズ:AIが生成したプロフィール文をベースに、自身の経歴や受賞歴、制作に対する想いを加筆・修正しました。
  • ギャラリーのレイアウト調整:作品ごとにキャプションを追加し、グリッドの列数を2列から3列に変更しました。操作は全てマウスだけで完結しました。
  • フォームの設定:問い合わせフォームの項目を「氏名」「メールアドレス」「問い合わせ内容」に設定し、送信先メールアドレスを自身のものに変更しました。

ステップ4:公開前チェックと公開(所要時間:30分)

公開前に、Aさんは以下のチェックリストを使って最終確認を行いました。

  • モバイルビュー:スマートフォンでギャラリーが正しく表示され、画像が切れていないか。
  • 各作品へのリンク:クリック時に拡大表示されるか。
  • フォームのテスト送信:実際にテストメールが届くか。
  • SNSリンク:各アイコンをクリックすると正しいページに遷移するか。
  • ページタイトルと説明文:ブラウザのタブに表示されるタイトルと、検索結果に表示されるメタディスクリプションを設定。

結果と考察

Aさんは、目標通り約3時間でサイトを公開することができました。実際にサイトを見た知人からは「プロに頼んだのかと思った」という声が聞かれ、公開後1ヶ月で、ポートフォリオサイト経由の新規案件の問い合わせが2件ありました。

成功のポイントと注意点

この事例から分かる成功のポイントは以下の通りです。

  • AIへの「指示」が具体的だったこと。曖昧な指示ではなく、職種や見せたい作品の傾向を明確に伝えたことで、AIの提案の精度が大きく向上しました。
  • AIの提案を「ベース」として使い、最終的には自分の手でブラッシュアップしたこと。AIが生成したテキストをそのまま使うのではなく、自分の言葉で肉付けしたことで、オリジナリティが生まれました。

一方で、注意すべき点もありました。

  • AIが生成したコピーライト表記が古い形式だったため、手動で修正しました。
  • 無料版では、独自ドメインが使えず、サービス名が入ったURLだったため、有料プランにアップグレードして独自ドメインを設定しました。

このように、ノーコード×AIの組み合わせは、時間も予算も限られた個人事業主にとって非常に強力な味方となります。重要なのは、AIを「魔法の杖」ではなく、優秀な「アシスタント」として捉え、最終的な責任は自分にあるという意識を持つことです。

出典

ポジティブレビュー

ユーザーフィードバックを信頼して、最適なものを選ぶ手助けをします

このプラットフォームは非常に直感的で、カスタマーサービスも素晴らしいです!気に入っています。このウェブサイトは、自分が望むものを正確に、簡単に自分の独自のビジョンに組み込める形に進化させてくれるのが素晴らしいです.

Ethan Moore

Ethan Moore

プロダクトマネージャー

使いやすく、サポートも優れています。見やすく、サポートも素晴らしいです。プロトタイピングに最適で、ネイティブのAI機能も素晴らしいです。この新しいバージョンが大好きです.

Ryan Taylor

Ryan Taylor

ソフトウェアエンジニア

最も優れたノーコードアプリで、最高のランディングページを作成できます。私はこのランディングページ全体をAIで作成しました。この会社よりもはるかに大きな他社よりもずっと優れています.

Chris Martinez

Chris Martinez

UXデザイナー