Vibe Coding | AI Learning Playground

カラーアクセシビリティをAI開発ルールで守る方法

2026年6月28日更新 2026年9月16日

Vibe Codingで実装したUIコンポーネントの色が、ライト/ダーク、ホバー、選択、フォーカス状態で崩れた経験から、再発を減らすために構築しているハーネスを整理します。

2026年6月21日更新 2026年9月16日

AI Learning PlaygroundをVibe Codingで構築・運用した3ヶ月間を振り返り、技術・設計・運用の3フェーズで得た気づきを整理します。

2026年6月19日更新 2026年9月16日

Claude Designを初期案づくりへ置き、Figma・Canva・Claude Codeと役割を分ける方法を、非技術者にも分かる作業例と判断表で説明します。

2026年6月18日更新 2026年9月16日

Vibe Codingの本来の意味と、会話しながらAIに実装を任せる開発との違いを整理し、試作品と本番利用で人が確認すべき範囲を説明します。

2026年5月17日更新 2026年9月16日

AI支援でMermaid記法を作成した際に実際に発生した5つの問題パターン（特殊文字、矢印の向き、ラベル長、日本語、入れ子）と、それぞれの対処方法を記録します。