![](https://kisa.ne.jp/wp-content/uploads/2021/04/cantunsee1-01-1024x704.jpg)
こんにちは。イラストレーター・デザイナーのkisa(@kisa.ne.jp)です。
デザインが良いかどうか判断するためには、デザインを見る目が必要です。
今回は、ゲーム感覚で「UIデザインを学習できるWebサイト」をご紹介します。
Contents
UIデザインとは
UIデザインとは、「ユーザーがWebやアプリを、わかりやすく快適に使うための設計」です。
UIは、User Interface(ユーザーインターフェース)の略で、機械とユーザーの接点という意味になります。
Can’t Unsee
![](https://kisa.ne.jp/wp-content/uploads/2021/04/スクリーンショット-2021-04-18-17.11.54-1024x640.png)
2つのUIデザインが画面に表示され、どちらが正しいデザインかを当てるクイズです。
制限時間はないので、ゆっくり考えることができます。
まずは、チュートリアル問題が出題されます。
その後に、初級→中級→上級とレベルが上がっていき、どんどん難易度が高くなっていきます。
![](https://kisa.ne.jp/wp-content/uploads/2021/04/スクリーンショット-2021-04-18-16.59.32-1024x640.png)
問題に答える度に、正解か間違いか表示されます。
「Compare」をクリックすると正解と間違いを比較できるので、どこが間違いだったのか確認できます。
![](https://kisa.ne.jp/wp-content/uploads/2021/04/スクリーンショット-2021-04-18-16.48.56-1024x640.png)
DMや検索窓など、普段使い慣れている問題で馴染みがあります。
チュートリアル〜初級まではスムーズに答えていけると思います。
![](https://kisa.ne.jp/wp-content/uploads/2021/04/スクリーンショット-2021-04-18-16.49.30-1024x640.png)
文字バランスや余白など、デザインする上で大事な感覚を問われます。
![](https://kisa.ne.jp/wp-content/uploads/2021/04/スクリーンショット-2021-04-18-17.00.55-1024x640.png)
上級問題になると、パッと見同じに見えるので、間違い探しのような感覚になります。
![](https://kisa.ne.jp/wp-content/uploads/2021/04/スクリーンショット-2021-04-18-16.52.16-1024x640.png)
色んな角度の問題が出されますが、そこー!?っていう落とし穴もあって面白いです。
![](https://kisa.ne.jp/wp-content/uploads/2021/04/スクリーンショット-2021-04-18-17.27.44-1024x640.png)
ゲームが終わると最後にスコアを確認できます。
全問クリアはできませんでしたが、プラチナムの称号をゲットできました!
さいごに
デザインはほんの1pxの差でバランスが変わってくるほど繊細なもので、異変に気づける目を養い続けないと、と改めて感じました。
また、海外のサイトで文字が読めなくても、UIデザインがバッチリだと視覚的に操作がしやすくなります。
文字に頼りすぎずにデザインすることも大切だと思いました。
デザインに携わっている人もそうでない人も楽しめると思うので、チャレンジしてみてください。