Designing my first UX concept project: Tandu — travel and you
Understanding the core UX concepts and Visual Design techniques
In the first week as a student of UXD Immersive program at General Assembly, our project was to solve a problem of one of our classmates with whom we were partnered. It was not just a good icebreaker but also provided a good opportunity to develop an empathic approach in design thinking.
Initial Observation: My partner Cindy enjoys travelling around the world. The whole experience of booking a trip is exciting for her but she needs to research on different websites on things to do in that place.
Cindy needs something which will enable her to provide one-stop information on things she can do in that place.
Objectives:
- Articulate what user experience means by designing a mobile app solution to single target users.
- Apply visual design concepts
- Iterate and develop in lean methodology.
Project Timeline: 1-week concept development and 1-week visual design
Role: Product designer
Deliverables: Test script, User flow, sketches, High fidelity mockup of the mobile app. A 30-minute presentation of the prototype and summarising the UX work.
Tools: User interview notes, Ideation, Experience mapping, Customer Journey mapping, Storyboarding, Paper prototype, User testing, Marvel.
Phase 1: Research and Synthesis
Kicking off the lecture for the first day, my instructor Zoe, introduced us to design thinking. What struck me- was the idea of design thinking being the framework to solve complex problems and to find desirable solutions for the client.
Done Right, Design Thinking…
“Captures” the mindsets and needs of the people you’re creating for.
Paints a picture of the opportunities based on the needs of these people.
Can start to anchor on your designs and offers.”
-Sina Mossayeb,IDEO
This framework helped me to approach the user interview with Cindy (my partner) with an intention to bring some actionable solutions to her need. During the first round of interview process, she mentioned that she loves travelling. This was a starting point for the app as it captured her current situation.
Back in class, we learnt the 5 Whys and had a quick exercise to see how it works. Basically asking WHY in 5 successive questions. I could see that it was very easy to get into the trap of going round and round in a loop with the same answer. That would be really annoying to anyone! However, if done right, it could also be used to gain deep insights into user behaviour and motivation. To keep the research not feel like an interrogation, I started with the problem that she had experienced during her travel.
Next, I used experience mapping to assimilate all the insights from the interview. I transferred it to a digital time board. Although this was visually clear, there was still a lot of information to process.
A customer journey mapping helps to focus the actions where they are needed. Journey mapping was used in each phase of travel this helped me to concentrated on major touch points where we could gain empathy.
When Cindy’s travel is mapped, it’s quite clear that she enjoys the whole process of booking, anticipating and coordinating the travel plan. Though it did not seem like a pain point at first, the real issue for Cindy was, what she would do/see at the destination.
Framing questions and deep research
Taking the insights from journey mapping, I had one more round of interview with descriptive and open-ended questions. This was when the project was getting interesting!! It seemed that Cindy had an underlying fear: that while travelling with friends she would end up having a generic experience of the place. Cindy’s wanted an experience which is unique to her while exploring the local culture. However, she did not like spending time researching on the internet.
It was a big moment of discovery of the project.
Distilling the finding:
Finally, I synthesised my findings in the form of a problem statement. Now the project was seeing some light after all the research work.
Phase 2: Ideate and Develop
Sketching: By far the most fun aspect of designing and collaborating is that of idea sketching. I thoroughly enjoy this ancient process of getting it out of the head and on to the paper:). By following a truly agile method, I tested it with the user.
Out of the six solution-based designs, Cindy really liked the Local hero helper. It gave three specific choices that she could pick.
Personally, I would have picked the voice-activated assistant called Alice(I named it from the classic Alice in Wonderland, discovering a new place by surprise and following her wonder).
However, this was not what Cindy needed. She did not want to be talking to a robotic voice over her phone when on a holiday. I learnt how easy it was to get too attached to our design- even if it was an initial sketch. By bringing back the focus on the user, I could move ahead to design a user-centric solution.
Storyboarding and outcome statement
User Flow:
The user moves between various screens of the app in order to complete a task, in other words, the user moves through the system. A “happy path” is the ideal path the user takes moving from point A to point B.
I worked these out on post-it notes initially. Then simplified and digitilized them on to the Realtime board.
Prototype:
By definition, a prototype is an early sample of the concept. Therefore it is best to make a low fidelity prototype which requires less investment. Pen, paper, scissors, glue stick all to the rescue! It was challenging and fun at the same time to design user interaction on paper.
I went ahead and tested these with Cindy
After more testing and iteration loops, I made a few changes.
Some were:
- Moving between screens using the top-down scrolling vs left to right scrolling.
- Adding a call to action button rather than a notification
- Minimising the features which were available making it simple and easy
Using Marvel I transferred the prototyped to the mobile screen.
Here is the link to the prototype- http://bit.ly/Tandu-1
Next step was to start creating the visual design.
Branding
Having a clear brand strategy helps the user in recall and usability. I learnt that visual design was all about communication to the user.
Since it was a travel app that I was creating, it gave me a good opportunity to explore some beautiful colour and typography. I curated this mood board to draw inspiration for the app.
The tone of my brand voice was trendy, smart and fun. I took a step back and thought about what I was seeing and what my app communicated. It looked just like many of the other apps that were already having similar colour pallet. This was an opportunity for me as a designer to push the creative limits to deliver a memorable user experience. So I iterated the colour pallet on the last minute.
Outcome:
Cindy’s need was a unique and personalised experience just like the unique person that she is. I developed a style guide with some elements from the mood board. During my final testing, Cindy really loved the colour that I had chosen. Seeing her reaction was a big highlight for me.
Solution: My solution for Cindy was an AI-powered app which collects Cindy’s preference based on her online likes and page reviews. These are content that Cindy has given permission to be tracked. The app then generates a customised suggestion for three categories: Eat, See, Do. The fourth category “Surprise me” is a randomised order of the above three.
My learning from this first project
- Customer journey mapping is a simple yet powerful tool to recognise a pain point even if it is was not very apparent at first.
- It is very important to see the bigger picture and access what the user needs.
This was my first UX project 🙂. Please, share any comment, question or opinion on how you found my thought process and tips that you can share for me to improve on delivering a better design.
