TasteGo

Cel projektu

• Uproszczenie obsługi panelu restauratora i ograniczenie liczby elementów wymagających dodatkowego wyjaśniania.
• Skrócenie czasu potrzebnego na obsługę zamówień i dostaw.
• Ułatwienie restauratorom planowania oraz publikowania menu.
• Poprawa zarządzania punktami odbioru i harmonogramami dostaw.
• Zapewnienie szybkiego dostępu do najważniejszych informacji bez konieczności przechodzenia przez wiele ekranów.
• Zmniejszenie liczby zapytań kierowanych do obsługi TasteGo poprzez bardziej intuicyjny interfejs.
• Uspójnienie działania i wyglądu wersji desktopowej oraz mobilnej.
• Przygotowanie panelu do obsługi większej liczby zamówień, dostaw, użytkowników oraz punktów odbioru.

Odbiorcy aplikacji

Głównymi użytkownikami panelu są osoby bezpośrednio zaangażowane w działalność restauracji:

• właściciele restauracji, zarządzający ofertą i działalnością lokalu,
• managerowie, odpowiedzialni za bieżące operacje,
• pracownicy kuchni, korzystający z informacji o zamówieniach i dostawach,
• osoby odpowiedzialne za logistykę i dostawy,
• pracownicy obsługi klienta, sprawdzający statusy i szczegóły pojedynczych zamówień.

Interfejs musiał być zrozumiały również dla osób, które nie korzystają na co dzień z rozbudowanych systemów administracyjnych.

Wyzwanie projektowe

TasteGo posiadało już działający panel oraz rozbudowany zestaw funkcjonalności, jednak wraz z rozwojem produktu jego obsługa stawała się coraz bardziej złożona.

Najważniejsze wyzwania obejmowały:

• dużą liczbę przycisków, ikon i kontrolek widocznych jednocześnie,
• brak konsekwencji pomiędzy podobnymi ekranami,
• trudności z rozpoznaniem funkcji części ikon i elementów interaktywnych,
• zbyt rozbudowane formularze i popupy,
• niewystarczającą informację zwrotną po wykonaniu części działań,
• trudności w zarządzaniu większą liczbą punktów odbioru i dostaw,
• niejasny podział pomiędzy kategoriami, daniami, dodatkami i atrybutami,
• potrzebę poprawy działania rozbudowanych tabel w wersji mobilnej,
• brak czytelnej hierarchii pomiędzy funkcjami kluczowymi i drugorzędnymi.

Istotnym elementem projektu było również zrozumienie zależności pomiędzy panelem restauratora a aplikacją mobilną klienta, ponieważ zmiany w menu, punktach odbioru czy dostawach wpływają bezpośrednio na to, co widzi osoba zamawiająca posiłek.

Zakres prac UX/UI

Projekt obejmował:

• przeprowadzenie warsztatu UX i uporządkowanie wiedzy o produkcie,
• analizę kluczowych potrzeb biznesowych i użytkowników,
• audyt UX istniejącego panelu restauratora,
• analizę wersji WEB i MOBILE,
• benchmarking konkurencyjnych rozwiązań,
• określenie najważniejszych ścieżek użytkowników,
• reorganizację architektury ekranów,
• redesign dashboardu,
• redesign sekcji Dostawy,
• redesign sekcji Zamówienia,
• uporządkowanie procesu tworzenia i planowania menu,
• redesign katalogu dań i kategorii,
• uporządkowanie dodatków i atrybutów dań,
• redesign zarządzania punktami odbioru,
• poprawę ekranów użytkowników, ról i uprawnień,
• uporządkowanie ustawień konta,
• zaprojektowanie stanów pustych, komunikatów, tooltipów i elementów onboardingowych,
• przygotowanie makiet UX/UI WEB i MOBILE,
• rozwinięcie istniejącego systemu wizualnego TasteGo zamiast tworzenia nowej stylistyki od podstaw.

Dostawy jako centrum pracy restauratora

Jednym z najważniejszych wniosków było potraktowanie dostaw jako głównego obszaru operacyjnego panelu.

Restaurator lub osoba odpowiedzialna za logistykę powinna szybko sprawdzić:

• jakie dostawy są zaplanowane,
• na którą godzinę należy je przygotować,
• do jakiego punktu odbioru mają trafić,
• pod jaki adres należy je dostarczyć,
• ile zamówień obejmuje dana dostawa,
• jakie dania i w jakiej liczbie należy przygotować,
• jaka jest łączna wartość zamówień,
• jaki jest aktualny status dostawy.

Dostawy zostały logicznie oddzielone od pojedynczych zamówień.

Zamówienie reprezentuje potrzeby jednego klienta, natomiast dostawa agreguje wiele zamówień realizowanych w określonym czasie do konkretnego punktu odbioru.

Pozwala to kuchni przygotować posiłki zbiorczo, a osobie odpowiedzialnej za transport szybko zaplanować logistykę.

Zarządzanie menu

Drugim kluczowym obszarem aplikacji jest tworzenie i planowanie menu.

Projekt uwzględnia:

• menu regularne,
• menu na konkretny dzień,
• szkice menu,
• katalog wszystkich dań,
• kategorie dań,
• dodatki,
• atrybuty,
• alergeny,
• aktywację i dezaktywację pozycji.

Proces został uproszczony tak, aby użytkownik mógł wybierać dania z różnych kategorii i budować z nich menu w jednym procesie, bez konieczności wykonywania wielu powtarzalnych działań.

Duży nacisk położono również na spójność tabel, formularzy oraz akcji dodawania i edycji, dzięki czemu użytkownik po nauczeniu się jednego mechanizmu może wykorzystywać go także w innych częściach aplikacji.

Punkty odbioru

Punkty odbioru są jednym z elementów wyróżniających model TasteGo.

Restaurator może:

• tworzyć punkty odbioru,
• określać ich lokalizację,
• przypisywać obsługujące je restauracje,
• konfigurować dni i godziny dostaw,
• określać czas, do którego klienci mogą składać zamówienia,
• ustalać limit czasu na anulowanie zamówienia.

W redesignie duży nacisk położono na czytelniejsze zarządzanie punktami na mapie i w tabeli, możliwość filtrowania oraz szybką identyfikację ich statusu i przynależności.

Użytkownicy, role i uprawnienia

Panel umożliwia również tworzenie kont dla pracowników oraz nadawanie im różnych poziomów dostępu.

W redesignie zaplanowano bardziej przejrzyste zarządzanie:

• użytkownikami,
• rolami,
• zakresem uprawnień,
• dostępem do konkretnych funkcjonalności.

Rozbudowane listy uprawnień zostały uporządkowane w powtarzalną strukturę, aby administrator mógł szybciej rozpoznać, do czego dana osoba posiada dostęp.

Uwzględniono również możliwość stosowania gotowych ról, np. kucharz lub manager, co może znacząco skrócić konfigurację nowego konta.

Kluczowe założenia UX

• Najważniejsze informacje powinny być widoczne bez konieczności wykonywania dodatkowych kliknięć.
• Akcje drugorzędne powinny być ukrywane np. pod menu kontekstowym z trzema kropkami.
• Podobne funkcjonalnie ekrany powinny wykorzystywać te same wzorce interakcji.
• Rozbudowane zestawy danych powinny być prezentowane w czytelnych tabelach.
• Puste ekrany powinny wyjaśniać użytkownikowi, dlaczego nie ma danych i co może zrobić dalej.
• Funkcje o nieoczywistym działaniu powinny posiadać tooltipy lub krótkie opisy pomocnicze.
• Interfejs powinien minimalizować liczbę decyzji, które użytkownik musi podejmować jednocześnie.
• W wersji mobilnej priorytetem jest czytelność danych i wygodne przewijanie rozbudowanych struktur.
• System powinien jasno komunikować konsekwencje działań mogących mieć wpływ na sprzedaż, dostawy lub dane klientów.
• Warstwa wizualna powinna zachowywać odpowiedni kontrast i dostępność.

WEB i MOBILE

Panel został zaprojektowany zarówno dla komputerów, jak i urządzeń mobilnych.

Wersja mobilna zachowuje tę samą architekturę informacji, ale dostosowuje sposób prezentowania danych do mniejszej przestrzeni.

W zależności od rodzaju widoku zastosowano m.in.:

• mobilne karty zamiast rozbudowanych tabel,
• przewijanie tabel w poziomie tam, gdzie zachowanie struktury kolumnowej jest istotne,
• ikony zamiast rozbudowanych przycisków,
• menu kontekstowe dla funkcji dodatkowych,
• kompaktowe menu nawigacyjne,
• uproszczone popupy i formularze.

Najważniejsze było zachowanie spójności funkcjonalnej pomiędzy WEB i MOBILE, bez mechanicznego kopiowania desktopowego interfejsu na mniejszy ekran.

Efekty prac UX/UI

• Uporządkowano najważniejsze procesy operacyjne restauratora.
• Dostawy otrzymały czytelniejszą strukturę opartą na punktach odbioru, czasie i statusach.
• Rozdzielono logikę pojedynczych zamówień i zbiorczych dostaw.
• Uproszczono proces planowania menu regularnego i dziennego.
• Uporządkowano katalog dań, kategorii, dodatków i atrybutów.
• Ograniczono liczbę elementów konkurujących o uwagę użytkownika.
• Ujednolicono sposób prezentowania rozbudowanych danych.
• Wprowadzono czytelniejsze stany puste i informacje kontekstowe.
• Poprawiono strukturę zarządzania rolami i uprawnieniami.
• Interfejs został przygotowany zarówno dla użytkowników desktopowych, jak i mobilnych.
• Projekt rozwija istniejący system wizualny TasteGo, dzięki czemu zachowuje ciągłość obecnego produktu.

Podsumowanie

Projekt TasteGo pokazuje, jak działający i funkcjonalnie rozbudowany produkt SaaS można uprościć bez ograniczania jego możliwości. Największym wyzwaniem nie było dodawanie kolejnych funkcji, lecz ich uporządkowanie w taki sposób, aby restaurator szybko rozumiał co ma zrobić, gdzie znaleźć potrzebne informacje i jakie będą konsekwencje wykonanej akcji.

Redesign koncentruje się przede wszystkim na codziennej pracy użytkownika: od konfiguracji konta i przygotowania menu, przez przyjmowanie zamówień, aż po organizację zbiorczych dostaw do wielu punktów odbioru.

Efektem jest bardziej spójny, skalowalny i przewidywalny panel restauratora, który może być rozwijany wraz z rosnącą liczbą restauracji, punktów odbioru, użytkowników i zamówień.

Interaktywny prototyp

Powiększ ekran i przejdź przez interaktywny prototyp (przeklikaj i przescrolluj). Dostępna jest także wersja na inne rozdzielczości.