デザイン・UI

AwwwardsとCSS Design Awardsの直近受賞サイトを手がかりに、リキッドグラス再浮上、ノイズ×メッシュグラデーションの質感表現、ネオブルータリズムとの二極化、カーソル演出まで、2026年9月のUI/UXトレンドを整理する。

画面幅ではなく「コンポーネントが置かれた場所」を基準にするコンテナクエリを軸に、流体タイポグラフィ・可変フォント・サブグリッド・色コントラスト・モーション配慮まで、2026年のレスポンシブ設計の実務ポイントをまとめた。

Figma・Framer・Webflowが相次いでAIエージェントによるサイト直接編集を強化。今週のWebデザイン×AIアップデートを3本まとめました。

CSSだけで書けるスクロール連動・スクロールトリガーアニメーションの違いと対応状況を整理し、AIに崩れにくいコードを書かせるプロンプトとチェックリストを紹介します。

Bolt.newのプロンプトキューと学習データ提供型の新エージェント「Forge」、v0のモデル別クレジット制を整理。AIサイトビルダーを料金とデータ条件で選ぶ視点をまとめます。

モーション・3D・シェーダー背景・ベクター素材をAIで作るツールを、Webサイトへの組み込み方の視点で使い分け表にまとめました。

Google Labsのオープン仕様DESIGN.mdをlintで検証し、MCPやshadcn/uiプリセットと組み合わせてClaudeのUI出力を安定させる方法をまとめました。

Awwwards 2026年9月のSOTDと2026年のトレンド記事から、配色の絞り込み・パフォーマンス・アクセシビリティ、丸角の均質化への指摘を整理し、AIで作る際のコツをまとめました。

AI生成UIで抜けがちな3つの基本(コンテナ基準の流体タイポ、prefers-reduced-motion、フォーカス/コントラスト)を、コピーできるCSSとチェック表で整理します。

FramerのCMS更新、Figmaのデザインエージェントとモーション機能、Spline利用規約の改定、スクロール演出プロンプトの流行を週初めに整理。