ARTICLES

ページめくりの UI 考察 (2) : ペラペラの発見

2019-07-18

本のランダムアクセス UI 考察」というシリーズでお届けしていましたが、タイトルと内容が違うかなと思い、「ページめくりの UI について」というシリーズタイトルに変更しました。

前回の記事はこちら。

タイトルの変更は、本においてランダムアクセスしたいということが重要だったわけではなく、利用者は本で出来るいろいろなことをペラペラめくれることで発見していったのではという仮説に基づいています。ユーザーの目的に対してデザインする UI があると思えば、その物自体の構造に対してユーザーが使い方を発見するタイプの UI だってあると思います。

さて、とにかく人類は印刷した紙を重ねると「ペラペラめくれる」ということを随分昔に発見してしまいました。もし、木簡とか巻物が文書形式の主役としてずっと今日まで使われていたら、おそらくページめくりの UI よりも何かを巻くということが求められていたに違いないのです。その場合、どういう UI になったら満足度が高いかというのは思考実験として面白いかもしれませんが、それはそれで別の話…。

話は戻って、ペラペラめくるというのはどういう時かというのを一口で説明するのは難しいです。ペラペラめくる時というのは、何かを探すということに限らず、何か面白いことがないかペラペラめくるということもあります。暇だからペラペラしているだけの時や、待ち時間なので手持ち無沙汰で本をとりあえず読んでいるのかもしれません。もちろん書籍の全体を把握したいなんてこともあります。

ペラペラめくれることを実現するのに重要なことは、ペラペラしているときに見えているページには全て情報が表示され終わっているということです。ページをものすごい速さで移動するわけですから、いちいちその部分をネットからダウンロードして描画してとかやっていると遅くて実用的ではないですね。

iPad のブックアプリでは、ローカルにあるデータを読んでいるからこそ早いという部分が大いにあると考えられます。ブックアプリといえど、ネット上にあるコンテンツをリアルタイムでペラペラして閲覧するのは厳しいでしょう。

同じくペラペラできたらいいなあと思うタイプのコンテンツには、SlideShare とか Speaker Deck のようなスライド共有サービスがあります。自分に必要な情報かどうかペラペラしたくなるときありますよね。

Speaker Deck では、トップページのサムネイルでもスライド画像の先読み込みを利用して、サムネイル上でペラペラすることができます。

Speaker Deck のサムネイル部分拡大

スライドは文字が大きいので、サムネイルになった状態でも読め、かなり理想的なペラペラが実現できています。これはサムネイル画像が小さいからこそ実現できることと言えるでしょう。とはいえ、高解像度が前提のこの時代、ブラウザ上で小さくとも実際は 640 x 360 のサイズがあるのですが。

まだまだ続きます。


ARTICLES


    AUTHOR

    原 一浩 の顔写真

    (はら) 一浩(かずひろ)

    カンソクインダストリーズ代表 / グレーティブ合同会社代表

    1998年に独立し、同年、ウェブデザイン専門のメールメディア DesignWedgeの発行を開始。Webデザイン業の傍ら、海外のWebデザインに関する情報発信を行う。
    雑誌への寄稿多数。主な著書に『はじめてのフロントエンド開発』『プロセスオブウェブデザイン』、『Play framework徹底入門』、『ウェブデザインコーディネートカタログ』など。自社製のWebデザインのクロール&キャプチャシステムvaqumをベースに、様々なリサーチを行っている。Web 検定プロジェクトメンバー

    著作一覧はこちら