UIの使いづらさにイラッとする!これがフォームで使いにくい最悪なユーザインターフェイスだ -User Inyerface
Post on:2019年7月11日
使いにくいUI、間違いやすいインタラクション、誤解されるデザインパターンを再現したUser Inyerfaceを紹介します。ベルギーの制作会社「Bagaar」による、使いにくい最悪なユーザインターフェイスを楽しむゲームです。
けっこうイラッとするので、心に余裕がある時にお楽しみください。

という訳で、さっそくUser Inyerfaceのゲームを試してみました。

ゲームをスタートしようとクリックしたら、NOボタンw
「次のページに行くにはここをクリックしてください」の「ここ(HERE)」をクリックして、スタートです。

ゲームは全部で、4ページです。
1ページ目は、パスワードとメールの入力フォーム。入力するパスワードとメールは適当で大丈夫です。

おぅ、画面を見ただけで、つっこみどころが満載です。キャンセルでかすぎ!
まずは、適当にパスワードを入力してみます。

エラー、出ました!
- パスワードには少なくとも10文字が必要。
- パスワードには少なくとも1つの大文字を含むべき。
- パスワードには少なくとも1つの数字が必要。
- パスワードにはあなたのEメールの少なくとも1文字を必要。
- パスワードは少なくとも1つのキリル文字を含めることが可能。
メールアドレスの文字とかキリル文字とか、、、キリル文字は、「きりる」と入力すると辞書で変換できると思います。

そして、入力するのに一定時間がすぎると、急いでのメッセージが表示されます。仕方無いので、閉じるために右上のボタンをクリックすると、、、

拡大ボタンかい!
閉じるは、左下の「©lose」でした。

1ページには他にもいろいろ仕込まれているのですが、2ページ目に進みます。

プロフィール写真をアップロードしようと、ボタンをクリックすると「Download」ボタン、、、こんなアバターの画像なんていらない。
アップロードは、グレーテキストのuploadをクリックして、今ダウンロードしたアバター画像をアップロードしました。役に立ったw

その下では、興味があることを3つ選択します。
よく見ると、「Select all」「Unselect all」の罠ボタンが!

3ページ目は、情報入力フォーム。

年齢を入力するのに、スライダーは使いづらい!

国を選ぶのは、国旗かい! しかもモノクロ、、、

最後の4ページ目は、フォームのスパム対策で見かけるCAPTCHA(キャプチャ)。「glasses」をチェックします。これは、簡単簡単!

と思ったら、チェックが画像の下ではなく、画像の上!

無事終了♪
イラッとしましたが、意外と楽しめました。
sponsors