Figmaの細部改善・スクロールAPI普及・AIサイトビルダー進化——2026年9月第3週のWebデザイン×AI注目まとめ

2026年9月25日

今週はWebデザイン×AIの分野で「派手な新製品」よりも「積み重ねの改善」が目立った一週間でした。Figmaの地味だが効くアップデート、CSSだけで動くスクロール演出の定着、Awwwards受賞サイトの潮流、そしてAIサイトビルダーが「秒で1ページ」から「本格的な複数ページサイト」へ進化する動きまで、4つのトピックに絞って振り返ります。

1. Figma、地味だが効く「積み重ね」アップデート

Figmaのリリースノートによると、Auto Layoutの自動スペーシングに「Around」「Evenly」という新オプションが追加され、これまでの「Between」と合わせてCSSのjustify-content相当の挙動をFigma上でそのまま再現できるようになりました。デザインとCSSの対応関係がまた一歩近づいた形です。

あわせて、9月のConfigで発表された「プロンプトでシェーダーや生成的プラグインを自作できる」機能に、アニメーション・インタラクション・公開機能・コード閲覧が追加。さらにFigma Weaveには、フレーム単位で映像のトーンを指示できる「Runway Aleph 2.0」が統合され、Figmaのキャンバス上で画像・動画生成をより細かくディレクションできるようになっています。

2. パララックスがJS不要になった、スクロール演出の「普及期」

ここ数年ネイティブ実装が進んでいたCSS Scroll-Driven Animations API（animation-timelineやscroll()/view()関数）が、2026年に入って実務での採用事例が一気に増えています。スクロール位置に応じたパララックスや画像リビール、要素の出現アニメーションをJavaScriptなしでGPU駆動で実装できるのが特徴で、Core Web Vitalsを気にする制作現場との相性の良さが評価されています。仕様の使用例はscroll-driven-animations.styleで多数試せます。

方式	実装	特徴
従来のJSスクロールイベント	scroll イベント + requestAnimationFrame	メインスレッド負荷が高く、カクつきやすい
CSS Scroll-Driven Animations	`animation-timeline: scroll()` / `view()`	GPU駆動、JS不要、60fpsを維持しやすい
GSAP ScrollTrigger等のライブラリ	JSライブラリ + CSSアニメーション	複雑な演出やブラウザ差異吸収に強い

3. Awwwards、今週のSite of the Dayに見る潮流

Awwwardsでは9月15日〜20日にかけて「Aspen Search」（Developer Award受賞）、「Boc.Studio」、「Pensatori Irrazionali」（9月20日付Site of the Day）などが続けて受賞。エージェンシー・スタジオ系の自社サイトが引き続き強く、タイポグラフィと余白の操作、ページ遷移時のマイクロインタラクションで差をつける作例が目立ちました。制作の参考にはTechnologyカテゴリなどジャンル別の一覧も便利です。

4. AIサイトビルダー、「秒で1ページ」から「本格運用サイト」へ

AIサイトビルダー各社が、単発のランディングページ生成から、ECやメンバーシップ、予約システムまで含む「継続運用できるサイト」へと軸足を移しています。Hostinger AI Builderは、簡易サイト向けの「Manualモード」に加え、ECや会員サイトなど複雑な要件に対応する「Agenticモード」を新設。Bluehost AI Website Builderもチャット形式の対話でサイトを継続的に更新できる設計を採用しており、公開後も同じ会話インターフェースで修正を依頼できる点を強調しています。Wixも自社サイト群の学習データを使った「Aria」による生成を継続強化中です。

サービス	特徴的なモード	強み
Hostinger AI Builder	Manual / Agentic	EC・会員サイトなど複雑要件に対応するAgenticモード
Bluehost AI Website Builder	会話継続型	公開後も同じチャットで更新・追加を依頼できる
Wix（Aria）	ADI後継の生成AI	標準エディタに生成結果がそのまま入り編集自由度が高い