Menu
Zamknij menu

Nowoczesny design i innowacyjny system widoku produktów

Data realizacji:
arcom.net.pl
arcom.net.pl
  • Typ projektu:

  • Zakres prac:

    • back-end
    • front-end
    • design
  • Technologie:

    • React

Arcom to firma, która specjalizuje się w produkcji systemów wykorzystywanych do magazynowania i transportu. Realizacje opierają się na wieloletnim doświadczeniu wspartym nowoczesną technologią. Przedsiębiorstwo jest europejskim liderem w swojej branży. Rozwiązania oferowane przez specjalistów marki wpływają między innymi na lepsze zagospodarowanie przestrzeni magazynowej.

(...) plus za bardzo zaawansowaną technologie którą się posługują a dzięki której strona jest wyraźnie szybsza i wygląda nowocześnie
Marcin Smulski

Marcin Smulski

Sales Manager @ Arcom

  1. 01
    Wyzwania

    Jednym z najważniejszych aspektów projektu była szybkość działania strony i wyeliminowanie ewentualnych przeładowań, które mogłyby pojawić się w związku z dużą ilością informacji oraz plików multimedialnych.

    Dodatkowo ustaliliśmy z klientem, że ważny będzie nowoczesny design, który powinien być dopasowany do zdjęć w widoku 360 stopni oraz animacji różnorodnych produktów.

    Ponadto we wstępnym etapie planowania działań uwzględnione zostały aspekty w zakresie rozwiązań technologicznych:

    • wiele wersji językowych witryny,
    • przypisane przedstawiciela firmy do konkretnej wersji językowej strony,
    • stworzenie mapy i dodanie przedstawiciela do kraju, za który odpowiada.
  2. 02
    Proces

    Proces projektowania strony, podobnie, jak w innych realizacjach rozpoczęliśmy od przygotowania makiet, który dały nam ogólny pogląd tego, co chcielibyśmy osiągnąć. Następnie na ich podstawie zajęliśmy się przygotowaniem personalizowanej identyfikacji wizualnej. W tym zakresie skupiliśmy się na takich kwestiach jak:

    • dobór właściwej kolorystki,
    • stworzenie typografii,
    • przygotowanie dedykowanych ikon.

    Na tym etapie oprócz makiet wykorzystywaliśmy także stylequide.

    Stworzenie witryny od strony technologicznej wymagało zastosowania Gatsby.js. Front strony połączyliśmy z panelem administracyjnym dzięki API. System CMS został odpowiednio dostosowany do oczekiwań firmy. Zespół zastosował również technologie zapewniające jego najwyższą wydajność.

    W momencie, kiedy projekt graficzny został zaakceptowany przez klienta, gotowa strona została umieszczona na serwerze. Cały proces przygotowanie do tego momentu trwał 12 tygodni.

  3. 03
    Rezultaty

    Projekt został zrealizowany zgodnie z początkowymi założeniami ustalonymi ze zleceniodawcą.

    Bardzo ważnym aspektem było stworzenie identyfikacji wizualnej firmy, która pasowałaby do branży, a jednocześnie wyróżniałaby przedsiębiorstwo na rynku. Na uwagę zasługuje przede wszystkim kolorystyka strony oraz podświetlenie produktów, które sprawia, że odbiorca po najechaniu na dany element zwraca na niego szczególną uwagę. Sama typografia jest bardzo prosta, co nie sprawia wrażenia przytłoczenia.

    To, co jest charakterystyczne dla firmy to obrotowy widok produktów 360 stopni. Dzięki temu klient może sprawdzić, jak dokładnie wyglądają, co jest ważnym aspektem procesu zakupowego.

    W kwestii technologicznej - zastosowane udogodnienia wpłynęły na stworzenie strony w trzech językach: polskim, angielskim i niemieckim. Co więcej, po wyborze konkretnej wersji językowej można skontaktować się bezpośrednio z odpowiednim pracownikiem. W prawym rogu wyświetla się ikona - tzw. dymek - a po kliknięciu na nią dane osobowe pracownika. W zakładce “Kontakt” stworzono natomiast interaktywną mapę świata. Po wybraniu regionu świata pojawia się informacja dotycząca opiekuna sprzedaży przypisanego do kraju wraz z danymi kontaktowymi.

    Zastosowane systemy sprawiły, że witryna ładuje się sprawnie - pomimo bardzo dużej ilości treści oraz plików multimedialnych. Wyeliminowane zostały również zagrożenia, które mogłyby wpływać na przeładowania strony.

Sukcesem niemal każdej platformy jest połączenie przemyślanych działań w zakresie identyfikacji firmy oraz dopasowania rozwiązań technologicznych. Są to aspekty dające podstawy do zdobycia klientów. Poniżej przedstawione zostały najważniejsze sekcje w projekcie, wpływające na funkcjonalność, estetykę i czytelność strony.

Sposób prezentacji produktu

Jedną z najważniejszych kwestii podczas przygotowywania strony było odpowiednie prezentowanie produktów oferowanych przez firmę. Z uwagi na specyfikę branży, zastosowane przez nasz zespół rozwiązania można uznać za innowacyjne. Na szczególną uwagę zasługują przede wszystkim dwie kwestie - animacja produktu oraz widok 360 stopni.

  • Animacja produktu - Przy każdym produkcie stworzona została wizualizacja graficzna jego wykorzystania. Przekaz jest bardzo czytelny dla odbiorcy, który może dowiedzieć się, jak złożyć konkretne wyposażenie lub jak może zastosować je dla własnych potrzeb.
  • Widok 360 stopni - Produkty posiadają także obrotowy widok 360 stopni. To umożliwia dokładnie sprawdzenie konstrukcji i poszczególnych elementów całego asortymentu.

Karta katalogowa produktu

Bezpośrednio z zakładki konkretnego produktu możliwe jest przejście do jego karty katalogowej, gdzie znajdują się wszelkie parametry techniczne, rysunki techniczne oraz dodatkowe dane dotyczące akcesoriów, czy transportu. Można tam również zapoznać się ze zdjęciami rzeczywistego produktu i zobaczyć, jak prezentuje się na żywo.

Interaktywna mapa świata

Na odbiorców witryny w zakładce “Kontakt” czeka interaktywna mapa świata. Po najechaniu na wybrany region, jego kolor zmienia się, natomiast po kliknięciu pojawia się informacja, który z opiekunów handlowych jest odpowiedzialny za wybrany kraj. Pojawiają się także informacje kontaktowe oraz ikony sugerujące znajomość konkretnych języków, którymi posługuje się pracownik.

Pracownicy przypisani do wersji językowej strony

Witryna dostępna jest w trzech wersjach językowych. Za każdą z nich odpowiedzialna jest inna osoba. Jak skontaktować się z właściwym pracownikiem? Po wejściu na stronę - w prawym dolnym roku pojawia się “przypięta” ikona wskazująca na dymek czatu. Po kliknięciu na nią pojawiają się dane kontaktowe do właściwej osoby.

W zeszłym roku mieliśmy okazje wspólnie z firmą Projets wybudować nową witrynę internetową dla naszej firmy. Na samym początku miłe zaskoczenie w postaci pozytywnego podejścia do klienta a później jeszcze większy plus za bardzo zaawansowaną technologie którą się posługują a dzięki której strona jest wyraźnie szybsza i wygląda nowocześnie. Na wszelkie nasze prośby reakcja zawsze natychmiastowa, nawet jeśli mówimy o sprawach już po zamknięciu etapu developmentu. Nie było chyba takiej wizji z naszej strony której nie udało by się im przelać na ekran, ba, poprawić ją i oszlifować żeby całość wyglądała profesjonalnie. Szczególne podziękowania dla Wojciecha Kozaka któremu w jakiś sposób udawało się upchnąć nasze zlecenia jeśli tylko tego potrzebowaliśmy.
Marcin Smulski

Marcin Smulski

Sales Manager @ Arcom

agdmaster.com
agdmaster.com

Proste zakupy bez konieczności rejestracji. Nowoczesny design i duży wybór produktów.

"Zastosowane przez zespół rozwiązania przyczyniły się do stworzenia nowoczesnego, a jednocześnie przyjaznego użytkownikowi sklepu. Oprócz wykonanego projektu specjaliści zapewniają także pełne wsparcie dla naszego serwisu."

Przemysław Strzałka
Przemysław Strzałka

CTO @ agdmaster.com

Poznaj szczegóły realizacji sklepu