株式会社flaro

飲食店専用日次決算プラットフォーム FLARO UI/UX支援
  • 課題整理・改善実施
  • デザインシステム
  • UI/UX
  • Web
  • ヒューリスティック評価
株式会社flaro 株式会社flaro

プロジェクト概要

Proximoは株式会社flaroの Designsourcing Service パートナーとして、FLAROのUI/UXデザイン支援を行いました。
FLAROの制作チーム皆様と共に、現行デザインレビュー、UI/UX改善、プロトタイピング、開発連携、デザインデータ整理などを行っています。

権限やタスクが違うユーザーの行動や利用方法の可視化
権限やタスクが違うユーザーの行動や利用方法の可視化

権限やタスクが違うユーザーの
行動や利用方法の可視化

FLAROはれすだくというサービスを、より生き生きと働く飲食店経営者層に向けてリニューアルを施したサービスです。アルバイトとして所属店舗にシフト希望を出す用途から、経営トップ層の需要予測まで幅広いロールのユーザーが利用することを想定されています。
そのため、権限ごとの表示切り替えや、従業員同士の連携などを明確にすることが基礎として必要でした。

  • 想定される役職が違うペルソナの洗い出し
  • 各ユーザーがFLAROで行う行動/目的の整理
  • 承認/確認フローの可視化
プロジェクト概要
プロジェクト概要

経営が分からなくても、
成果や目標が見えて改善できる
ページ構成

特にメインターゲットとしている経営者に対して、常に自分の経営の健康診断ができることがFLAROの目標でした。そのため、管理している飲食店や組織全体の可視化が行われる、ダッシュボード、レポート、データ分析は見るべき数値に目が行くような視覚による優先順位付けを行いました。

ダッシュボードは整理したロールをもとに、それぞれどんなタスクを抱えていて、何を確認するのかというところから必要な機能を洗い出していきました。 HQロールは経営や支出の現状把握、アルバイトや現場のスタッフにはシフトやタスクの確認を優先しました。またHQと店長ロールのユーザーに対して、社内のモチベーションを向上させるために管理グループ内のランキングを設けました。
HQが数値から戦略をだし、社員以下がそれに基づき行動し、成功や失敗を可視化することでグループ全体でブラッシュアップしていくサイクルに繋がります。

データ分析ページはHQや店長クラスの社員が、直感的に現状を汲み取れることを目指しました。飲食店経営における6大指標からレーダーチャートを割り出していて、業態や値段帯に関わらず管理している店舗の健康状態をフラットに比較できるようになっています。総合状態を把握するレーダーチャートとは別に、管理している店舗の最新口コミを確認機能や、過去のPOS記録から今後どのくらいの売上が期待できるか需要予測機能があります。

スタッフの希望内容店舗の様々なタスク/予算/売上多角的に調整できるシフト
スタッフの希望内容店舗の様々なタスク/予算/売上多角的に調整できるシフト

スタッフの希望内容
店舗の様々なタスク/予算/売上
多角的に調整できるシフト

Topのダッシュボード機能やデータ分析とは別に、FLAROにはシフト機能があるもののあまり活用されていない現状がありました。まずは現状シフト機能のデザインレビューを行い、見せたい情報は何でどのようにシフトを編成するフローになっているのか情報を整理するところからはじめました。

整理の結果、デフォルトで出ている情報が多すぎたり、アルバイトがスマートフォンから希望シフトを入力しにくい点が主に直すべき箇所だとわかりました。理想とするフローや、編成中のシミュレーションにつかう情報の優先順位をつけた上でデザインの仮組みを行いました。そこからプロトタイプを作成し操作してみて、表示されている情報の意味が伝わるのか、編成中に冗長になってしまう作業がないかをテストしました。

シフトを組むためには、スタッフの希望、繁忙具合、目標予算、各スタッフの人件費や交通費、シフト中のタスク内容 などシミュレーションが必要なことがいくつもあります。必須の判断基準以外はオプションで表示する仕組みにすることで、シフト編成者が必要な情報を取捨選択して表示できる設計を目指しました。

タブレット等の小さい画面で扱う、多様な情報の画面整理とデザインシステム

タブレット等の小さい画面で扱う、
多様な情報の画面整理と
デザインシステム

頻度の高い利用が予想されるページはリニューアル/新規制作をしました。それ以外の現行にも実装されているページに関しては、新規トーンに揃うようなマスターデザインを作成いたしました。

UIは現場の飲食店で閲覧/操作できるようなサイズ感を重視し、色合いやパーツの見た目は操作の想像やスコアの結果イメージと関連したものを心がけました。
管理している飲食店や組織全体の可視化が行われる、ダッシュボード、レポート、データ分析は見るべき数値に目が行くような資格による優先順位付けを行いました。

  • タブレット/小型ノートパソコンを意識した表示設計
  • アクションや操作、経営の良し悪し等と連携した配色
  • 承認/全体を小リソースでトンマナ変更するためのマスターデザイン制作

お客様の声

お客様の声

株式会社flaro
代表取締役 安部 修平様

前職でProximoさんにお世話になりUI/UXの重要性を体感し、自分のプロダクトを開発する場合は絶対にProximoさんにお願いしたい!と思い、願いが叶いました。

今回のFLAROという飲食店向け経営管理プラットフォームは、レイヤーごとに見れる権限がことなりますが、どのレイヤーのユーザーにも飲食経営って楽しい!FLARO を使うとワクワクする!を実現できるようプロジェクトがスタートしました。当社のCSチーム、開発チームとコミュニケーションを密にとり、イメージを組んでもらいつつも専門家の立場で意見をバシバシ言って頂きました。両者ゆづらない場面が幾度もありましたが、結果的にProximoさんの言うことを聞いて良かったと感じることばかりでした。。我々、素人に根気よく付き合ってくれたProximoさんに感謝するとともに、あの時に言っていた事はこーゆーことだったんだ~と本当に勉強させてもらいました。

世の中にたくさんのアプリが混在する中、良い機能が搭載されていても使われてないのが事実。お客様が必要な時に無意識にカッコよく使ってる状態を目指し、これからもProximoさんと一緒にプロダクトを成長させたいと思います。まだまだ、始まったばかり、これからも引き続きよろしくお願い致します!

Client : 株式会社flaro
Creative Direction : Shiho Asahina