Kompletní správa pěti webů pro firmu Bajard.

Firma Bajard vlastní přes 5 klinik a my je pravidelnou správou a analýzou neustále vylepšujeme. Pečlivě na webech sledujeme chování uživatelů a podle toho upravujeme jejich obsah a strukturu. Chceme docílit dokonalé informovanosti klienta ještě před tím, než do kliniky vůbec vstoupí. A to jednoduše a přehledně.

Logo Mamma centra Breast Unit Prague
Logo centra nukleární medicíny
Logo dermatologické kliniky
Logo Interní medicíny
Logo kardiologie Wencard
Screenshot webu z počítačové verze

Jak jsme vytvořili web pro dermatologickou kliniku.

Byli jsme požádáni o redesign webových stránek nově vznikající dermatologické kliniky. Web jsme měli zjednodušit a zorganizovat. Začali jsme analýzou starého webu, která nám pomohla k vytvoření cílové skupiny uživatelů. Po určení business cílů webu jsme se přesunuli k wireframingu. Ve spolupráci s doktory jsme vytvořili obsah webu a ten jsme poté vložili do cílového designu. User testingem jsme zkontrolovali, že je struktura i design v pořádku a web mohl jít online.

Co jsme dělali

Analýza webu
User research
UX & UI
Content strategy
User testing
WordPress

Jak jsme vytvořili web pro dermatologickou kliniku.

Byli jsme požádáni o redesign webových stránek nově vznikající dermatologické kliniky. Web jsme měli zjednodušit a zorganizovat. Začali jsme analýzou starého webu, která nám pomohla k vytvoření cílové skupiny uživatelů. Po určení business cílů webu jsme se přesunuli k wireframingu. Ve spolupráci s doktory jsme vytvořili obsah webu a ten jsme poté vložili do cílového designu. User testingem jsme zkontrolovali, že je struktura i design v pořádku a web mohl jít online.

Co jsme dělali

Analýza webu
User research
UX & UI
Content strategy
User testing
WordPress
Screenshot webu z počítačové verze

Analýza webu

Projekt formou redesignu nám umožnil využít data ze starého webu. Data jsme prostudovali a pochopili, jak se průměrný uživatel na dermatologickém webu chová, co ho zajímá a na co nejčastěji kliká. K těmto údajům jsme si ještě dohledali dodatečné informace z různých studií a prostudovali konkurenci.

Cílová skupina

Díky podrobné analýze jsme mohli jednoduše určit a rozepsat cílovou skupinu webu. Cílovku jsme ještě rozdělili do segmentů a k nim si vytvořili tzv. persony. Rozepsali jsme si jejich nejčastější problémy, vlastnosti a cíle. Na konci tohoto procesu jsme dobře rozuměli, pro koho web vytváříme a mohli jsme se pustit do struktury.

WIREFRAMING

Wireframingu ještě předcházela tzv. information architecture, kdy jsme si vytvořili seznam všech stránek a vymysleli, jak se nejlépe přesouvat z jedné stránky na druhou. Dohromady jsme vytvořili přes 30 stránek, a proto bylo jejich uspořádání klíčové. Wireframingem jsme si určili strukturu jednotlivých stránek, tedy kde, jaký element bude a k čemu bude sloužit.

Obrázek wireframu
Obrázek wireframu
Obrázek wireframu

Content strategy

Ve spolupráci s doktory jsme vytvořili obsah, který vyplnil všechny wireframy kvalitním, jasným a stručným obsahem. Také jsme si pro každou stránku určili klíčová slova a následně je vkládaly do obsahu.

WIREFRAMING

Wireframingu ještě předcházela tzv. information architecture, kdy jsme si vytvořili seznam všech stránek a vymysleli, jak se nejlépe přesouvat z jedné stránky na druhou. Dohromady jsme vytvořili přes 30 stránek, a proto bylo jejich uspořádání klíčové. Wireframingem jsme si určili strukturu jednotlivých stránek, tedy kde, jaký element bude a k čemu bude sloužit.

Obrázek wireframu
Obrázek wireframu
Obrázek wireframu

Content strategy

Ve spolupráci s doktory jsme vytvořili obsah, který vyplnil všechny wireframy kvalitním, jasným a stručným obsahem. Také jsme si pro každou stránku určili klíčová slova a následně je vkládaly do obsahu.

Cílová skupina

Díky podrobné analýze jsme mohli jednoduše určit a rozepsat cílovou skupinu webu. Cílovku jsme ještě rozdělili do segmentů a k nim si vytvořili tzv. persony. Rozepsali jsme si jejich nejčastější problémy, vlastnosti a cíle. Na konci tohoto procesu jsme dobře rozuměli, pro koho web vytváříme a mohli jsme se pustit do struktury.

Obrázek wireframu
Obrázek wireframu
Obrázek wireframu

WIREFRAMING

Wireframingu ještě předcházela tzv. information architecture, kdy jsme si vytvořili seznam všech stránek a vymysleli, jak se nejlépe přesouvat z jedné stránky na druhou. Dohromady jsme vytvořili přes 30 stránek, a proto bylo jejich uspořádání klíčové. Wireframingem jsme si určili strukturu jednotlivých stránek, tedy kde, jaký element bude a k čemu bude sloužit.

Content strategy

Ve spolupráci s doktory jsme vytvořili obsah, který vyplnil všechny wireframy kvalitním, jasným a stručným obsahem. Také jsme si pro každou stránku určili klíčová slova a následně je vkládaly do obsahu.

WEB DESIGN & PROTOTYPING

V této fázi jsme vzaly vytvořené wireframy a dali jim estetický vzhled. Hotový design jsme rozpohybovali a vytvořili prototyp. Prototypem jsme vyzkoušeli, že je web opravdu přehledný a jednoduchý na používání. Jestli to cílový uživatel vidí stejně jsme si ale museli ověřit.

Obrázek mobilní verze Kliniky preventivní dermatologie
Obrázek mobilní verze Kliniky preventivní dermatologie
Obrázek mobilní verze Kliniky preventivní dermatologie
Obrázek mobilní verze Kliniky preventivní dermatologie
Screenshot webu z počítačové verze
Screenshot webu z počítačové verze
Screenshot webu z počítačové verze
Obrázek mobilní verze Kliniky preventivní dermatologie
Obrázek mobilní verze Kliniky preventivní dermatologie
Obrázek mobilní verze Kliniky preventivní dermatologie
Obrázek mobilní verze Kliniky preventivní dermatologie

WEB DESIGN & PROTOTYPING

V této fázi jsme vzaly vytvořené wireframy a dali jim estetický vzhled. Hotový design jsme rozpohybovali a vytvořili prototyp. Prototypem jsme vyzkoušeli, že je web opravdu přehledný a jednoduchý na používání. Jestli to cílový uživatel vidí stejně jsme si ale museli ověřit.

Screenshot webu z počítačové verze
Screenshot webu z počítačové verze
Screenshot webu z počítačové verze

USER TESTING

Domluvili jsem si sezení se třemi klienty, kteří splňovali požadavky cílových uživatelů a dali jim náš prototyp do rukou. Uživatelé při práci s prototypem přemýšleli nahlas a říkali nám nad čím přemýšlí a co dělají. My jsme pozorovali jejich interakci s prototypem a zapisovali si poznámky, které jsme následně převedli na úpravy finálního prototypu.

USER TESTING

Domluvili jsem si sezení se třemi klienty, kteří splňovali požadavky cílových uživatelů a dali jim náš prototyp do rukou. Uživatelé při práci s prototypem přemýšleli nahlas a říkali nám nad čím přemýšlí a co dělají. My jsme pozorovali jejich interakci s prototypem a zapisovali si poznámky, které jsme následně převedli na úpravy finálního prototypu.

WordPress

Posledním krokem, bylo převedení webu na internet. Jelikož jsme věděli, že se bude web i po dokončení dál upravovat, rozhodli jsme se web udělat ve WordPressu, neboť úpravy v něm nejsou tam časově a finančně náročné.

SPRÁVA & analýza

Webové stránky spravujeme a staráme se o to, aby vše fungovalo na 100 %. Také je neustále vylepšujeme. Pravidelně analyzujeme chování uživatelů a děláme drobné změny jak v obsahu, tak ve struktuře.

použité nástroje

Design

Tvorba

Spolupráce

WEB DESIGN & PROTOTYPING

Posledním krokem, bylo převedení webu na internet. Jelikož jsme věděli, že se bude web i po dokončení dál upravovat, rozhodli jsme se web udělat ve WordPressu, neboť úpravy v něm nejsou tam časově a finančně náročné.

SPRÁVA & analýza

Webové stránky spravujeme a staráme se o to, aby vše fungovalo na 100 %. Také je neustále vylepšujeme. Pravidelně analyzujeme chování uživatelů a děláme drobné změny jak v obsahu, tak ve struktuře.

použité nástroje

Design

Tvorba

Spolupráce