Android 4.4 KitKatのバッテリー残量インジケーターは、この画面表示で「残り50％」を示しています。私にはそうは見えません。もっと少なく見えます。なぜでしょうか。ここには「ユーザーのメンタルモデル」と「UI実装モデル」のギャップがあります。

予めお断りしておくこと

* ここでは「どちらが正しい見え方か」といった話はしません。デザインが誤解を生む可能性を問題にしています。

* ここでいう「メンタルモデル」は、クリッペンドルフの『意味論的転回』では「ユーザー概念モデル」 (UCM: user conceptual model) と呼ばれています。以後そう呼びます。

バッテリー残量がどのように視覚化されているか

ユーザーの概念モデルの観点で、バッテリー残量インジケーターのデザインを考えてみましょう。

このインジケーターを見て「50％を下回る残量」に見える人は、おそらく「インジケーター中の塗りつぶされた面積の比率」を「バッテリー残量」と結びつけて考えています。下図のように面積比2：1（つまり50％）には見えません。

一方、実装を見ると、どうやら「高さの比率」で「バッテリー残量」を表現しようとしているようです。どこの高さかというと、バッテリーのプラス端子の出っ張りを無視して、「肩」から底までの高さです。

UI実装上は、「全体の高さに対して、塗りつぶした高さの比率」で「バッテリー残量」を表現しているように見えます。

これまで見てきたように、ユーザー概念モデルが「面積比率」であり、UI実装モデルが「高さ比率」だとすると、一致していません。端子の出っ張り分だけギャップがあります。このギャップは、そのまま「残り50％にはどうしても見えない」という認知上のギャップとなって現れます。

なお、私見では「面積比型」で認知する人のほうが多でしょう。しかし、調査したわけではなく、経験則です。場合によっては間違えるかもしれません。

デザイン実践への示唆

1. 静的なアイコンデザインの感覚のまま、動的なインフォグラフィックをデザインすると、破綻することがあります。計算機上の実装モデル、あるいは数学的なモデルにまで、正しく落とし込まなければなりません。

2. もしデザイナーが面積比の意図で設計していたとしても、その意図がプログラマーに理解されないまま実装されてしまったのかもしれません。そういうことはしばしば起こります。それを避けるためのコミュニケーションとして、例えば「振る舞いの仕様書」を書くのは有効でしょう。

3. 今回は2通りの解釈が可能なデザインでした。できれば、一意に解釈できるようなデザインのほうがよいですね。