インターネットで最も多く目にするユーザーインターフェースは何でしょうか?Googleの検索バーでも、Facebookのフィードでもありません。Webサイトにアクセスする前に「あなたが人間であることを確認してください」と尋ねるあの小さなウィジェット、CloudflareのTurnstileとチャレンジページです。1日76億回以上提供されるこのインターフェースを再設計する中で得られた深い知見をご紹介します。詳細はCloudflareブログのTurnstile再設計記事でご確認いただけます。

1. 問題の認識:一貫性の欠如とユーザーのフラストレーション
初期の監査結果は衝撃的でした。さまざまなエラー状態ごとに異なるレイアウト、過度に技術的なメッセージ、曖昧なフィードバックオプションが存在していました。ユーザーは「ウィジェットが時々失敗する」と「ウィジェットが常に失敗する」のどちらを選べばよいか困惑していました。最もフラストレーションが高い瞬間に、ユーザーに考えさせるデザインが問題でした。
2. 基本原則:『Don't Make Me Think』を実践する
Steve KrugのUX原則を中心に再設計を開始しました。目標は一つ、認知的負荷(Cognitive Load)を最小化することです。そのため、Turnstileウィジェットとフルページのチャレンジで同一の情報アーキテクチャ(Information Architecture)に従うよう統一しました。エラー状態も、ヘルプリンクの位置も一貫させ、ユーザーが一度学べばすべての状況に適用できるようにしました。

3. ユーザー調査から得られた4つの教訓
8か国の多様な背景を持つユーザーを対象とした厳格なA/Bテストから、明確な指針が得られました。
- 報告ではなく、支援: 「フィードバックを送信」より「トラブルシューティング」が優れていた。ユーザーは報告より解決を望んでいる。
- 警告ではなく、注意喚起: 赤い背景はユーザーに「失敗」と「無力感」を感じさせた。赤はアイコンのみに限定して使用。
- 簡潔さ、ではなく冗長さ: 限られた空間では、少ないテキストの方が効果的。詳細な説明は専用のモーダル内に移動。
- 全ての人のためのアクセシビリティ: 「技術的準拠」で満足せず、WCAG 2.2 AAA基準を目指す。40以上の言語とRTL(右から左)レイアウトを考慮する。
4. 数十億規模での展開:エンジニアリングの挑戦
Rustで書かれたUIを38言語、16状態にわたって展開することは、エンジニアリングにおける大きな挑戦でした。テキスト長の変動性(英語比30~300%)、RTL言語サポート、ロケールを考慮した番号付けなど、国際化(i18n)の問題を徹底的なテストを通じて解決しました。現在は、チャレンジ解決率(Challenge Solve Rate)、完了までの時間、離脱率の低下など、5つの主要指標で変化の影響を測定しています。

まとめ:セキュリティと人間的な体験は対立しない
この再設計の最大の成果は、強力なセキュリティと優れたユーザー体験が共存できることを証明した点です。技術的複雑さをシンプルさの背後に隠し、一貫した構造で認知的負荷を減らし、最高水準のアクセシビリティを提供することが可能でした。これは単なるUIの改善ではなく、インターネットインフラの責任ある進化です。AIとボット攻撃が高度化する今後も、この「最も多く見られるインターフェース」は、門番ではなくユーザーを助けるアシスタントとして、改善を続けていくでしょう。