iOSのTableView風表示を実現する「Stacks」
StacksはjQuery/JavaScript製のソフトウェア(ソースコードは公開されていますがライセンスは明記されていません)です。
最近のWebページではヘッダーがページ上部に貼付く形のデザインがよく用いられます。さらにそれを一歩進めて、セクションごとのヘッダーをサポートしたのがStacksです。
[](http://images.moongift.jp/2013/08/Screenshot 2013-07-23 12.23.13.1375322586.png)
最初の表示です。スクロールしていきます。
[](http://images.moongift.jp/2013/08/Screenshot 2013-07-23 12.23.24.1375322591.png)
How it worksがヘッダーとして貼付いています。
[](http://images.moongift.jp/2013/08/Screenshot 2013-07-23 12.23.27.1375322596.png)
さらにスクロールします。
[](http://images.moongift.jp/2013/08/Screenshot 2013-07-23 12.23.33.1375322601.png)
次のヘッダー、How to use itがきました。最初のヘッダーは上に押されていきます。
[](http://images.moongift.jp/2013/08/Screenshot 2013-07-23 12.23.38.1375322606.png)
そして次はヘッダーが変わりました。
StacksはiOSのUIでよく見られるグループ化されたヘッダーを再現しています。縦に長く、グルーピングされたコンテンツを表示する際に適したUIと言えそうです。
MOONGIFTはこう見る
モバイルファーストという単語に人気が集まっている通り、モバイルやタブレットに対して新しい試み、UIがなされているケースが多くなっています。それらは決してモバイル限定ではなく、デスクトップにもフィードバック可能なものが数多くあります。
Webとネイティブアプリ、モバイルとデスクトップは相互にエッセンスが交換されるべきです。そしてそれらはプログラマーによってエッセンスが抽出され、ライブラリという形で出力されるでしょう。そうしたライブラリは総じて人気が出る傾向があります。