Na czym polegało wyzwanie
Ararêtama to marka esencji kwiatowych z brazylijskiego lasu atlantyckiego, a strona ma jednocześnie sprzedawać, uczyć i budować klimat. Poprzednia wersja miała tło z lasu i rozbudowane menu, ale na tej samej stronie rywalizowało kilka stylów: jasnozielone przyciski, biały tekst na zdjęciach i szare, rozstrzelone nagłówki na rozmytej fotografii. Menu zawijało się do dwóch linijek, a karty sekcji na stronie głównej były białymi kafelkami, które wyglądały jak inny serwis.
Co zmieniliśmy
Zostawiliśmy to, co jest siłą marki — fotografie roślin i las w tle — a uporządkowaliśmy wszystko, co na nich leży:
- Menu — ciemny pasek w jednej linii z żółtym podkreśleniem aktywnej pozycji zamiast zielonych „pigułek" z zawijanym tekstem, a rozwijane podmenu jako osobny, jasny panel.
- Sekcja powitalna — nagłówek białym, pogrubionym pismem na ciemnym, półprzezroczystym panelu z zdjęciem lilii wodnej w tle, zamiast szarych wersalików na rozmytym kwiecie.
- Karty na stronie głównej — zdjęcie na całą kartę z tytułem i krótkim opisem na ciemnym gradiencie, w siatce 2×4, tak że widać wszystkie kategorie naraz.
- Lista esencji — wyszukiwarka nad listą, kafelki z ceną i przyciskiem „Opis".
- Kompozycje — ciemne belki z przyciskiem „Zobacz produkty" oraz sekcja „Zobacz także" z trzema typami kompozycji.
- Akademia i O nas — spójne z resztą belki i wyraźniejszy przycisk „Poznaj system Ararêtama".
- Stopka — nazwa marki, dane kontaktowe i nawigacja w dwóch kolumnach, w tej samej ciemnej palecie co menu.
Efekt
Strona nadal wygląda jak Ararêtama — las, kwiaty, złote akcenty — ale każdy element ma jeden, przewidywalny styl. Kategorie widać od razu, a od menu po stopkę klient przechodzi tą samą, ciemną ścieżką. Dokładne porównanie, ekran po ekranie, jest poniżej.
Zobacz na żywo
Strona działa pod adresem araretama.pl.
