UIUXを意識したセミセルフレジの設計事例
連日多くのお客さんが訪れる東急ハンズ(現ブランド名:ハンズ)新宿店8Fが導入した、セミセルフレジiOSアプリのUIUXデザイン事例。
手掛けたのは、UIUXデザイン・コンサルの専門会社Goodpatch(グッドパッチ)です。細かく施されたデザインや機能の工夫・こだわりについてご紹介します。
★既存サービスやデジタルプロダクトのUXをよくしてほしい
★多様なユーザーに対応したUIUXデザインを実装したい
★自社の現場に合ったサービス・アプリの設計を提案してほしい
東急ハンズのセミセルフレジは、ハンズラボ株式会社が開発・導入したセミセルフレジ。2018年から新宿店に導入されています。常時込み合っていた会計待ちレジ列の解消という課題を解決し、お客様のストレス緩和・コスト削減を目指して開発された当プロダクト。支払い方法も、現金・カード・電子マネーと、選択肢も豊富です。
生活雑貨を中心に多岐に渡る品数を取りそろえる人気ホームセンターの東急ハンズ。中でも旗艦店である新宿店は、全国のハンズ店舗の中でも売り場面積が最も広く、客層も老若男女あらゆる世代・国籍のお客様が来店する店舗です。
そんな店舗に設置されるセミセルフレジだからこそ「誰でも迷わず使えるUIUX」を搭載することが最大のミッションでした。
セミセルフレジ導入の大きな目的の一つは、レジの混雑緩和です。そのためには、お客様が自分自身で迷わずレジを操作し、スムーズに売り場を離れられるようにしなければなりません。しかし、多様なお客様が使用するプロダクトですので、「誰もがわかる」ことが重要です。
そこでGoodpatchは、お客様がボタンをタップしたり、現金やカードを投入したり、といったアクション時に発生する反応を、アニメーションや音声で分かりやすく表現。操作が無事に完了して進行した、と安心をもたらすUXを搭載しました。
また、言葉や文章ではわかりづらい説明や、日本語が読めないお客様のことも考え、アニメーションを見れば視覚的に操作を理解し、使用できるよう配慮しました。
さらに、「セルフレジは操作が難しそうで苦手」という印象を軽減するため、「難しい」というイメージを払拭するようなデザインを意識。全体のフォルムに丸みを持たせ、優先度の高いボタンに自然と目が行くよう、アイコンやアテンションを設定しています。
支払いに関しても「迷わない」設計が徹底されています。
Goodpatchは、誰もが迷わず支払いを完了できるようにするためにもっとも簡単、と思われるフローを調査。「1画面1タスク」を原則にし、表示する情報も「画面を完了させるための指示」「画面の指示を実行するためのアクションボタン」「画面の指示を実行するために確認する詳細・補足情報」の3要素に分類して画面をデザイン。とことんお客様を迷わせない工夫を凝らしています。
レジの混雑緩和を目的に開発されたセミセルフレジですが、リアルタイムで関与するのはお客様だけではありません。Goodpatch(グッドパッチ)は、お客様の会計処理をサポートする従業員のことも踏まえ、どのようなオペレーションが発生するのか?どう目的を達成するのか?を、一連の体験として考慮。
レジに並ぶ→袋詰めをする→売り場を離れるといった、すべてのユーザー体験を「サービスブループリント」という手法を使って設計しました。
(サービスブループリント:そのサービスがユーザーに提供されるまでの一連のプロセスを、サービスを提供する側のスタッフやシステムの動きと合わせて可視化した図のこと)
デジタルプロダクト開発(UI/UXデザイン)を中心に、ブランド構築・新規事業立ち上げ・デザイン組織支援といった、企業のビジネス課題に幅広くコミット。表面的なデザイン・アウトプットの納品ではなく、戦略立案フェーズからクライアントと共にチームを組み、目標の達成を目指して並走してくれるデザインパートナーとして、名だたる企業から厚い信頼を寄せられているUIUXデザイン専門会社です。また、デザイン会社では国内唯一※(2023年7月時点)の上場企業としても知られています。