Kolejny projekt za nami. Tym razem, z dumą możemy się pochwalić stroną internetową stworzoną dla warszawskiej Pracowni Sushi. Jesteśmy zadowoleni z tego projektu tym bardziej, gdyż część z nas w Krakweb jest pasjonatami kuchni japońskiej. Strona zawiera wszystko to, co powinna zawierać witryna z branży gastronomicznej. Dodatkowo jest ona estetyczna i przejrzysta oraz posiada funkcjonalność pozwalającą na złożenie zamówienia. Jeżeli zrobiłeś się już głodny od tego czytania, to zapraszamy do odwiedzenia strony. Poniżej natomiast umieszczamy galerię, w której krok po kroku i element po elemencie przedstawimy stronę.
Strona główna - 4 poziomy sushi
Wchodząc na stronę, użytkownika wita pełnoekranowe zdjęcie w tle z logo firmy na środku ekranu. W wersji desktopowej, na samej górze strony, wyświetlają się 4 ikony pomagające w nawigacji: "Zamów", "Lokalizacja", "Koszyk", "Kontakt". W wersji mobilnej te same ikony ukryte są w hamburgerowym menu w prawym, górnym rogu strony. Jak więc możesz zauważyć, strona jest dostosowana do urządzeń mobilnych, czyli tym samym korzysta z technologii RWD.
Drugi z czterech segmentów strony nosi nazwę "Gorąco polecamy". W tej części strony znajduje się slider, w którego środku umieszczone są boksy z polecanymi daniami. W boksie znajduje się nazwa, cena i button zamówienia. Po najechaniu na dany produkt zostaje on podświetlony. Ofertę można przewijać za pomocą strzałek - prawo, lewo.
Pod "Gorąco polecanymi", znajduje się część strony nazwana "na co masz ochotę". Znajduje się tu pełna oferta Pracowni Sushi. Przedstawiona jest ona za pomocą małych boksów, z ikonami przedstawiającymi dany rodzaj posiłku czy napoju, oraz z nazwą ogólną. Tak jak w sekcji wyżej, po najechaniu kursorem, na dany element, jest on podświetlany. Po kliknięciu wybranego boksu zostajesz przeniesiony do wybranego podzbioru oferty (o tym później). W tym widoku znajduje się także button "Zamów nasze dania online", który po kliknięciu przenosi do menu wyposażonego w filtry. Tłem tego segmentu, jest zdjęcie.
Ostatnia, dolna część strony głównej zawiera jeden boks, który jest odnośnikiem do galerii zdjęć, i drugi, w którym zawarte są dane kontaktowe i teleadresowe. W tle znajduje się natomiast mapa z zaznaczonym na niej punktem stacjonarnym. Poniżej znajduje się stopka z dodatkowym menu, pomagającym w nawigacji po stronie.
Proces zamawiania produktów - 5 kroków
Pierwszy widok w pięciostopniowym procesie zamawiania nazywa się "Koszyk". To tuj, widzisz jakie produkty wybrałeś. Na opis wybranego produktu składa się: zdjęcie, nazwa, ilość porcji (która można modyfikować z pozycji koszyka), cena (pojedynczej porcji), wartość (cena danego produktu x ilość porcji), a także przycisk "X", za pomocą którego możemy usunąć wybrane danie z zamówienia. Na tej podstronie, znaleźć można także sumę całego zamówienia i buttony: "kontynuuj zakupy", który po kliknięciu przenosi Cię z powrotem do oferty, "zapisz zmiany", oraz "zamów bez rejestracji", który pozwala przejść dalej proces zamawiania, bez konieczności logowania się na konto.
Drugim etapem są "Dane adresowe". To tutaj niezarejestrowana osoba uzupełnia swoje dane, dzięki, którym otrzyma zamówienie. Oprócz podstawowych danych, które są wymagane, można także wypełnić NIP, gdy zamówienie robione jest przez firmę. (można też wtedy zaznaczyć opcję z fakturą). Dodatkowo można dopisać dodatkowe uwagi bądź wpisać kod promocyjny. W momencie, gdy będziesz chciał przejść do następnego etapu, a nie uzupełniłeś któregoś z wymaganych pól, strona Ci o tym przypomni, podświetlając dane pole na czerwono. Gdy wszystko będzie wypełnione poprawnie, wtedy możesz przejść do następnego kroku.
Trzecim krokiem jest "Wysyłka i płatność". Klient może tu wybrać jeden z 3 możliwych sposobów płatności.
Przedostatnim etapem składania zamówienia przez stronę internetową jest "Podsumowanie". To tu zamawiający może sprawdzić, czy wybrane posiłki, oraz adres się zgadzają.
Ostatnim korkiem jest "Potwierdzenie". Na tym etapie, strona wyświetla użytkownikowi informacje, o tym, co musi jeszcze zrobić, by dokończyć proces składania zamówienia online. Kliknięcie przycisku "Kontynuuj" jest równoznaczne z wysłaniem wiadomości potwierdzającej na podanego wcześniej maila.
Po wciśnięciu "Kontynuuj" w ostatnim etapie zamówienia, wyświetla się informacja o tym, że na Twojego maila została wysłana wiadomość z linkiem potwierdzającym.
Na stronie znajduje się także infografika pokazująca etapy zamawiania w Pracowni Sushi. Dzięki temu klient wie, jak wygląda proces realizacji jego zamówienia. Jest to o tyle istotne, że proces ten w Pracowni Sushi jest nieco inny, niż ten, do którego jesteśmy przyzwyczajeni na codzień - po wysłaniu zamówienia, pracownia oddzwania do Ciebie i informuje o ewentualnym braku danego dania, bądź doradza Ci w sprawie zamówienia.
Oferta danej kategorii - dania ukryte w boksach
Gdy wejdziesz w wybraną przez siebie kategorię w części strony głównej "Na co masz ochotę?" wyświetli się tego typu podstrona. W boksach będą przedstawione wszystkie posiłki z wybranej przez Ciebie kategorii.
Karta produktu - informacje jak na tacy
Po wybraniu produktu wyświetla się jego podstrona. W takim miejscu znajdziesz wszystkie potrzebne informacje. Od podstawowych wiadomości takich jak: nazwa, cena, ilość w zestawie, po bardziej rozwinięte - nazwy elementów dania. Oprócz tego, karta produktu urozmaicona jest o jego zdjęcie, oraz ikony składników.
Galeria - zobacz Pracownie Sushi od środka
W galerii możesz zobaczyć zdjęcia z lokalu. Po kliknięciu wybranego zdjęcia zostaje ono powiększone.
Logowanie/rejestracja - zostań stałym klientem
Klasyczne pole logowania, gdzie po wcześniejszym zarejestrowaniu konta, wpisujesz swój login i hasło.
Zakończenie
Jeżeli tu doszedłeś, to już wiesz, jak wygląda nasz najnowszy projekt. Teraz możesz śmiało składać zamówienia w Pracowni Sushi. Jeżeli natomiast przyszedłby Ci apetyt na stronę www swojego lokalu gastronomicznego albo innej działalności gospodarczej, to zapraszamy do kontaktu z nami ;)
