Hauzer Clinic

Projektowanie i wdrożenie rozbudowanego serwisu medycznego WordPress — od architektury informacji i UX, przez UI, po zarządzanie treścią, fotografię i SEO.

23

specjalizacje

108

zabiegów

33

profile personelu

218

pozycji cennika

14 500

linii napisanego kodu

22

własne bloki

3

wersje językowe

61

pól zarządzania treścią

Strona, która wyrosła ze swojej struktury

Hauzer Clinic to rodzinna klinika i szpital jednego dnia z rozbudowaną ofertą: dziesiątkami specjalizacji, ponad setką zabiegów i badań oraz zespołem lekarzy wielu dziedzin.

Wraz z rozwojem kliniki rosła również jej strona internetowa. Kolejne informacje trafiały do istniejącej struktury, aż serwis przestał nadążać za skalą i złożonością oferty.

Dotychczasowa strona odzwierciedlała przede wszystkim strukturę organizacyjną kliniki, a nie sposób, w jaki pacjent szuka informacji. Oferta była podzielona między poradnie dla dorosłych, poradnie dla dzieci i szpital jednodniowy. W efekcie te same treści pojawiały się w różnych częściach serwisu, a dotarcie do właściwej informacji wymagało zrozumienia, jak zorganizowana jest klinika.

Pierwszy szkic architektury informacji serwisu Hauzer Clinic
Pierwszy szkic architektury informacji — jeszcze zanim powstał interfejs.
Menu główne serwisu Hauzer Clinic z podziałem na ścieżki użytkownika
Nowe menu główne serwisu z początkami ścieżek użytkownika

Zamiast działów — potrzeby pacjenta

Punktem wyjścia do nowej architektury było pytanie: po co pacjent przychodzi na stronę?

Może szukać konkretnego zabiegu, lekarza albo specjalisty zajmującego się jego problemem. Może potrzebować informacji o klinice, przygotowaniu do zabiegu lub sposobie umówienia wizyty.

Już na początku projektu rozpisałem te ścieżki oraz relacje pomiędzy najważniejszymi elementami serwisu. Z nich powstała struktura oparta na czterech podstawowych typach informacji:

specjalizacja ↔ zabieg ↔ lekarz ↔ cena

Nowy serwis nie wymaga od pacjenta znajomości struktury Hauzer Clinic. Pozwala zacząć od tego, co już wie, i prowadzi do informacji, której potrzebuje.

Porządek również od zaplecza

Treści w serwisie nie są niezależnymi podstronami, lecz danymi połączonymi relacjami. Lekarze są powiązani ze specjalizacjami i zabiegami, zabiegi z lekarzami i specjalizacjami, a cennik korzysta z tych samych informacji.

Zaprojektowałem i wdrożyłem autorski system zarządzania treścią oparty na WordPressie, dostosowany do codziennej pracy zespołu kliniki. Dodanie lekarza, zabiegu czy specjalizacji sprowadza się do wprowadzenia danych i wskazania odpowiednich powiązań. Formularze reagują na kontekst i pokazują tylko pola potrzebne w danej sytuacji.

Na ich podstawie serwis automatycznie buduje odpowiednie widoki według przygotowanych szablonów i własnych bloków WordPressa. Redaktor zarządza informacją, nie layoutem — nie musi pilnować układu strony ani zastanawiać się, czy po kolejnej zmianie coś się „rozjedzie”.

Cały system korzysta przy tym tylko z jednej dodatkowej wtyczki. Mniej zależności oznacza prostsze utrzymanie, mniejsze ryzyko konfliktów i mniejszą powierzchnię ataku.

Panel zarządzania profilem osoby w serwisie Hauzer Clinic
Pola ustawień SEO w panelu zarządzania serwisem Hauzer Clinic

SEO, którego się nie zauważa

SEO zostało zintegrowane bezpośrednio z systemem zarządzania treścią. Pracownik kliniki może w jednym miejscu kontrolować najważniejsze informacje, a jeśli ich nie uzupełni, serwis automatycznie generuje m.in. tytuły, meta descriptions i adresy canonical. Nic nie zostaje pominięte tylko dlatego, że ktoś o czymś zapomniał.

Stary serwis próbował walczyć o widoczność również tekstami w rodzaju:

„Nasza klinika specjalizuje się w chirurgii naczyniowej, którą zajmujemy się pod Wrocławiem, w Żernikach Wrocławskich”.

Fraza kluczowa była na właściwym miejscu. Człowiek trochę mniej.

Nowa strona nie ma mniej struktury pod wyszukiwarki. Ma jej więcej — tylko została przeniesiona tam, gdzie powinna być: w architekturę, semantykę, relacje między treściami, linkowanie wewnętrzne, dane strukturalne i dobrze napisany content — zamiast wciskać „pod Wrocławiem” dwa razy w jednym oddechu.

SEO i przygotowanie treści pod systemy AI stały się częścią architektury serwisu, a nie czymś, co użytkownik powinien zauważać podczas czytania.

Cennik nie musi być ślepą uliczką

Cennik zawiera 218 pozycji i należy do najczęściej odwiedzanych części serwisu. Na starej stronie był jednak zwykłą, długą listą: trudno było w niej znaleźć konkretną usługę, a znalezienie ceny zazwyczaj kończyło ścieżkę użytkownika.

W nowym serwisie cennik stał się częścią architektury informacji. Pozycje prowadzą do odpowiednich zabiegów lub specjalizacji, a przygotowana od podstaw wyszukiwarka pozwala szukać zarówno konkretnych usług, jak i całych sekcji, automatycznie otwierając właściwy fragment cennika.

Każda pozycja jest osobnym typem treści. Cenę wprowadza się raz w zapleczu, a system aktualizuje ją wszędzie tam, gdzie jest wykorzystywana.

Cena przestała być końcem ścieżki. Stała się jednym z punktów wejścia do serwisu.

Cennik usług w serwisie Hauzer Clinic

Warstwa wizualna

Projekt objął również kompletną warstwę wizualną — UI, typografię, kolor oraz autorskie materiały fotograficzne. Fotografowałem zarówno wnętrza i wyposażenie kliniki, jak i tworzących ją ludzi. Dzięki temu projekt interfejsu, treść i fotografia tworzą jeden spójny język, zamiast składać się z niezależnych elementów.

Złożoność zostaje pod spodem

Hauzer Clinic nie potrzebowała prostszego serwisu dlatego, że miała mało informacji. Przeciwnie — potrzebowała go właśnie dlatego, że informacji jest tak dużo.

Przemyślana architektura informacji, projekt UX, relacje między danymi, automatyzacja, SEO i autorskie rozwiązania WordPressa przejmują złożoność, której nie powinien widzieć ani pacjent, ani pracownik kliniki.

Skomplikowana klinika nie potrzebowała skomplikowanej strony. Potrzebowała skomplikowanego systemu, dzięki któremu strona może być prosta.

Otwórz serwis Hauzer Clinic — podgląd strony głównej