WebサイトのUX問題をソースコードから検出するプロンプト手法

本記事では、LLMを活用し、ソースコードからユーザビリティの問題を自動で検出する手法について紹介します。

Webサイトやアプリの開発において、ユーザビリティ評価は欠かせない工程です。しかし通常は、専門家による時間のかかる分析が必要です。そのため、小規模チームや開発初期の段階では、十分なリソースを割けないという課題がありました。

そこで、LLMによる自動評価を可能にするプロンプト設計の工夫や、評価結果の一貫性に関する詳細な検証内容について取り上げます。

背景

Webサイトの品質を評価するうえで、ユーザビリティは非常に重要な指標です。たとえ多機能で高性能なサイトであっても、ユーザーが基本的な操作に迷うようでは、その価値が十分に発揮されません。操作が直感的でないインターフェースは、ユーザーの離脱を引き起こし、ひいてはビジネス上の損失につながることもあります。

ユーザビリティの問題を見つけるためには、これまで主に2つの方法が用いられてきました。

1つ目は「ユーザーテスト」で、実際のユーザーに操作してもらい、その様子を観察することで課題を洗い出す手法です。現実に即した貴重なフィードバックが得られる一方で、テスト参加者の募集や観察の実施に時間とコストがかかるのが難点です。

2つ目は「ヒューリスティック評価」と呼ばれる方法で、ユーザビリティの原則に基づいて専門家がインターフェースをレビューする手法です。ユーザーテストよりも手早く実施できる利点がある反面、評価の内容が専門家によってばらつくことも多く、小規模なチームでは評価自体が困難になる場合があります。

そこで最近は、LLMを活用した自動評価に注目が集まっています。LLMはソースコードを解析し、自然言語で与えられた指示を理解できるため、ヒューリスティック評価の原則をプロンプトとして入力すれば、コードから直接ユーザビリティの問題を検出できる可能性があります。開発初期では、まだ画面が表示できない段階でも、HTMLやCSSといったコードだけで評価を行えるため、開発サイクルへの組み込みが容易です。

本記事では、ユーザビリティ評価のプロンプトフレームワークを取り上げます。これをLLMに与えることで、専門家と同様の視点でコードを分析させる仕組みを構築しています。