Kiedy SEO spotyka UX: sukces nowego mega menu kotarbau.pl

Początek współpracy

Kotarbau.pl to sklep internetowy z narzędziami budowlanymi i ogrodowymi. Od 2013 roku firma rozwija swoją działalność, inspirując się potrzebami klientów oraz zmieniającymi się trendami rynkowymi. Nieustannie poszerza ofertę i udoskonala procesy obsługi, aby zakupy online były szybkie, proste i przyjemne. Celem marki jest bycie partnerem, na którym można polegać – zarówno przy drobnych remontach, jak i dużych inwestycjach.

Celem naszego klienta było stworzenie intuicyjnego i uporządkowanego systemu nawigacji, który ułatwi użytkownikom odnajdywanie produktów, a jednocześnie wzmocni widoczność sklepu w wynikach wyszukiwania.

Wyzwania

Poprzedni układ menu był mało czytelny, zbyt rozbudowany i nie wspierał intuicyjnych ścieżek użytkownika. Klient potrzebował rozwiązania, które połączy strategię SEO, funkcjonalność UX i estetykę UI w spójny system nawigacji.

Klient zgłosił, że obecne menu nie spełnia w pełni oczekiwań użytkowników. Zidentyfikowaliśmy następujące problemy:

• Podejrzenie utraty orientacji: użytkownicy często gubili się w wielopoziomowej strukturze, mieli trudności w szybkim odnalezieniu interesujących kategorii.
• Mało angażujące elementy: menu nie przyciągało uwagi, nie wspierało interakcji ani decyzji zakupowych.

Celem projektu było opracowanie nowej struktury mega menu, które:

• poprawi intuicyjność nawigacji i skróci czas dotarcia do produktów,
• uporządkuje strukturę kategorii zgodnie z logiką SEO,
• zwiększy efektywność i komfort korzystania z serwisu w wersji desktop i mobile,
• wzmocni widoczność kluczowych sekcji w wynikach wyszukiwania.

Strategia i działania

1. Analiza kontekstu i strategia nawigacji UX

   W ramach analizy konkurencji i audytu UX menu oceniliśmy skuteczność dotychczasowej nawigacji. Zidentyfikowaliśmy kluczowe elementy wymagające uporządkowania, by zwiększyć przejrzystość i komfort korzystania z serwisu.

   

   

   Wersja mobilna

2. Optymalizacja struktury SEO

   W oparciu o analizę fraz kluczowych oraz istniejące kategorie opracowaliśmy nowe drzewo kategorii, które wspiera widoczność serwisu w wynikach wyszukiwania i ułatwia indeksację produktów. Strukturę zaprojektowaliśmy tak, by łączyć użyteczność z celami SEO.
   

   Projekt mega menu dla kotarbau.pl to doskonały przykład synergii między SEO a UX. Dzięki dokładnej analizie słów kluczowych udało się stworzyć strukturę, która wspiera zarówno widoczność w Google, jak i intuicyjność nawigacji.

   

   Krystian Wójcicki, Senior SEO Specialist

3. Projekt wizualny i prototypowanie

   Na podstawie zebranych informacji zaprojektowaliśmy makiety i interaktywne prototypy nowego mega menu w Figmie. Projekt uwzględniał spójność z identyfikacją wizualną marki, zachowanie logiki UX oraz responsywność z wersją mobilną.
   

   Dzięki zdjęciom kategorii, wyróżnikom i kartom produktowym w menu użytkownik z ciekawością zagląda głębiej, po drodze trafiając na interesujące produkty.

   

   Monika Kil, UX/UI Specialist



Wersja desktop

4. Dokumentacja i wdrożenie z partnerem technologicznym

   Przygotowaliśmy pełną dokumentację projektową oraz rekomendacje wdrożeniowe dla zespołu developerskiego. Projekt został zrealizowany we współpracy z IdoSell, co zapewniło płynne przejście od koncepcji do implementacji.
   

   Dokumentacja zapewnia, że projekt po wdrożeniu zachowuje swoje założenia i funkcjonalność. Każdy element ma jasne uzasadnienie, co ułatwia pracę zespołowi developerskiemu.

   

   Monika Ki, UX/UI Specialist

Wyniki

Nowe mega menu nie tylko poprawiło komfort użytkowników, ale również pozytywnie wpłynęło na SEO i efektywność nawigacji. Zmiany miały także na celu lepsze dopasowanie nawigacji do zachowań użytkowników w różnych kontekstach – zarówno na urządzeniach desktopowych, jak i mobilnych.

Nowy projekt mega menu został opracowany z myślą o zwiększeniu przejrzystości, estetyki i spójności z identyfikacją wizualną marki.

• Dodaliśmy karty produktowe dla wyróżnionych pozycji, dzięki czemu użytkownicy zyskali szybki dostęp do bestsellerów i aktualnych promocji już z poziomu nawigacji. Nowy wygląd menu jest nie tylko atrakcyjny wizualnie, ale przede wszystkim funkcjonalny – ułatwia orientację w strukturze sklepu i wspiera decyzje zakupowe.
• Podkategorie wzbogaciliśmy o wizualne akcenty – zdjęcia w okrągłych ramkach, które ilustrują główne podkategorie, wpisują się w nowoczesne trendy w e-commerce i wzmacniają estetykę całego interfejsu.
• Całość utrzymaliśmy w stylistyce zgodnej z identyfikacją wizualną marki, z dbałością o spójność pomiędzy warstwą graficzną, językiem komunikacji i aktualnymi trendami w e-commerce.
• W wersji mobilnej poprawiliśmy strukturę i hierarchię elementów, dzięki czemu menu stało się bardziej intuicyjne i czytelne. Wprowadzenie miniatur kategorii pozwala użytkownikom szybciej odnaleźć interesujące sekcje i zwiększa atrakcyjność wizualną interfejsu.

Wersja mobilna menu

Podsumowanie

Nowa wersja mega menu znacząco poprawiła intuicyjność nawigacji i komfort korzystania z serwisu. Przemyślana struktura kategorii i czytelny układ nawigacji pozwalają użytkownikom poruszać się po sklepie w sposób bardziej naturalny i komfortowy.

Efekty naszych działań potwierdziły, że połączenie SEO, UX i UI designu w spójnym rozwiązaniu może realnie wzmacniać efektywność i wizerunek e-commerce.

W tym projekcie kluczowe okazały się:

• partnerskie relacje z klientem – od wyceny po wspólne spotkania na każdym etapie procesu projektowego,
• doskonała współpraca z zespołem IdoSell – sprawna komunikacja i szybka implementacja projektu,
• pełna dokumentacja wdrożeniowa i transparentny przepływ informacji między zespołami.