/ SITE
ポートフォリオを、
個人ホームページに変える
ポートフォリオ専用サイトではなく、いま作っていることを気軽に置ける場所にするための設計メモ。
ポートフォリオだけでは収まらなくなった
もともとは開発したものを紹介するポートフォリオを考えていました。でも、作っているものはWebサービスだけではありません。推し活向けのOshiCalendar、短時間で遊べるブラウザゲーム、ローポリ素材、LLMの実験など、作る理由も使い方もばらばらです。
仕事向けの実績だけを見せると、この寄り道の多さが伝わりません。そこで、個人ホームページを本体にして、ポートフォリオはその一部として置くことにしました。
ページの役割を分ける
Homeは「いま何をしているか」がすぐ分かる入口。Projectsは公開中・制作中の作品を横断して見る場所。Playgroundは遊べるゲームと実験、Notesは制作中に考えたことを書く場所です。仕事について必要な情報はWorkにまとめました。
最初から全部を詳しく紹介しようとせず、作品が増えたり進んだりしたときに、それぞれの置き場所へ少しずつ追加する形にしています。
可愛さは残し、何を作っているかを見せる
デザインでは、柔らかいクリーム色をベースにミントやピーチなどを使いました。最初は飾りが多すぎたり、反対にシンプルに寄りすぎたりもしたので、実際の制作物が分かるモチーフへ絞りました。
カレンダー、ゲーム、ローポリといった具体的なテーマを小さなイラストにしています。実在しない画面のスクリーンショットや、見た目のためだけの数字は置かない方針です。スマホ表示とアニメーションを減らす設定も大事にしています。
ゲームを壊さず、サイトだけ入れ替える
ホームページはAstroで静的HTMLを生成し、Cloudflare Workersの静的アセット配信を使っています。ゲームは別のWorkerでAPIと静的ファイルを配信します。
同じドメインでも /games/ の経路を別にすることで、文章やデザインの更新がゲームの共有カウンターへ影響しないようにしています。公開前にはworkers.devのプレビューで確認し、ゲームのURLを残して本番の入口を切り替えました。
更新しやすいことを優先する
作りかけのものは「開発中」と書きます。公開していないものを遊べるようには見せません。制作メモも、実際のコードや検証結果から書けることを中心にします。
サイトが完成品の展示だけでなく、次の制作につながる記録の置き場になればいいと思っています。