Saleor

Saleor to platforma e-commerce, która umożliwia tworzenie nowoczesnych i spersonalizowanych sklepów internetowych. Saleor wykorzystuje podejście headless, które oddziela warstwę prezentacji od warstwy logiki biznesowej, dając większą elastyczność i kontrolę nad wyglądem i funkcjonalnością sklepu. Saleor oferuje potężne i skalowalne API oparte na GraphQL, które obsługuje wszystkie aspekty sprzedaży online, takie jak produkty, koszyk, zamówienia, płatności, wysyłka i wiele innych. Saleor zapewnia również gotowe do użycia interfejsy użytkownika dla klientów i administratorów, które są oparte na najnowszych technologiach webowych, takich jak React i TypeScript. Saleor jest również otwartoźródłową platformą, która ma aktywną i rosnącą społeczność programistów i ekspertów branżowych, którzy współtworzą i ulepszają Saleor.

Klient
Saleor x Mirumee
Czas trwania projektu
paźziernik 2020
Lokalizacja klienta
Wrocław, Polska
Przewiń w dół

Wyzwanie

Stałem przed złożonym wyzwaniem, które wymagało ode mnie wielu umiejętności i kreatywności. Zadaniem było zaprojektowanie instalatora dla platformy e-commerce Saleor, jednej z wiodących otwartoźródłowych platform handlowych na świecie. Instalator miał być intuicyjny, bezpieczny i zgodny z prawem, aby ułatwić użytkownikom uruchomienie własnego sklepu internetowego opartego na Saleor. Musiałem również zadbać o to, by instalator spełniał wszystkie wymagania prawne i bezpieczeństwa danych, takie jak RODO. Ponadto zaprojektowałem sklep internetowy z oryginalnymi produktami dla społeczności Saleor, który odzwierciedlał jej charakter, potrzeby i był atrakcyjny dla programistów. Sklep miał być przykładem możliwości i zalet platformy Saleor, takich jak elastyczność, wydajność i skalowalność. Produkty miały nawiązywać do tematyki programowania, technologii i open source. Na koniec zaprojektowałem stronę Careers dla Saleor, która miała zachęcać potencjalnych kandydatów do dołączenia do zespołu i pokazywać im, jak wygląda praca w Saleor. Strona zawierała informacje o misji, wartościach i kulturze firmy, a także o aktualnych ofertach pracy, wymaganiach i korzyściach. Strona prezentowała również zespół Saleor, jego osiągnięcia, projekty i opinie. Dodatkowo stworzyłem interaktywny proces aplikowania na stanowisko, który polegał na otrzymywaniu wiadomości wideo od rekruterki i możliwości nagrania własnego nagrania prezentującego kandydata.

odwiedź stronę

Instalator

Umożliwia łatwe i bezpieczne uruchomienie sklepu internetowego. Instalator zawiera kroki dotyczące zgody na politykę ochrony danych, warunki korzystania z usługi i licencji, konfigurację bazy danych i konta administratora, podanie opcjonalnego adresu sklepu, ustawienie indeksowania strony przez wyszukiwarki, oraz wyrażenie opcjonalnej zgody na wysyłanie statystyk i danych o awariach do Saleor i developerów.

Saleor Swag

Swobodna eksploracja produktów

Użytkownik może swobodnie eksplorować różne produkty, takie jak koszulki, kubki, torby czy naklejki, zamknięte w bańkach, które zapętlają się w nieskończoność. Użytkownik może poruszać się we wszystkich kierunkach, przybliżać i oddalać obrazy, a także kliknąć na bańkę, aby zobaczyć szczegóły produktu i dodać go do koszyka.

Podgląd produktów

Po najechaniu kursorem na produkt, pojawia się jego nazwa i cena, co ułatwia porównanie i wybór. Po kliknięciu na produkt, otwiera się on, odsuwając inne produkty na boki, co tworzy efekt głębi i skupienia. Po otwarciu produktu, użytkownik może zapoznać się z jego pełnym opisem i dodatkowymi zdjęciami, które pokazują szczegóły i jakość produktu.

Dodanie do koszyka

Jeśli użytkownik chce dodać do koszyka produkt, który ma różne rozmiary, a nie wybrał wcześniej żadnego z nich, to interfejs zasugeruje mu to, pokazując animację. Jeśli użytkownik doda produkt do koszyka, to interfejs również zakomunikuje mu pomyślne dodanie produktu, pokazując animację.

Koszyk

W koszyku użytkownik może zapoznać się z dodanymi produktami i przejść do realizacji zamówienia.

Symulacja Terminala

Użytkownik może nie tylko korzystać z interfejsu graficznego, ale także z symulacji Terminala, która daje mu większą kontrolę i swobodę. Użytkownik może przełączyć się na symulację Terminala, naciskając klawisz  ~ lub klikając w pasek na dole ekranu. W terminalu może wykonywać wszystkie czynności jak w normalnym sklepie, używając poleceń tekstowych. Użytkownik może np. wyszukiwać produkty, dodawać je do koszyka, sprawdzać stan zamówienia, czy kontaktować się z obsługą klienta, wpisując odpowiednie komendy. W trybie graficznym każda czynność jest też obrazowana w podglądzie terminala w dolnym pasku. Symulacja Terminala jest nie tylko funkcjonalna i wygodna, ale także zabawna i oryginalna, ponieważ odwołuje się do kultury geeków i programistów.

Logowanie i checkout

Użytkownik może zalogować się przez swoje konto GitHub, co ułatwia i przyspiesza proces zakupu. Następnie użytkownik obligatoryjnie przenoszony jest do symulacji Terminala, gdzie może wykonać cały proces realizacji zamówienia, używając poleceń tekstowych.

Saleor Career

Strona główna

Strona oferty pracy

Interaktywna rekrutacja

Formularz zawiera kolumnę z wideo, w której rekruter opowiada o poszczególnych etapach procesu rekrutacji, takich jak test techniczny, rozmowa z zespołem, czy prezentacja projektu. Użytkownik przechodząc na kolejne podstrony formularza, uruchamia ciąg dalszy nagrania, który dostosowuje się do aktualnego etapu. Opcjonalnie użytkownik może również nagrać swoją krótką wypowiedź, w ramach której opowiada o tym, dlaczego chce pracować w Saleor, co pozwala na lepsze poznanie kandydata i jego motywacji.

Zespół

Head of Design: Iwo Rzepiela

UX/UI: Jakub Nowak, Paweł Gryglak