並べると見やすい、そんなUIを実現「AppStore.js」
AppStore.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。
最近ではPinterestのように高さに変化をつけたブロックを並べていくのが流行っていますが、逆に整然と並んでいるのもまた良いものです。今回はそんな陳列した状態を簡単に実現できるAppStore.jsを紹介します。
[](http://images.moongift.jp/2013/10/Screenshot 2013-10-06 12.11.05.1381146100.png)
ダークテーマ。下の高さは違いますが、上辺は揃っています。
[](http://images.moongift.jp/2013/10/Screenshot 2013-10-06 12.11.34.1381146117.png)
ライトテーマ。随分印象が違います。
AppStore.jsはJSONデータを読み込んで各ブロックを並べて表示します。画像とタイトル、説明、タグなどが構成要素になっています。こういった表示を実現したい時に採用したいUIです。
名前の通りアプリストアなどで使ってみると面白いUIです。それぞれに優劣をつけることなく、整頓して並べることで選択しやすくなります。アプリに限らずjQueryライブラリ紹介でも良さそうです。
また類似した記事の一覧でサムネイルと一緒に表示したり、関連する商品を並べるのにも良さそうです。メインコンテンツはもちろん、その関連コンテンツとしても重宝しそうなUIですね。