デザイン・UI

Figmaの地味だが効くアップデート、CSSネイティブなスクロール演出の定着、Awwwards今週の受賞サイト、AIサイトビルダーの「多ページ化」まで、この一週間のWebデザイン×AIトピックを4本まとめました。

CSS Scroll-Driven Animations、GSAP ScrollTrigger、AI生成Three.js、Spline V2×MCP、Unicorn Studio、AI動画のコマ送り演出まで、リッチなWebデザインを作る最新の技法とツールをまとめました。

Figma Makeのプロパティパネル、Lovableの Aesthetics、v0のVisual Design Modeなど、プロンプトに頼らず直接編集できる機能が主要AIサイトビルダーに広がっている。5サービスの最新動向と使い分けをまとめた。

SplineがAIエージェント時代の3Dエディタへ全面刷新、RiveはCLIとテキスト形式でエージェント連携、HiggsfieldはBlender・Claudeと直結。2026年9月のデザイン系AIツール最新事情をまとめる。

Claude Codeで作るUIが金太郎飴になる問題に、Anthropic公式frontend-designスキル、コミュニティ製taste-skill、DESIGN.md方式、shadcn/ui MCPの4つの技でどう対処するかを整理しました。

v0のAPI正式提供、Figma Makeのプロパティパネル、LovableのSEO/AEOツール、FramerのWorkshopなど、AIサイトビルダー4サービスの直近アップデートを比較する。

Figma Config 2026のコード・モーション・シェーダー刷新、Riveのステートマシン、Recraftのベクター生成、MotionSitesのプロンプト集まで、Webデザイン制作を支えるAIツールの最新動向をまとめる。

Claude PreviewやChrome DevTools MCP、Playwright MCPでUIを実際に見せて直させる、スクリーンショット・フィードバックループの組み方を整理する。

ガラスモーフィズムの次章「リキッドグラス」と、ブランドが動き出す「モーション・アイデンティティ」。2026年8月のAwwwards受賞サイトや実装リソースとあわせて、いま押さえておきたいUI/UXの潮流をまとめます。

可変フォント、CSS clamp()による流動的タイポグラフィ、モジュラースケール、行長・行間、WCAG 2.2のコントラスト基準まで、2026年時点のWebタイポグラフィの基礎をまとめて解説します。