Skip to content

PORTFOLIO_CONTENT_PLAN.md

Latest commit

 

History

History
223 lines (171 loc) · 7.07 KB

PORTFOLIO_CONTENT_PLAN.md

File metadata and controls

223 lines (171 loc) · 7.07 KB
Raw

ポートフォリオ コンテンツ計画書

目的

エンジニアとしての経験・スキル・作品を効果的に見せるポートフォリオサイトのコンテンツを計画する。

サイト構成

1. ホームページ（ヒーローセクション）

目的: 訪問者に強い第一印象を与え、誰であるかを簡潔に伝える

必要な情報

  • 名前/ハンドルネーム: RyuZU (ペンネーム) / Atsuki Katayama (本名)
  • キャッチコピー案:
    • "10年の経験を持つ、大学1年生エンジニア"
    • "From Minecraft to Full-Stack - 小4から始めたプログラミングの旅"
    • "あらゆる技術スタックを操るマルチスタックエンジニア"
  • 専門分野: フルスタック + インフラ + ML/DS
  • 経験年数: 10年（小学4年生から）
  • 一言アピール: （要検討）

ビジュアルデザイン案

  • ネームプレート画像: /public/images/nameplate.svgを活用
  • ヒーローイメージ:
    • Minecraftのピクセルアート風要素を取り入れる？
    • 技術スタックのアイコンを浮遊させるアニメーション
  • レイアウト:
    • 大きなタイポグラフィでRyuZU
    • サブテキストで本名を小さく表示
    • 経験年数をビジュアル化（タイムライン風）

コンテンツ案

RyuZU
Atsuki Katayama

🎮 → 💻 10 Years of Coding Journey
Started with Minecraft, Now Building Everything

[スキルアイコンのアニメーション表示]
Backend | Frontend | Infrastructure | ML/DS

2. About（自己紹介）ページ

目的: より詳細な背景情報と人となりを伝える

必要な情報

  • 現在の所属: 慶應義塾大学 環境情報学部 1年
  • 現在の活動: 法律事務所向けDX会社 創業
  • 将来のビジョン: AR×AIによる次世代UX・エンタメ分野
  • 興味・関心分野: AR, AI, ゲーム開発

コンテンツ案（最小限のテキスト＋ビジュアル）

🎓 慶應義塾大学 SFC
🚀 法律DXスタートアップ 創業
🎯 Vision: AR×AI = Future UX

[タイムライン表示]
小4: Minecraft → プログラミング開始
↓
現在: 大学1年 & 起業
↓
Future: AR×AI エンタメ

ビジュアルデザイン案

  • タイムライン: 縦or横スクロールで経歴を表示
  • アイコン中心: 文字を最小限に
  • インタラクティブ: ホバーで詳細表示

3. Skills（技術スタック）

目的: 技術的な能力を体系的に提示（言語&分野別に自信度と経験を視覚化）

スキル表示フォーマット案

各スキルに対して以下を表示:

  • 自信度: プログレスバーまたは5段階の視覚表現
  • 経験年数: タイムラインまたは数字
  • プロジェクト数: アイコンで実績を表示

カテゴリ別スキル（詳細は要ヒアリング）

🖥️ バックエンド (自信度: ★★★★★)

言語: Java • Kotlin • TypeScript • Python フレームワーク: Spring Boot • Ktor DB: MySQL • PostgreSQL • Redis

🎨 フロントエンド (自信度: ★★★★☆)

フレームワーク: React • Vue.js (3年) 言語: TypeScript スタイリング: TailwindCSS

🏗️ インフラ・クラウド (自信度: ★★★★☆)

オンプレ: Proxmox • Kubernetes クラウド: AWS • GCP CI/CD: GitHub Actions

🤖 機械学習・データサイエンス (自信度: ★★☆☆☆)

実績: プレイヤー行動分析 ツール: Python • LLM活用

🎮 大規模リアルタイムシステム開発 (旧: Minecraft開発)
  • 実績: 250人同時接続、7000人コミュニティ
  • 開発内容:
    • PvP試合システム
    • クロスサーバーチャットシステム
    • ショップ/経済システム
  • 技術的特徴:
    • 疎結合アーキテクチャ設計
    • 高負荷対応とパフォーマンス最適化
    • Spigot/Paper API活用

ビジュアルデザイン案

  • インタラクティブなスキルマップ: ホバーで詳細表示
  • レーダーチャート: 分野別の習熟度を一目で
  • タイムライン表示: いつから使い始めたかを可視化
  • アイコン重視: 各技術のロゴを活用

4. Works/Projects（作品・プロジェクト）

目的: 実際の成果物で実力を証明（ビジュアル重視、最小限のテキスト）

掲載予定プロジェクト

  1. RTM - リアルタイムメッセージングシステム

    • 🎮 250人同時接続対応 @azisaba.net
    • 🔗 クロスサーバー通信
    • 🏗️ クリーンアーキテクチャ
    • Tech: Java • Kotlin • Redis • Discord API

  2. Minecraft Mod翻訳ツール

    • 🤖 LLM活用自動翻訳
    • 🌏 日本語化の課題解決
    • 🔄 Python → Tauri移行
    • Tech: Python • Tauri • LLM API

  3. 法律DXプラットフォーム (現在進行中)

    • 🏢 法律事務所向けDX
    • 📊 業務効率化
    • Tech: (詳細は要確認)

プロジェクト表示形式

  • カード形式: 画像メイン、ホバーで詳細
  • タグ表示: 使用技術をアイコンで
  • 実績数値: ユーザー数、パフォーマンス等を視覚化

5. Contact（連絡先）

目的: 興味を持った人が連絡を取れるようにする

連絡方法（config/contacts.tsで一元管理）

  • GitHub: @Y-RyuZU
  • Twitter/X: @MC_Y_RyuZU
  • Discord: (X/GitHubから連絡を誘導)
  • LinkedIn: (後で追加予定)
  • メール: 直接公開せず、SNS経由で連絡を推奨

実装方針

// src/config/contacts.ts
export const CONTACTS = {
  github: "Y-RyuZU",
  twitter: "MC_Y_RyuZU",
  linkedin: "", // 後で設定
  discord: "DM via Twitter/GitHub",
  email: null, // SNS経由を推奨
}

実装優先順位（リーンスタート重視）

🚀 第1フェーズ（MVP - 1週間目標）

必要最小限でまず公開可能な状態に

  1. ホームページ

    • ヒーローセクション（名前、キャッチコピー）
    • スキルアイコンの羅列（詳細なし）
    • プロジェクトカード（3枚）へのリンク

  2. 簡易Contact

    • GitHub、メールのリンクのみ
    • フッターに配置

🎨 第2フェーズ（2-3週間目標）

見た目と機能の充実

  1. Aboutページ実装

    • タイムライン
    • ビジョン

  2. Skillsセクション強化

    • インタラクティブなスキルマップ
    • 自信度の可視化

  3. Projects詳細ページ

    • 各プロジェクトの個別ページ

✨ 第3フェーズ（1ヶ月後）

差別化要素

  1. アニメーション追加

    • Framer Motion活用
    • パララックス効果

  2. ダークモード対応

  3. ブログ機能 (Directus連携)

メモ・追加アイデア

（ここに思いついたアイデアを随時追加）

最終更新: 2025-01-18