GitCity

GitCityとは？

GitCityは、ユーザーのGitHubコントリビューション履歴をインタラクティブな等角3Dの街スカイラインに変換します。基本コンセプトは、公開コントリビューションのある各日が「建物」となり、コミット活動量が高さを決定し、グリッドではなく視覚的に活動を探索できる点です。

GitHubユーザーがコントリビューションデータを魅力的に表示したい場合に適しており、GitHubユーザー名を入力するだけでREADMEや開発者ポートフォリオにSVGを埋め込めます。

主な機能

• GitHubコントリビューションからインタラクティブ等角3D街: 公開コントリビューション活動に基づくスカイラインを構築し、一目でパターンを把握可能。
• 街をドライブするシミュレーション: 街を「街路レベル」からナビゲートしてスカイラインを空間的に確認できるシミュレーションモード搭載。
• テーマ切り替え（6テーマ）: Matrix、Noir、Aurora、Ocean、Gold、Iceなど、好みに応じたテーマビジュアルを提供。
• 年・月・週による時間フィルタリング: フル履歴表示だけでなく、特定期間に限定した可視化が可能。
• GitHub README・ポートフォリオ向け埋め込みSVG: 開発者プロフィールやプロジェクトページに可視化を埋め込めるSVGを生成。
• GitHubユーザー名だけでゼロコンフィグ: 入力したユーザー名から公開コントリビューションデータを自動取得し、セットアップを最小限に。

GitCityの使い方

1. GitCityを開き、GitHubユーザー名を入力。
2. GitCityが公開コントリビューションデータを取得し、コミットのある日が建物として街をレンダリング。
3. テーマコントロールで外観を変更、フィルターコントロールで年・月・週に絞り込み。
4. 共有したい場合、埋め込みSVGオプションでGitHub READMEや開発者ポートフォリオ用の埋め込みを生成。
5. （オプション）シミュレーションモードに切り替えて街路レベルから街をドライブして探索。

ユースケース

• 個人GitHub READMEの可視化: 生成SVGをREADMEに埋め込み、静的チャートではなく3Dスカイラインでコントリビューション活動を表示。
• ポートフォリオ表示: 開発者ポートフォリオページに街可視化を追加し、コーディング活動を一目で確認。
• 期間限定レビュー（月・週）: 月や週でフィルタリングし、短期間のコントリビューション量変化をレビュー。
• 美学による活動ストーリーテリング: プロジェクトページやSNSプロフィールなどでNoirやAuroraなどのテーマを切り替えてスカイラインを提示。
• コントリビューションの探索「ウォークスルー」: シミュレーションモードで街をナビゲートし、コミット密度のパターンを視覚的に解釈。

FAQ

• GitCityはどのようなデータを使用しますか？ 入力したユーザー名に対する公開GitHubコントリビューションデータを取得します。

• GitCityはコミットをどのように3D街にマッピングしますか？ ページによると、コミットのある各日が建物となり、コミット数が多いほど塔が高くなる。

• 可視化を特定期間に限定できますか？ はい。年・月・週のフィルターを備えています。

• 他のページに可視化を埋め込めますか？ はい。埋め込みSVGを提供し、GitHub READMEや開発者ポートフォリオ向けです。

• GitHubユーザー名以外に設定は必要ですか？ ページではGitHubユーザー名入力のみのゼロコンフィグと記述。

代替案

• GitHubコントリビューション可視化（2Dヒートマップ/チャート）: 3D街やシミュレーションの代わりにグリッドやチャートで表示。シンプルだが空間性が低い。
• ポートフォリオ/静的GitHubステータスウィジェット: バッジや静的サマリーを生成するツールは埋め込みやすいが、ドライブ体験や時間指定3Dビューは提供しない。
• GitHub APIデータからのカスタム可視化: DIYでカスタムビジュアル（3D含む）を作成可能だが、ゼロコンフィグではなくユーザー側でセットアップ・メンテナンスが必要。