第3部:実践サイト制作 Step 8 / 14

ポートフォリオサイト制作

ポートフォリオサイトは自分をアピールする名刺代わり。AIを活用して、魅力的なポートフォリオを作りましょう。

ポートフォリオに必要な要素

👋

自己紹介

名前、肩書き、プロフィール写真

💼

実績・作品

過去の制作物をビジュアルで紹介

🛠️

スキル

得意な技術、使えるツール

📧

お問い合わせ

連絡先、問い合わせフォーム

AIでポートフォリオを作成

Step 1: 構成を相談

Webデザイナー向けのポートフォリオサイトを作ります。
以下の条件で構成を提案してください。

【対象】フリーランスWebデザイナー
【目的】案件獲得
【ページ】1ページ(スクロール型)

セクション構成と、各セクションに含める要素を提案してください。

Step 2: ヒーローセクション

ポートフォリオのヒーローセクションを作成してください。

【内容】
・名前:山田太郎
・肩書き:Webデザイナー / UIデザイナー
・キャッチコピー:「使いやすさを、美しさに。」
・CTAボタン:「実績を見る」

【デザイン】
・フルスクリーン
・ミニマルで洗練されたスタイル
・アニメーション:テキストのフェードイン

Tailwind CSSでお願いします。

Step 3: 実績セクション

実績紹介のセクションを作成してください。

【レイアウト】
・3カラムのグリッド(スマホで1カラム)
・各カードに画像、タイトル、カテゴリータグ
・ホバーでオーバーレイと「詳しく見る」表示

ダミーデータ3件分で作成してください。

ポートフォリオのコツ

実績は厳選する

量より質。最も自信のある作品を3〜6点程度に絞る

プロセスも見せる

完成品だけでなく、制作過程や工夫した点も紹介

更新を続ける

定期的に新しい作品を追加して鮮度を保つ

まとめ

  • 自己紹介、実績、スキル、連絡先が基本構成
  • AIに構成→各セクションの順で作成を依頼
  • 実績は厳選して質を重視
  • 定期的に更新して最新の状態を保つ
前へ:AIで画像生成 次へ:ビジネスサイト制作