Case study: utworzenie architektury informacji i przebudowa strony kancelarii
Czy strona może zniechęcić użytkownika do skorzystania z oferty? Jeśli panuje na niej chaos informacyjny i ma przestarzały, nieintuicyjny szablon, to jak najbardziej tak. Świadomość tego miała kancelaria Mentor Group, firma łącząca usługi prawne i księgowe. Zgłosiła się do nas z prośbą o przebudowę dotychczasowej strony i stworzenie nowej architektury informacji.
Spis treści
Założenia projektu
Projekt miał na celu stworzenie nowoczesnej strony internetowej dla Kancelarii Mentor Group, która świadczy zarówno usługi prawne, jak i księgowe. Naszym zadaniem było:
- zbudowanie nowoczesnej strony, która w sposób przejrzysty połączy ofertę prawniczą z księgową,
- wdrożenie przejrzystej architektury informacji na stronie,
- zmiana layoutu na bardziej korporacyjny, z naciskiem na profesjonalizm i przejrzystość,
- zoptymalizowanie strony pod kątem analityki internetowej (Google Analytics, Google Search Console, Hotjar).
Analiza wyjściowa
Na samym początku przyjrzeliśmy się starej stronie Kancelarii Mentor Group. Chcieliśmy zdiagnozować słabe strony domeny, aby wyeliminować dotychczasowe problemy.
Strona przed przebudową była oparta na starszym szablonie, który nie spełniał wymagań współczesnych użytkowników. Struktura menu była nieintuicyjna, a niektóre kategorie usług źle zorganizowane, co utrudniało szybkie odnalezienie oferty. Brakowało też wyraźnej separacji między usługami prawnymi a księgowymi. Uznaliśmy to za jeden z kluczowych punktów do poprawy.
Zmiana struktury i architektury informacji
Kiedy już przeszliśmy do fazy projektowania, jednym z pierwszych kroków było opracowanie nowej mapy strony. Konieczne było zmienienie sposobu, w jaki użytkownicy poruszają się po witrynie. Usługi prawne i usługi księgowe musiały być wyraźnie oddzielone. Choć obie te dziedziny były częścią oferty, każda z nich miała inne grupy docelowe.
Przy projektowaniu menu postawiliśmy na prostotę i intuicyjność. Wprowadziliśmy nową, przejrzystą strukturę, której celem było umożliwienie użytkownikom szybkiego i bezbłędnego znalezienia tego, czego szukają. Ostatecznie menu zostało podzielone na kilka głównych kategorii:
Taki układ nie tylko ułatwił nawigację, ale również wprowadził porządek w oferowanej ofercie. Warto podkreślić, że architektura informacji została zaplanowana z myślą o możliwym rozszerzeniu usługi w przyszłości, tak aby strona mogła rosnąć w przypadku rozwoju kancelarii.
Przygotowanie projektu w Miro
Cały proces projektowania strony w zakresie architektury informacji odbywał się w narzędziu Miro. Dzięki niemu, zespół mógł na bieżąco wizualizować strukturę strony i wspólnie analizować różne opcje, dokonywać korekt, a także testować różne rozwiązania. Każda sekcja była szczegółowo opisana, a nasza interaktywna mapa strony pozwalała na łatwe porównywanie opcji i dopasowywanie ich do potrzeb biznesowych. Miro umożliwiło nam dokładne określenie, które sekcje strony wymagają większej uwagi, a które można uprościć, aby użytkownicy łatwiej dotarli do najważniejszych informacji.
Rozmieszczenie kategorii w narzędziu miro.com
Rozmieszczenie kategorii w narzędziu miro.com
Miro pozwoliło na dokładne określenie, które sekcje strony wymagają większej uwagi, a które można uprościć, aby użytkownicy łatwiej dotarli do najważniejszych informacji.
Rozmieszczenie kategorii w narzędziu miro.com
Layout i design
Kiedy architektura strony była już gotowa, przeszliśmy do zmiany layoutu. Nowy projekt miał na celu podkreślić profesjonalizm kancelarii. Założeniem było stworzenie witryny, która wywołuje zaufanie, ale jednocześnie nie jest zbyt przytłaczająca. Dlatego minimalizm i przejrzystość były naszymi priorytetami.
Zdecydowaliśmy się na klasyczną, korporacyjną kolorystykę, w której dominowały stonowane barwy. Dodaliśmy też akcenty, które miały na celu uwydatnienie najważniejszych elementów strony – takich jak przyciski czy sekcje kontaktowe. Zaproponowane przez nas kolory były spójne z wizerunkiem marki.
Układ strony zaprojektowaliśmy w taki sposób, aby był czytelny i łatwy w nawigacji. Każdy blok tekstu został odpowiednio wyróżniony. Zamieszone grafiki wzmacniały przekaz. Poza tym, chcieliśmy, aby każda sekcja była zróżnicowana pod względem treści.
Projekt strony w Miro.com
Integracja Narzędzi Analitycznych – Hotjar
Aby zoptymalizować nową stronę i dokładniej dopasować ją do potrzeb użytkowników, zajęliśmy się integracją narzędzi analitycznych, a w szczególności Hotjar. Dzięki jego zastosowaniu mogliśmy na bieżąco monitorować, jak użytkownicy poruszają się po stronie oraz jak reagują na zmiany wprowadzone w architekturze informacji. Naszym celem było nie tylko zbieranie danych, ale także ich analiza i wyciąganie wniosków, które pomogły w dalszym doskonaleniu strony. Oto funkcjonalności, które zostały wdrożone:
- Mapa cieplna (Heatmaps)
Jednym z najważniejszych narzędzi, które zastosowaliśmy, była mapa cieplna (heatmap). Dzięki niej mogliśmy zrozumieć, które elementy strony przyciągają największą uwagę użytkowników, a które są ignorowane. Takie dane pozwoliły nam na dokładne dopasowanie rozmieszczenia informacji, tak by wezwania do działania, formularze kontaktowe czy najważniejsze sekcje usług były bardziej widoczne i łatwiej dostępne.
Zanim przeszliśmy do kolejnych zmian, przeanalizowaliśmy, które obszary strony były najczęściej odwiedzane, a które wymagały poprawy. Na przykład, jeśli mapa ciepła pokazała, że przycisk „Skontaktuj się z nami” nie przyciągał uwagi użytkowników, zdecydowaliśmy się na jego przeniesienie w bardziej widoczne miejsce lub wyeksponowanie kolorem.
- Nagrania sesji użytkowników
Niezwykle pomocnym etapem były nagrania sesji użytkowników. Dzięki nim mogliśmy dokładnie śledzić, jak użytkownicy korzystają z naszej strony, co robią, gdzie klikają, i co najważniejsze – gdzie napotykają trudności. Analiza tych nagrań ujawniła problemy, które mogłyby zostać przeoczone w tradycyjnych testach UX. Dzięki nagraniom mogliśmy nie tylko dostrzec problemy, ale również zaprojektować konkretne zmiany.
Co dalej?
Nowa wersja strony została pomyślnie uruchomiona. W późniejszym czasie nadal aktywnie ją monitorowaliśmy – nie tylko za pomocą Hotjar, ale również z wykorzystaniem Google Analytics i Google Search Console, by na bieżąco analizować indeksowanie podstron, a także ruch i zachowania użytkowników. Dzięki naszym działaniom strona wygląda i działa prawidłowo na różnych urządzeniach – od komputerów po urządzenia mobilne.
Podsumowanie
Przebudowa strony Mentor Group była kompleksowym procesem, który miał poprawić jej użyteczność oraz widoczność w wyszukiwarkach. Wprowadzone zmiany obejmowały:
- nową architekturę informacji: struktura strony została uproszczona, a podział na usługi prawne i księgowe ułatwił użytkownikom szybkie znalezienie potrzebnych informacji,
- nowy layout: strona zyskała profesjonalny, korporacyjny wygląd, prosty i przejrzysty design poprawił wrażenia użytkowników i zwiększył zaufanie do kancelarii,
- integrację narzędzi analitycznych: dzięki temu mogliśmy śledzić, jak użytkownicy poruszają się po stronie, mapy cieplne i nagrania sesji pomogły nam optymalizować stronę na podstawie realnych zachowań odwiedzających.
Na skutek tych zmian strona stała się bardziej intuicyjna i łatwiejsza w obsłudze. Została również lepiej dostosowana do potrzeb użytkowników i bardziej efektywna pod kątem SEO.
