UX Research

design system

usability testing

Project

Project

About

During the project with the company viesure our goal was to create an app tailored to students coming to Austria to study, that would assist on their way and make help them get a foot hold in Austria.


We placed significant emphasis on facilitating peer-to-peer communication among users and providing extensive written guides to assist with life in Austria.

During the project with the company viesure our goal was to create an app tailored to students coming to Austria to study, that would assist on their way and make help them get a foot hold in Austria.


We placed significant emphasis on facilitating peer-to-peer communication among users and providing extensive written guides to assist with life in Austria.

Duration

October 2023 to February 2024

My Role

Research and Designer

Tools

Figma

Figma

Photoshop

Photoshop

Sheets

Sheets

UX Tweak

UX Tweak

Design Process

Design Process

We closely followed the Design Thinking Process, because the project boundaries would allow it.

We closely followed the Design Thinking Process, because the project boundaries would allow it.

Research

Research

01

01

Understanding

the Problem

Understanding

the Problem

02

02

User Interviews

User Interviews

03

03

Key Insights

Key Insights

Define

Define

04

04

Personas

Personas

05

05

User Journey Map

User Journey Map

06

06

How Might We

How Might We

Ideate

Ideate

07

07

Brain Writing

Brain Writing

08

08

User Flows

User Flows

09

09

Card Sorting

Card Sorting

10

10

Paper Sketches

Paper Sketches

Prototype

Prototype

11

11

Paper Prototype

Paper Prototype

12

12

Wireframes & Prototype

Wireframes &

Prototype

13

13

High-Fi Prototype

High-Fi Prototype

Test

Test

14

14

Usability Tests

Usability Tests

15

15

Final Design

Final Design

16

16

Design System

Design System

Research

Research

01

01

Understanding the Problem

Understanding the Problem

Desk Research

We started out by conducting desk research, to get to know what issues students coming to Austria commonly struggle with.


Our research concluded these 5 topics as the most relevant ones for students wanting to study in Austria.

We started out by conducting desk research, to get to know what issues students coming to Austria commonly struggle with.


Our research concluded these 5 topics as the most relevant ones for students wanting to study in Austria.

5 Most Relevant Topics

  • Community & People

  • Studies and University

  • Finances & Jobs

  • Lega, Visa & Insurance

  • Accommodation

02

02

User Interviews

User Interviews

Interview Questions & Research Goal

To better understand our target users needs, we brainstormed interview questions based most relevant topics from our desk research.


The interview question we came up should both validate our assumptions about our target group, as well as give us qualitative insights into the issues they are facing on their user journey.

To better understand our target users needs, we brainstormed interview questions based most relevant topics from our desk research.


The interview question we came up should both validate our assumptions about our target group, as well as give us qualitative insights into the issues they are facing on their user journey.

Participants

We recruited 4 Participants, that closely matched our target group.


Their age ranged from 19 to 29.


Among them, 2 German and 2 non-German speaking ones, with a diverse mix of genders.


Most of them had been living in Austria for < 1 year.

We recruited 4 Participants, that closely matched our target group.


Their age ranged from 19 to 29.


Among them, 2 German and 2 non-German speaking ones, with a diverse mix of genders.


Most of them had been living in Austria for < 1 year.

Interview Method

We conducted 3 out of 4 interviews moderated and in-person, while one of them was conducted moderated and remotely via Zoom.

We conducted 3 out of 4 interviews moderated and in-person, while one of them was conducted moderated and remotely via Zoom.

In total we had 15 interview questions prepared.

In total we had 15 interview questions prepared.

03

03

Key Insights

Key Insights

After analysing our Interview Data, we condensed it down to 4 key Insights.

01

Social Support

Having the support of others, is fundamental to get through the process of coming to Austria. People often will search for other people’s advice to get over obstacles in their journey.

02

Local Connections

People need an easy way to connect to each other in Austria.

03

Access to Information

That students coming to Austria need access and support to information and help going through the visa and insurance process. Government information such as Visa, are always in German that can be a struggle to foreigners (language barrier).

04

Finding The Right Accommondation

That communication with student dorms / accommodations options is a struggle, because of language barriers and finding the right people to live with, as well as knowing remotely if is is a suitable option.

Define

Define

04

04

Personas

Personas

Based on all the insights we got from our User Interviews, we moved on to create 3 personas to represent our target groups and their individual needs.


Our core persona is Enrico, who we focused on the most, since he is the one representing our biggest target group.

Based on all the insights we got from our User Interviews, we moved on to create 3 personas to represent our target groups and their individual needs.


Our core persona is Enrico, who we focused on the most, since he is the one representing our biggest target group.

05

05

User Journey Map

User Journey Map

To further empathize with our persona Enrico and to better understand his struggles, we created a User Journey Map for him.


This helped us realize where the potential for improvement opportunities lies.

To further empathize with our persona Enrico and to better understand his struggles, we created a User Journey Map for him.


This helped us realize where the potential for improvement opportunities lies.

06

06

How might we

How might we

Using “How Might Be” questions, we then proceeded to come up with ideas to solve the most prominent issues that came out of our Key Insights, Persona and User Journey.

Using “How Might Be” questions, we then proceeded to come up with ideas to solve the most prominent issues that came out of our Key Insights, Persona and User Journey.

How might we...

guide Enrico through the process of applying for visa and help him keep an overview on his steps?

How might we...

support Sophie & Enrico to find their way to learn German without spending a lot of money?

How might we...

help Enrico and Sophie seek an accommodation with like minded people that is affordable?

How might we...

support Enrico in easily building up a network, connect with people that are like minded or share his passion?

How might we...

make the insurance information process for Enrico more digestible and intuitive?

How might we...

create a welcoming and inclusive environment for Felix and Enrico, so that they feel more at home in Austria?

Ideate

Ideate

06

Brainwriting

Brainwriting

So we would come up with ideas for our “How might we” statements, we did a Brainwriting exercise.

07

User Flows

User Flows

After our first ideas came to fruition we mapped out a few of the most important user flows for our solution.

User Flow #1

User Flow #1

Search for Visa application document and request help understanding it

User Flow #2

User Flow #2

User wants to register in the App

User Flow #3

User Flow #3

User rates helpful open chat

User Flow #4

User Flow #4

User wants to look for accommodation

08

Card Sorting

Card Sorting

We first started out with a simple Sitemap, but then we realized we had a very deep information architecture with a lot of topics. To make sure that we would provide the ideal navigation structure and right categories, we conducted a hybrid card sorting with 16 users, where they would sort the categories themselves.


We used a combination of real paper cards and the online tool UX Tweak, to get as many participants as possible.

09

Paper Sketches

Paper Sketches

In the early stages, we sketched out our app ideas on paper, allowing us to brainstorm freely and tweak designs on the fly.


We then voted on our best ideas and parts that we wanted to integrated in our next round of sketches and the prototyping phase.

Prototype

Prototype

11

11

Paper prototype

Paper prototype

So we would come up with ideas for our “How might we” statements, we did a Brainwriting exercise.

12

12

Wireframes & Prototype

Wireframes & Prototype

In the wireframe phase, we translated our paper sketches into digital blueprints, mapping out the structure and functionality of our app in a simplified form.


In addition, we used Figma to create a prototype based on our wireframes, which we then tested with potential users.

Our tests showed us that a lot of users were confused about our start page and the events feature.


After some discussion we decided to focus on our to pillars the “Austrian Guides and the “Peer to Peer” help features.

13

13

Hi-fi Prototype

Hi-fi Prototype

Clicking on the support button, users are able to ask others users for help on their journey.

The Guides sections on the primary navigation leads to all the availble guides, that the user can access to help them.

The list of different guides shows at what point of the journey they can be used.

The details of a guide have different sections.

Test

Test

14

14

Usability tests

Usability tests

Occupation

Students

Age

18 to 30

Status

EU & Non-EU

Countries

Germany, Colombia, USA

Interviewees

5 People

After finalizing our high-fidelity prototype, we conducted usability tests with a diverse group of 5 participants.


Through these tests, we observed how users interacted with the app and wanted to see if users were able to understand and use our two core features.

Chat Function

Peers helping Peers

Info Function

Helpful Guides

15

15

Final Design

Final Design

Users annoyed that they had no way of skipping the intro.

Users annoyed that they had no way of skipping the intro.

Users annoyed that they had no way of skipping the intro.

Users did not want to register for the app.


So we created a new userflow where users were able to use the guides but access to the peer to peer feature is restricted.

Users did not want to register for the app.


So we created a new userflow where users were able to use the guides but access to the peer to peer feature is restricted.

Users did not want to register for the app.


So we created a new userflow where users were able to use the guides but access to the peer to peer feature is restricted.

16

16

Design system

Design system

Typography

We choose Urbanist for our apps font.


We used Regular, Semi-Bold & Bold for our Typefaces.

We used an 8pt Grid with a Line Height Scale Factor of x1.5

We also decided to create a Design System in a separate Figma file, including Design Tokens.

Heading xlarge

Heading xlarge

40/60

40/60

Heading large

Heading large

32/48

32/48

Heading medium

Heading medium

24/36

24/36

Heading base

Heading base

20/28

20/28

Body xlarge

Body xlarge

32/48

32/48

Body large

20/28

Body medium

16/24

Colors

Colors

Primary

Primary

#D24444

Red 100

#C84138

Red 200

Accent

Accent

#A095D6

Indigo 200

#F5AC00

Yellow 200

Shades

Shades

#D24444 - 20%

Red Shade 100

#A095D6 - 20%

Indigo Shade 100

#F5AC00- 20%

Yellow Shade 100

Neutral

Neutral

#E9EBED

Neutral 500

#96A0AD

Neutral 600

#495159

Neutral 700

#1A1C23

Neutral 800

#161616

Neutral 900

#161616

Neutral 900

#FFFFFF

White

#1A1A1A

Dark

You can checkout the full Design System here.

You can checkout the full Design System here.

Let’s connect

Feel free to reach out for opportunities or simply to say hello! 👋

Let’s connect

Feel free to reach out for opportunities or simply to say hello! 👋