mza Medizinzentrum Alserstrasse

Website

Healthcare center

Macbook Long Scroll Mockup.png

Context

During my participation at the UX Design Bootcamp at Talent Garden Vienna we had to perform a personal project of our choice.

Medical center Alserstrasse had a website which didn´t represent the professional and modern center as it is. There were also a lot of calls which could be decreased by presenting the important information more structured on their website.

Duration

2 weeks 

Role

UX research

UI design

Team

me myself &

I

Tools

Miro

Adobe 

Figma

The Importance Of An Online Presence For Physicians

WorldHealth.net

Jan 2020

2/3 of patients choose a provider based on their online presence. Most respondents – even those above the age of 60 – will select a provider over another because of their online presence. 

Research

Reasearch included competitor analyse, usability testing with the existing website and an interview with some stakeholders. The first usability testing included

Usability test

Interview

Time-on-task

Card sorting

Research

3 peolpe

36,6 years

5F17D75D-16DB-46EC-9536-9543C86D1C07_edi

Research Highlights

Users have problems to find important information easily. e.g.: if it is a „Wahlarzt“ or „Kassenarzt“ 2 of 3 would have closed the webiste usually

 

To get in touch with a physiotherapist is complicated

 

2 of 3 prefere a online booking system.

„ Also normal hätte ich jetzt schon aufgegeben und einfach wonaders nach einem Arzt gesucht“

Takeaways target group

- Old design
- Accessibility for everyone is not given

- Mobile responsiveness can be improved

- People have problems to find the information they are searching for

Takeaways stakeholder

- clean design
- decrease unnecessary phone calls

- services on first page

- keep existing colors and logo

- communicate new orientation of  "Zentrum für orthopädische Chirurgie und   Sportorthopädie"

Prototyping 

Low-fi

With the outcomes I created the first paper & pen sketches to overview my ideas. So it was possible to discuss my sketches with my collegues.

IMG_5902_edited.jpg

After creating a basic structure it was time to start prototyping in Figma.

High-fi

Testing & interation

I created several designs and improved it after testing them, it was an iterating process.

Element 1.png
Element 1.png
12.png
Element 1.png
Element 1.png
1.png
old3.png
1final.png
old3.png

Design Solution

The outcome was a clean designed landing page with structured information about the healthcare center. The accessibility is increased by a chosen font not smaller than 16px and enough contrast. I decided to not overwhelm visitors with too many pictures on the one hand, but friendly modern and personal pictures on the other side to present the modern institute.

Before 

screencapture-mza-at-2020-09-10-14_26_22

After

Bildschirmfoto 2020-11-18 um 11.50.32.pn
Bildschirmfoto 2020-11-18 um 11.52.18.pn
Bildschirmfoto 2020-11-18 um 11.51.45.pn
Bildschirmfoto 2020-11-18 um 11.50.45.pn
7A4350CE-7125-4B06-9673-7B1BDF98A883_1_1
8D3BD7ED-7DFC-45FE-818C-6A9DC7EA7E85_1_1

Reflection

🔁 As this was my first UX Design for a website I got confirmed in my  assumption, that the detailed and iterated design process of the landing page is crucial to have a guidance for the consistency of the sub pages.

​

👨🏽‍⚕️ Also including stakeholders from the beginning has a big importance for a good and succesful design.

​

🔍 How to show the overview of the services they offer was one of the most challenging parts. I raised my knowledge about it during a detailed research and user testing.

​

🏅 The result is a outstanding website compared to the competitors in this field.

​

📍feedback deadlines help you to follow the time schedule

​

​

​

​