<p class="thumb"><img src="http://cdn.zako.org/images/2016/03/appealing.png" alt="appealing" width="592" height="311" class="alignnone size-full wp-image-30238" /></p>
<p>さまざまなサイトのUIをスクリーンショットで見ることができるサイトは多くあるものの、モバイルサイトのUIで特に重要な「動き」を参考にするようなサイトはなかなかないものですよね。</p>
<p>今回ご紹介するのは、そのモバイルUIの「動き」を参考にできるサイトです。</p><!--more-->

<h3 class="header-label">代表的なサイトのモバイルUIの「動き」を見られる「appealing」</h3>
<p>「<a target="_blank" href="http://app-ealing.com/">Appealing</a>」は、代表的なサイトのナビゲーションやpull to refreshなど、<strong>モバイルサイト特有のUIの動きをアニメーションで見ることができる</strong>UIまとめサイト。</p>
<p>SPLASH SCREEN、TRANSITION、INTERACTIONなどといったカテゴリで整理されており、UIを検討する際の参考にすることができます。</p>

<h4 class="tips">代表的なサイトのモバイルUIをアニメーションで確認</h4>
[caption id="attachment_30240" align="alignnone" width="480"]<img src="http://cdn.zako.org/images/2016/03/appealing-anime.gif" alt="さまざまなサイトのUIを動画で確認できます" width="480" height="240" class="size-full wp-image-30240" /> さまざまなサイトの機能別のUIを動画で確認できます[/caption]
<p>わざわざサイトを開かなくても、PCの画面で動きを見て比較することができます。動画はもちろん全画面で再生することも可能。HD画質にして再生することもできるようです。</p>
<p>掲載されているサイトはTwitterやGoogle系サービス、FacebookにAirbnb、Instagramなどなど、モバイルに力を入れている代表的なサイトがそろっています。</p>

<h4 class="tips">スプラッシュスクリーンなどのカテゴリで絞って閲覧可能</h4>
[caption id="attachment_30239" align="alignnone" width="592"]<img src="http://cdn.zako.org/images/2016/03/appealing-tag.png" alt="カテゴリを絞った検索結果画面" width="592" height="310" class="size-full wp-image-30239" /> カテゴリを絞った検索結果画面[/caption]
<p>各サイトのナビゲーションだけに着目して比較したい、Twitterのサイトの動きを参考にしたいなどといったときにも、タグで絞り込んだり、検索をすることで一覧性を高めてくれます。</p>

<p>興味があるかたは<a target="_blank" href="http://app-ealing.com/">Appealing</a>へどうぞ。</p>
