AIファーストの時代におけるウェブインターフェースをデザイナーと開発者が再考すべき理由

\ 私は、モダンなウェブフレームワーク、SEO、AIツールの交差点で過ごしてきた実践的な開発者であり、アーキテクトです。ユーザー行動、検索、AIが私たちの足元で変化している中、インターフェースのデザイン方法が同じままでいられると装うことは日々難しくなっています。この記事は、新しい種類のインターフェースについてです—単なる流行のコンポーネントの集まりではなく、人間がウェブアプリケーションとどのように対話するかという異なるモデルについてです。

これは、AIチャットと従来のウェブサイトの交差点で何が起こるのか—そして、それが今後5〜10年の製品を構築するデザイナー、開発者、ビジネスにとって何を意味するのかについてです。

---

ウェブの使い方を学んだ方法

過去20年間、ウェブは驚くほど予測可能でした。ページがあります。そのページには、ヘッダー、フッター、ナビゲーション、隣接するページへのリンクがいくつかあり、時には検索ボックスもあります。もっと深いところには、フィルター、カテゴリー、タグ、無限のページネーションが存在します。メンタルモデルはシンプルです：ウェブは図書館であり、各サイトは独自のカタログと棚を持つ小さなプライベートコレクションです。

正しい「棚」にたどり着くためには、まず司書がどのように考えるかを理解する必要があることを学びました。ウェブでは、その司書は情報アーキテクチャです。単に「認証に関する何か」を探すのではなく、この製品では、ドキュメントは「Documentation → API → Authentication」にあり、ガイドは別の場所にあることを学びます。数回のクリックと数分のスクロールの後、あなたはその製品に「慣れた」と感じ始めます。

GoogleやBingのような検索エンジンは、このモデルを置き換えるのではなく、増幅しました。それらはすべてのライブラリの上にあるグローバルカタログになりました。しかし、すべての検索結果は依然として同じでした：ページのリスト。私たちはGoogleで検索し、5〜10のタブを開き、異なるサイトに散らばった断片から手動で答えを組み立てることに慣れました。それは正常に、さらには避けられないことのように感じました—それがウェブの仕組みですよね？

AIチャットボットが古いメンタルモデルを壊した方法

そして、AIチャットアプリへの大規模なアクセスが到来しました。最初、それらはおもちゃのように見えました：つついて遊ぶのが楽しく、ジョークを言うことができ、時には自信を持って間違ったことを幻覚することもありました。しかし非常に速く、微妙だが重要な変化が起きました—技術ではなく、人々が質問をする方法についての考え方です。

人々は自分の考えを「2〜3のキーワード」に圧縮することをやめました。「buy sneakers nyc」と入力する代わりに、「ランニング用ではなく、日常の歩行用の快適なスニーカーが必要です。予算は100ドル以下で、NYCでの受け取りか速い配送のどちらでも大丈夫です」と書き始めました。従来の検索エンジンでは、このような問い合わせは奇妙に感じます。チャットでは、それは自然に感じます。そして「古いウェブ」にとって危険な部分は、この瞬間、ユーザーはもはや答えがどこから来るのかを気にしないということです。

認知モデルが変化しています。以前は、ユーザーは「検索エンジンが理解し、半分関連するリンクを提供するように、これをどのように表現すればいいのか？」と考える必要がありました。今、質問は「人間に説明するように、これをどのように説明すればいいのか？」です。それが「機械に適応する」と「人間のように話す」の違いです。チャットは技術的な規律のレイヤーを取り除きます：ユーザーは正確なページ名、正しい製品用語、またはドキュメントの構造を覚える必要はありません。彼らは自分の状況を説明するだけでよく—そして答えが十分に良ければ、彼らはあなたのサイトを全く訪問しないかもしれません。

---

AIがそれほど賢いなら、なぜまだウェブサイトが必要なのか？

この考え方を極端に押し進めると、過激な質問が生まれます：AIがほとんどの質問に答えられるなら、なぜウェブサイトが必要なのでしょうか？おそらくすべてが1つの普遍的なチャットウィンドウに移動し、ページ、ナビゲーションバー、ランディングレイアウトは初期のウェブデザインの博物館の遺物になるでしょう。

技術的には、答えはほぼ「はい」です。チャットインターフェース内でほぼすべてが行われる世界を想像することは可能です：製品を見つけてチェックアウトすることから、契約を締結し、サブスクリプションを管理することまで。多くの領域で、私たちはすでに半分そこにいます：内部サポートボット、スクリプト化されたカスタマーサービス、電話で人間のふりをする音声アシスタントなど。

しかし、人間の経験とビジネスのレベルでは、状況は非常に異なります。ウェブサイトは単なる機能ではありません。それはまた、光と音と風景を持つ舞台でもあります。それはブランドが独自の言語で話すことができる空間です—色、構成、アニメーション、視覚的な比喩を通じて。チャットは会議室です。明確化、交渉、素早い質問をするのに最適です。雰囲気やアイデンティティを構築するのは苦手です。チャットでは、すべてのブランドがほぼ同じに見えます：テキストバブル、おそらくアバター、少し異なる声のトーン。

ビジネスにとって、それは単なる美的な悲劇ではありません。それは信頼、差別化、長期的な関係へのリスクです。視覚言語は、インターフェースの背後に実際の製品、実際のチーム、実際のストーリーがあることを示す方法です。すべてが灰色のチャットパネルに崩壊すると、残されるのは体から切り離された「声」だけです—そしてその声が実際にはない誰かのふりをするのははるかに簡単です。

だから、純粋なチャットはウェブサイトを「殺す」ことはありません。以前はページをナビゲートする必要があったタスクの大部分を吸収するかもしれません。しかし、すべてを置き換えることはありません。なぜなら、人々はまだ製品を「見る」ことを好み、単に「話す」だけではないからです。

なぜ古いページベースのウェブがAIの世界で壊れるのか

とはいえ、古い「すべてはページである」というアプローチも2025年の現実との接触に耐えられません。成熟したSaaS製品を考えてみてください：何年もの開発、数十のセクション、何百ものドキュメントページ、ブログ投稿、ランディングページ、オンボーディングガイド。各コンテンツは作成された時点では意味がありました：「ユーザーが圧倒されないように、これを別のページに置きましょう」。

しかし、ユーザーの視点からは、複雑さが蓄積します。彼らはどのページに答えがあるのかわかりません。10の類似した記事のうち、どれが最新のものかわかりません。ブログ、ドキュメント、変更履歴に散らばった断片をどのように接続するかわかりません。彼らはコンテンツの手動「統合テスト」を強いられ、画面をクリックしながら部分的な答えを精神的に統合して使用可能なものにします。

この文脈では、AIは合成装置として機能します。複数のページから意味を引き出し、それらを新鮮で一貫性のある答えに変えることができます。クラシックなウェブUXはデザイン上これを行うことができません。それは「このページを表示する」という考えに基づいて構築されており、「この答えを組み立てる」ではありません。しかし、AIチャットにも弱点があります：完全なパスを示すことはめったにありません。結論を提供しますが、形式—構造、コンテキスト、システム内でのその場所—を提供することはめったにありません。

劇場の比喩を拡張すると、従来のウェブサイトは全体の劇を見る舞台です。AIチャットは自分の言葉で物語を再話する批評家です。時にはそれがまさに望むものであり、時にはそうではありません。いずれにせよ、それは異なる経験の平面です。その緊張は、ハイブリッドインターフェースの必要性を生み出します：表示と回答の両方ができるもの。

新しいインターフェース：並列体験ストリーム

これが私たちを重要なアイデアに導きます。新しいインターフェースは「隅にチャットウィジェットがあるウェブサイト」でも、「時々ブラウザタブでウェブビューを開くチャット」でもありません。新しいインターフェースは、1つの画面上で共存する複数の並列体験ストリームを意識的に設計したシステムです。

1つのストリームは会話型です。これは、単なるURLではなく、タスクを理解するAIであり、あなたと会話できます。それは道筋を提案し、明確化の質問をし、行き止まりに入る前に警告することができます。もう1つのストリームは視覚的および構造的です：ページ、ダッシュボード、テーブル、マップ、フォーム—フォーカス、階層、アクセシビリティ、ブランド表現を必要とするすべてのもの。3番目のストリームはビジネスロジックとデータです：役割、権限、制約、ワークフロー、およびシステムの実際の状態。

重要な変化は、これらのストリームがもはや「一つずつ」—最初にチャット、次にUI、そしてチャットに戻る—実行されないことです。それらは同時に実行できるし、そうすべきです。ユーザーはAIと会話し、同時にインターフェースが進化するのを見ます。インターフェースが何かを提案し、ユーザーはチャットで実際に意味したことを明確にします。対話と視覚層は注目を競い合うのをやめ、同じチームでプレイし始めます。技術的には、これはスロットベースのレイアウトと並列ルートに向かわせます：インターフェースは独立した領域に分割され、それぞれが独自のライフサイクルを持ち、すべてが共有シナリオによって調整されます。

なぜスロットと並列ルートが意味を持ったのか

ある時点で、これは抽象的なデザインの議論ではなくなり、私自身のプロジェクトの1つで具体的なアーキテクチャの問題に変わりました。

要件は次のようなものでした：

• 左側に製品を認識するAIチャットを配置し、ベクトル検索を通じて内部ドキュメントと外部知識にアクセスできるようにする。
• 右側にページを表示する—静的なマーケティングコンテンツから複雑な認証済みUIまで。
• 右側のエラーがチャットを殺したり、会話をリセットしたりしないようにする。
• SEOを保持する