UX Designer Professional Diploma Project
UX Design Institute - Glasgow Caledonian University
This project consists of work I did for UX Design Institute - Glasgow Caledonian University as part of a 6 months training, to become a certified UX professional. I had to folllow the real life cycle of a UX project during the course, covering topics such as UX principles, user research, analysis frameworks, interaction design, prototyping and wireframing.
The Assignment:
Conduct research on existing flight booking websites and use your findings to design a user-friendly flight booking web application.
-
Duration: 6 months
-
Tools: Adobe XD, Miro
Phase1: Resarch
Usability test:
To kick-off the project, I started with Usability testing and Depth - interviews.
The first step was to define my objectives and define exactly what I wanted to achieve from the Usability testing. I created a test script for desktop usability testing. Finally I conducted two desktop Usability test sessions.
My main objectives with the research was to:
-
Learn more about the context of use of people that use airline websites or apps. What are they trying to do; who are they with; where are they; what devices are they using?
-
Learn about the goals, behaviours and context of airline customers when booking flights
-
What are the pain-points during the process, discover where and when users feel empowered and frustrated during the journey.
-
Learn what kinds of problems will likely cause the user to leave the website.
Note taking:
UXDI provided me two additional Usability tests, that was done around the same topic, testing AerLingus and Eurowings websites. I have taken notes, everything that I felt relevant to describing the current user experience:
-
goals
-
behaviours
-
pain points
-
mental models
-
contextual information
Phase2: Analysis
Affinity Diagram
Next, it was time to start making sense of the data. To do that with the help of my colleagues from work, I made an Affinity Diagram session. This session was a great way to sort through large volumes of data and get to the root of my findings.
Preparation for the Affinity Diagram workshop
Of course before the workshop I printed all materials and made sure we have all the tools such as sticky notes and pens what we need.
I was planning to digest three Usability test and a Competitive Benchmark document, which was also provided by UXDI.
Affinity Diagram workshop
Duration: 4 hours
-
First we worked individually, we wrote each point down from the research, that we thought are important on post-its.
-
Each of us presented shortly in 10 minutes the summary of the research what we worked with.
-
We stuck the post-its onto a big white - board and tried to look for patterns and sorted them into categories.
-
We gave each group a name
Customer Journey Map
I took the information from the affinity diagram and organised it into a step by step view of the journey to show how the users felt at each stage.
On the Customer Journey Map I was focusing on the user:
-
Goals
-
Behaviours
-
Context
-
Pain Points
Fly UX Customer Journey Map on Miroverse
I am very proud, because the Miro stuff has picked my customer journey map and it is avaliable on Miroverse and can be used as a starter template for the Miro community.
Phase 3: Design
Flow diagram for desktop:
Using the findings from the research and analysis, I created a flow - diagram. My overall objective was to fix the issues I have uncovered, which are highlighted on the customer journey map.
Objectives
-
Define the high-level flow for booking flights on my new airline website, on "Fly - UX"
-
Address all the issues highlighted on the customer journey map
-
Lay the groundwork on which I’ll build designs in upcoming projects
Desktop Interaction Design:
In this project, I continued the design process and sketched the screens of flight booking process. So far I’ve
done a lot of work understanding and articulating the problem, now I was ready to get into “solution mode” and start solving that problem.
-
Build on the flow diagram I created in the previous project sketch the screens and screen states for users flowing through the Fly UX desktop app
-
Address all the issues and user goals identified in my research and analysis
-
Use sketching as a tool for problem solving
-
Use sketching as a vital step before prototyping or digital wireframing
Medium Fidelity Prototype:
After sketching each screen state, I could than design each screen state in medium fidelity form to create a prototype. This prototype could then be fed back into a testing / validation phase and iterated over time for improvements.