ProgressBar(プログレスバー)とUX(追記あり)。

1秒毎に進行して10段階(秒)で終了する処理の進捗をプログレスバーでユーザーにフィードバックする時の話しです。 0から10段階に設定して、1秒毎に1(10%)ずつ進めて行き、10に到達した瞬間に非表示にする(処理終了)という実装をすると、何か違和感がないですか? (以下の動画)

プログラマ的には素直な処理の実装なのですが、以下の2点が違和感につながっているように思います。

• スタート時、バーが0の時、処理が止まっているように見える。
• 終了時、9段階から10段階に到達したとき、10段階に到達した画面が見えずに(一瞬で非表示になるため)、違和感が残る。

そこで、以下のように改良します (以下の動画)。

• 敢えて10段階とせずに、9段階とする。
• 0段階の時と9段階の時に散髪屋状態(barbar pole)とする
• 0段階はあえて見せずに、1段階から見せる

最後の10段階をもうちょっとちゃんと見せたほうが完了した感が出るとか、改良点はあると思いますが、GUIをプログラミングする時に、単に処理の都合で安易に実装してしまわずに、例えば処理開始時にバーを1段階進め、最後の処理をbarbar poleにする、そのために敢えて10段階を9段階とする、などの工夫がUXを良くしていくのだろうな、等と考えた年の瀬でした。

おそらく今年最後のブログ記事になるかと思います。みなさま良いお年をお迎えください。そして、来年も何卒宜しくお願いします。

追記

進捗もへったくれもなく、かかる時間を予測してとにかく一定スピードで進めちゃう、みたいな考え方もあるでしょうね。もしくは済んでない(非同期で引き続き実行中な)のにちょっと前には終ったように見せるとか。ウェブアプリとか。失敗したら後で知らせたらいいや、みたいな。

進捗もへったくれも、というあたり、それって正しいプログラミングではないやろ、という意見もあるだろうけど、こっちのほうが体験的に快適という考え方もあるのだろうね。