Kompetencje UX

Projektowanie UX i UI stron, sklepów i aplikacji

Projektowanie UX, projektowanie UI

Ładna strona, z której klienci wychodzą bez kontaktu, to drogi plakat. Projektujemy strony, sklepy i aplikacje tak, żeby użytkownik od razu rozumiał ofertę i bez zgrzytów dochodził do celu: zapytania, zakupu albo rejestracji. Zaczynamy od danych i celów biznesowych, a wygląd dopasowujemy do nich, nie odwrotnie.

Projektowanie UX i UI w Hilvec

Projektujemy UX i UI stron firmowych, sklepów internetowych i aplikacji webowych, takich jak panele klienta czy systemy obsługi zamówień. Najpierw ustalamy, co użytkownik ma zrobić na stronie i co mu w tym dziś przeszkadza, a dopiero potem dobieramy kolory, typografię i detale zgodne z marką. Jeśli strona już działa, zwykle zaczynamy od audytu UX, żeby zmiany projektować na danych z Twojego sklepu.

Najwięcej pieniędzy ucieka zwykle w koszyku i formularzach. Według Baymard Institute średnio około 70% koszyków w sklepach internetowych zostaje porzuconych, a wśród najczęstszych powodów są wymuszone zakładanie konta i zbyt długi proces zamówienia. To błędy projektowe, które da się poprawić bez przebudowy całego sklepu.

Projekt możesz wdrożyć z własnym zespołem programistów albo u nas: strony budujemy w Webflow, a sklepy na Shopify. Jeśli szukasz zespołu na dłużej, np. do projektowania w abonamencie, zajrzyj na stronę naszej agencji UX/UI.

Warsztat projektowy Hilvec: prowadzący przy flipcharcie omawia projekt strony z zespołem klienta
Projekt UX/UI zaczynamy od warsztatu z zespołem

Co zmienia dobrze zaprojektowany interfejs

Sklep, w którym łatwiej kupić‍

W sklepie projektujemy przede wszystkim te miejsca, w których zapada decyzja o zakupie: wyszukiwanie i filtry, kartę produktu, koszyk i proces zamówienia. Klient ma szybko porównać produkty, zobaczyć koszt dostawy przed koszykiem i złożyć zamówienie bez zakładania konta. Takie zmiany często dają więcej zamówień niż nowa kampania reklamowa, bo pracują na ruchu, który sklep już ma.

Strona firmowa, która zbiera zapytania‍

Na stronie usługowej klient szuka trzech rzeczy: czy rozumiesz jego problem, czy masz na to dowody i jak się z Tobą skontaktować. Układamy ofertę, realizacje i opinie w takiej kolejności, żeby odpowiedź na każde z tych pytań była pod ręką, a formularz był krótki i widoczny w odpowiednim momencie.

Aplikacja, której nie trzeba tłumaczyć‍

W panelach klienta i aplikacjach webowych każdy niejasny ekran to kolejne zgłoszenie do Twojego działu obsługi. Projektujemy je tak, żeby użytkownik wykonał najczęstsze zadania bez instrukcji, a rzadsze funkcje nie przeszkadzały w codziennej pracy.

Projekt gotowy do wdrożenia‍

Dostajesz projekt, który programiści wdrożą bez zgadywania: z biblioteką komponentów i opisem zachowań elementów. Na życzenie sprawdzamy go też pod kątem wytycznych dostępności WCAG. Od 28 czerwca 2025 r. ustawa z 26 kwietnia 2024 r. o dostępności niektórych produktów i usług obejmuje większość sklepów internetowych, z wyjątkiem mikroprzedsiębiorców.

Przykładowe projekty UX i UI

UX/UI Design

Projekt UX/UI sklepu internetowego dla Nizio, producenta mebli z litego drewna

Dla Nizio, rodzinnej firmy z Biłgoraja produkującej łóżka i meble z litego drewna, zaprojektowaliśmy nowy sklep internetowy: od analizy zachowań klientów, przez makiety UX, po kompletny projekt UI na komputery i telefony.

aPress24 - projekt UX/UI sklepu e-commerce
UX/UI Design

Projekt UX/UI sklepu aPress24.pl ze sprzętem serwerowym i dla graczy

Dla aPress24.pl, sklepu internetowego z ofertą sprzętu serwerowego, zaprojektowaliśmy kompletny interfejs użytkownika, obejmujący wszystkie kluczowe ekrany ścieżki zakupowej, panel klienta oraz strony produktowe.

Opinia klienta
Dobrze zrozumieliście, o co nam chodzi, i sklep aPress24 wyszedł dokładnie tak, jak chcieliśmy. Dlatego drugi sklep, PCretro, od razu zleciliśmy Hilvec. Kolory są przyjemne, wszystko czytelne, a projekt odebraliśmy bez uwag.
Łukasz Kowaliński
Chief Financial Officer at aPRESS24.pl
Testimonial
Jak pracujemy?

Proces

1
Warsztat i plan widoków
2
Makiety i ścieżki
3
Projekt graficzny
4
Przekazanie do wdrożenia
5
Testy z użytkownikami

Audyt UX czy projekt od zera?

Audyt UX wybierz, gdy sklep albo strona działa i ma ruch, ale za mało osób kupuje lub wysyła zapytanie. Projekt od zera ma sens, gdy zmieniasz platformę albo model sprzedaży, albo gdy poprawek po audycie jest tyle, że taniej zaprojektować całość na nowo.

Sygnały, że wystarczy audyt

Najczęściej przychodzą do nas firmy, którym ruch rośnie, a sprzedaż stoi w miejscu. Wiele osób dodaje produkty do koszyka, ale nie kończy zamówienia, albo klienci przechodzą po stronie z oferty na kontakt i z powrotem, nie wysyłając formularza. Drugi sygnał to powtarzające się pytania do działu obsługi: o koszt dostawy, dostępność rozmiaru czy status zamówienia. Skoro klienci muszą o to pytać, strona nie odpowiada im we właściwym miejscu. W takich sytuacjach problem zwykle siedzi w kilku konkretnych widokach i audyt pokazuje, od których zacząć.

Tak było w sklepie Nizio: z siedmiu problemów, które znalazł audyt, trzy trzeba było poprawić od razu.

Kiedy projekt od zera się opłaca

Nowy projekt ma sens przy zmianie platformy sklepu, przy przejściu ze sprzedaży detalicznej na hurtową albo odwrotnie, a także wtedy, gdy strona przez lata obrosła doklejanymi sekcjami i każda zmiana coś psuje. Wtedy poprawianie pojedynczych widoków kosztuje więcej niż uporządkowanie całości. Projekt od zera trwa dłużej, ale porządkuje cały interfejs naraz i daje bibliotekę komponentów, na której łatwo budować kolejne strony.

Co dalej z wynikami audytu

Po audycie możesz wprowadzać zmiany etapami z własnym zespołem albo zlecić nam zaprojektowanie poprawek i sprawdzenie ich po wdrożeniu. Część firm robi najpierw kilka najprostszych zmian, mierzy efekt w Google Analytics i dopiero potem decyduje o większym projekcie.

Przy dużych sklepach często łączymy oba podejścia: zaczynamy od audytu, a jego wyniki stają się briefem do nowego projektu.

Projekt pod platformę, na której działa sklep

‍Projektowaliśmy sklepy na Selly, PrestaShop, Shopify i SOTESHOP i w każdym z nich część widoków zmienia się w panelu motywu, a część wymaga programisty albo aplikacji; gdzie dokładnie przebiega ta granica, zależy od motywu i planu. Dlatego zanim narysujemy pierwszy ekran, sprawdzamy w Twoim sklepie, co da się zmienić, a co jest wspólne dla wszystkich sklepów na platformie, a o wątpliwe elementy pytamy pomoc techniczną platformy albo Twojego wdrożeniowca. Projektujemy to, co da się wdrożyć, żeby projekt nie leżał w szufladzie przez jeden ekran, którego nie da się przebudować.

Narzędzia, z których korzystamy przy projektowaniu UX i UI

Projektujemy w Figmie, warsztaty i mapy serwisu rozpisujemy w Miro, a ilustracje i animacje przygotowujemy w Illustratorze, Spline i Lottie. Zachowania użytkowników sprawdzamy w Google Analytics, Search Console, Microsoft Clarity lub Hotjarze.

Figma
figma
Adobe Photoshop
Photoshop
Adobe Illustrator
Illustrator
Spline 3D
Spline 3d
Lottie Files
Lottie files
Hotjar
hotjar
Google Analitics
analytics
Microsoft Clarity
Clarity
Search Console
Console
Miro aplikacja do pracy grupowej
Miro
Projektowanie graficzne i user experience

Pytania i odpowiedzi

Ile kosztuje projekt UX/UI strony lub sklepu?

Projekt UX/UI w Hilvec kosztuje od 15 000 zł netto. Cena zależy od liczby widoków, np. strona główna, kategoria, karta produktu, koszyk czy panel klienta. Liczy się też to, czy projektujemy od zera, czy poprawiamy istniejący sklep po audycie UX. Wycenę rozbijamy na widoki, więc od początku wiesz, za co płacisz.

Ile trwa projekt UX/UI?

Projekt UX/UI trwa zwykle od miesiąca do dwóch. Pierwszy tydzień to warsztat i plan widoków. Potem powstają makiety i klikalny prototyp, a na końcu projekt graficzny wszystkich ekranów w wersji na komputer i telefon. Dłużej trwają projekty z panelem klienta albo z rozbudowanym procesem zamówienia.

Co dostaję po zakończeniu projektu?

Dostajesz plik w Figmie z makietami, klikalnym prototypem i projektem graficznym wszystkich uzgodnionych widoków. Do tego bibliotekę komponentów, czyli przyciski, formularze i karty produktów, oraz opis zachowania elementów dla programisty. Plik należy do Ciebie, więc możesz go przekazać dowolnemu zespołowi wdrożeniowemu.

Ile kosztuje audyt UX i co zawiera?

Audyt UX kosztuje od 15 000 zł netto i trwa około miesiąca. Analizujemy dane z Google Analytics i nagrania sesji, a kluczowe ścieżki, takie jak wyszukiwanie produktu, koszyk i formularz, przechodzimy według heurystyk Nielsena. Wynikiem jest raport z listą problemów, ich wpływem na sprzedaż i zmianami ułożonymi od najważniejszych.

Czy możecie zrobić sam projekt, bez wdrożenia?

Tak. Przekazujemy plik w Figmie z opisem dla programistów, a w trakcie wdrożenia odpowiadamy na ich pytania i sprawdzamy, czy efekt zgadza się z projektem. Jeśli wolisz jeden zespół od projektu po start, wdrożenie też bierzemy na siebie; wtedy projektant i programista pracują na tym samym pliku.

Na jakich danych opieracie projekt UX?

Projekt opieramy na danych, które Twoja strona już zbiera: Google Analytics, nagraniach sesji i mapach kliknięć. Na tej podstawie wybieramy miejsca, w których klienci najczęściej rezygnują, np. filtrowanie, koszyk albo formularz, i od nich zaczynamy projekt. Prototyp przechodzimy z Tobą i Twoim zespołem, zanim powstanie projekt graficzny.

Czym różni się projektowanie UX od UI?

UX to układ i działanie: jakie informacje widzi użytkownik, w jakiej kolejności i ile kroków dzieli go od zakupu albo zapytania. UI to warstwa wizualna, czyli typografia, kolory, przyciski i ikony zgodne z identyfikacją marki. W Hilvec oba etapy prowadzi jeden zespół, więc wygląd nie psuje decyzji podjętych na makietach.

Czy projektujecie aplikacje webowe i panele?

Tak, poza stronami i sklepami projektujemy aplikacje webowe: panele klienta, panele administracyjne i systemy obsługi zamówień. Zaczynamy od rozpisania ról użytkowników i ich najczęstszych zadań, a dopiero potem układamy ekrany. Aplikacje mobilne też możemy zaprojektować, zakres ustalamy wtedy po rozmowie.

Porozmawiajmy

Chcemy pomóc rozwinąć Twój biznes!