自分のデザインのスキルがチェックでき、勉強にもなるクリエイティブなゲームのまとめ
Post on:2015年6月16日
カラーの見極め、文字の美しい字詰め、図形の認識など、デザインに大切なスキルが自分はどのくらいなのか分かり、しかも勉強にもなるスキルチェックのゲームをまとめたサイトを紹介します。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201502/2015061610.png)
Creative games for creative designers
数多く掲載されている中から、特にWebやUXに関係のあるゲームをピックアップしてみました。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201502/2015061611-01.png)
さまざまな形やイラストをベジェ曲線で描く、イラレ力を確認できるサイト。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201502/2015061611-07.png)
形がおかしくなってしまった文字をベジェ曲線で直す、美的センスを確認できるサイト。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201502/2015061611-05.png)
文字をドラッグして美しくカーニングを施す、詰め力を確認できるサイト。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201502/2015061611-12.png)
見出しと文章など、フォントの組み合わせのセオリーを学べるゲーム。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201502/2015061611-13.png)
指定された高さと幅のピクセルで矩形を描く、空間認識能力を確認できるサイト。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201502/2015061611-06.png)
表示されたカラーを色相環から選ぶ、色を見極める力を確認できるサイト。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201502/2015061611-03.png)
表記されたRGB値と同じカラーを3つの中から選ぶ、RGB力を確認できるサイト。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201502/2015061611-08.png)
複数のパネルから最も明るいパネルを選ぶ、明度力を確認できるサイト。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201502/2015061611-09.png)
表示された左右のカラーから明るい方を選ぶ、明度力を確認できるサイト。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201502/2015061611-15.png)
各列のカラーをグラデーション順に並べ替える、色相力を確認できるサイト。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201502/2015061611-11.png)
表示されたコードのインベーダーを撃ち落とすゲーム。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201502/2015061611-10.png)
同じカラーのドットをどれだけ多く垂直・水平に結べるか、戦略的なスマホゲーム。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201502/2015061611-16.png)
HTML, CSS, JavaScript, PHP, C++など、プログラミング言語でデザインされたトランプ。
参考:ウェブ制作者のためにデザインされたトランプがかっこいい! -code:deck
sponsors