← Wszystkie projektyArchiwum · 2026

Posypkowo

Posypkowo Kolorowo od 2006 roku dostarcza lodziarniom posypki, sosy i dekoracje. Zaprojektowałem sklep internetowy firmy: katalog całego asortymentu, karty produktu ze sprzedażą na opakowania, koszyk, do którego zawsze jest jedno dotknięcie, i kasę, która mieści się na jednej stronie.

Zobacz na żywo

Klient
Posypkowo Kolorowo
Moja rola
Projektowanie UI
Rok
2026
Zakres
Sklep internetowy / Karty produktu / Kasa
Strona główna Posypkowo Kolorowo w oknie przeglądarki, z miseczkami lodów, oraz katalog produktów na telefonie, na ciemnobrązowym tle
Rys. 01Strona główna, a na telefonie katalog.

Notatki

Zamawiają tu ludzie, którzy prowadzą lodziarnię i wiedzą, po co przyszli. Dlatego sklep nie przekonuje, tylko od razu prowadzi do półki: katalog otwiera się produktami z cenami, kategorie z boku mówią, ile produktów mieści każda z nich, a posypkę można włożyć do koszyka prosto z listy. Historia firmy ma własną stronę, dla tych, którzy chcą ją poznać.

Decyzja projektowa

Każde opakowanie ma swoją cenę

Lodziarnia nie kupuje posypki, tylko jej kilogram albo dziesięciokilogramowy karton. Dlatego opakowanie jest pierwszym wyborem na karcie produktu, a każda wielkość pokazuje swoją cenę, zanim cokolwiek trafi do koszyka. Katalog pokazuje, od jakiej kwoty zaczyna się cena, a koszyk obok sumy zlicza wagę zamówienia.

Katalog na telefonie z przyciskiem filtrów, liczbą produktów i dwoma kaflami produktów, z których jeden ma cenę od 48,33 zł
Katalog pokazuje, od jakiej kwoty zaczyna się każda cena.
Karta produktu na telefonie z ceną, dwiema wielkościami opakowania, każdą z własną ceną, polem ilości i przyciskiem dodania do koszyka
Karta produktu: wybierasz opakowanie, widzisz jego cenę.
Koszyk na telefonie z jednym produktem, wielkością opakowania i ilością, wagą koszyka, sumą i przyciskiem przejścia do kasy
Koszyk sumuje wagę i kwotę.
Proces

Zaczęło się od katalogu

Pierwsza wersja strony była katalogiem: karta produktu miała zdjęcie, nazwę i jeden przycisk, „Zapytaj o cenę”. Sklep zamienił to pytanie w odpowiedź. Dziś produkt zaczyna od ceny każdego opakowania, a zamówienie trafia do koszyka zamiast do skrzynki mailowej.

Pierwsza wersja karty produktu ze zdjęciem, nazwą Ruby Crunch, jedną linią opisu i przyciskiem „Zapytaj o cenę”
Przed: jeden przycisk, „Zapytaj o cenę”.
Działająca dziś karta produktu ze zdjęciem, ceną, dwiema wielkościami opakowania, polem ilości i przyciskiem dodania do koszyka
Po: cena, opakowanie i koszyk.
Komponenty

Jeden kafel wszędzie, gdzie jest produkt

Sklep jest zbudowany z niewielkiego zestawu elementów. Produkt wygląda tak samo na stronie głównej, w katalogu i pod innym produktem: kategoria, nazwa, cena i mały przycisk koszyka. Przyciski pracują w parach: wypełniony służy do kroku, który posuwa zamówienie naprzód, a cichy do powrotu.

Plansza z elementami sklepu, na której są kafel produktu, cena z wielkościami opakowania i polem ilości, filtry kategorii, przyciski na białym i na ciemnobrązowym tle oraz pola kasy z dwiema opcjami dostawy
Kafel produktu, wybór opakowania, filtry, przyciski i pola kasy.
Kasa w oknie przeglądarki, z danymi do dostawy i opcjami dostawy po lewej oraz podsumowaniem zamówienia po prawej, a obok ta sama kasa na telefonie
Rys. 03Kasa: jedna strona, z podsumowaniem zamówienia obok formularza.