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.

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.
.gif)
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.

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.

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.

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ę.

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

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.

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.



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.
Head of Design: Iwo Rzepiela
UX/UI: Jakub Nowak, Paweł Gryglak