Satisfying the Hunger for Health
I am currently an aspiring UX/UI Design Unicorn at the Codaisseur Academy in Amsterdam (following my passion, and answering my creative calling).
This is my design case for Takeaway.com, a company with Dutch origins that I chose for one of my course assignments (and because I consider myself a “foodie” and am not a fan of the design of their site).
The first task was to research the company for 1 week to uncover what would be the most valuable improvements I could make for Takeaway.com, & it’s hungry customers (and not be selfish and focus on what I wanted to change).
In the week that followed I needed to come up with magical design solutions to address any pain points identified. So please continue reading to discover the treats on offer to replace the burning odour of problems I uncovered when I took the lid off the pot of Takeaway.com.
Disclaimer: Please note that I am not affiliated with Takeaway.com or with any of the products and services noted/depicted in this article.
Over the period of one week, I did internal and external analyses of Takeaway.com, including conducting some qualitative and quantitative research. Given the time constraints, my sample sizes were small, but I still feel the results I obtained were enough to inform changes that would make a significant impact on the Takeaway.com service.
This outlines the timeline of my research process and the tools used. I will now be going into the important findings for each section.
Internal Analysis
As someone who leads a busy lifestyle, and lives with her software engineer husband, preparing our own meals is not high on our priority lists, so we end up ordering in way more than we probably should. When we arrived in the Netherlands last year, we stayed outside of the hustle and bustle of Amsterdam, and we opted to use Thuisbezorgd.nl as our food delivery service of choice, given the variety it offered and the availability of the service in the area we lived.
Takeaway.com was started in 2000 by Mr Jitse Groen (current CEO), who saw an opportunity to create one of the world’s first online food delivery services. Since then they have grown to supply their service to 10 countries in Europe, as well as Israel and Vietnam. Out of these 12 countries, they are leaders in the field in 8 of them! This puts them on the map as a leading food marketplace globally.
So now I knew they were giants in the online food marketplace world, I needed to find out how they work, to uncover how they became so successful.
An exert from their corporate website:
The take-home points from this extract are:
Qualitative Research:
I then brainstormed, and I also read through online reviews of the service in the Google Play store and on Trustpilot to figure out what where pain points being experienced by users.
Through this research common themes began to emerge:
From what I knew from using the service, and from the information I gathered I set up a survey on Typeform (click here to complete it or click here to view the report of the results), and from this I learnt that:
2. An interesting finding that I wanted to highlight was that people are more conscious of what they are putting into their bodies, they follow specific diet plans and want to be informed about what is in their food. This is demonstrated quite well in the following quote from the survey:
This finding was definitely an important one and one that would continue to recur in my research.
Qualitative research
I set out to do some Qualitative Research in the form of informal interviews to further investigate the needs of the user (click here to view the questionnaire template I used as a guide for the questions I asked).
From this I had the following findings:
In summary, through my qualitative research, I discovered that more people lead busier lifestyles these days, but are more health conscious about what they put into their bodies & enforce dietary restrictions on themselves.
External Analysis
Now that I had disproved my initial hypotheses of what the problems with the Takeaway.com platform was, and had stumbled upon a potential new problem that would be meaningful to the user & the business, it was time to take a step back and move onto the next part of my research.
This comprised a lean UX canvas and global trends analysis, which I then combined and summarized into a SWOT analysis.
Important findings from my SWOT analysis were:
Strengths:
Weaknesses:
2. As such a big company, not using the latest technology on the market (like real-time tracking for orders that competitors are using already).
Opportunities:
Threats:
Research Conclusion
It was now time to pool all my findings together (combine all my ingredients into one giant mixing bowl) and come to a succinct summary of what the pain points for Takeaway.com were that I uncovered.
To do this I started by drawing up an affinity diagram (the shopping list), which contained an overview of my key findings (the “I-need” items) which I then grouped into common themes (like I would in my list- bathroom items, kitchen items, etc.).
After identifying the common themes of my research findings, I plotted them on a graph (see below) to help me prioritize where the focus of my energy should go.
From this, I discovered I needed to concentrate on improving health consciousness on the platform, and should take into consideration that it should make the customer’s use of the service more convenient.
Keeping this in mind, I developed the following problem statement as my pot of gold at the end of the research rainbow:
It was now time to figure out how I would start to address this problem statement in one week… you read correctly, ONE WEEK! The perfectionist in me at this point had another heart attack (how it was still alive at this point in the design course is yet another mystery I did not have time to contemplate).
With no time to dedicate to freaking out, I silently sat in a corner and decided I need to start somewhere. I began by drawing up a design brief to clearly map out the problem & have an idea of what I needed to accomplish. I then brainstormed solutions & used the MoSCoW method to prioritize which “must-have” solution I should focus on (this is basically like writing up an ingredients list of what I needed to make my solution biscuits with, and base the flavour cookie I’m making on the research I did to help ensure it will be tasty and appealing for the customers using Takeaway.com).
The website handles over 800,000 orders per month (my husband and I contributing to this number too), so I knew this is where I would need to focus my re-design. So here it is (drum roll please):
Profile feature to set your diet preferences, with a new menu pop-up to direct you to your profile:
Click here to go through a prototype of the above screens (Note: designed for desktop dimensions — w. 1440 x h. 1024 — in the Figma tool, scale to fit your screen using the tool in the top right corner of the screen).
Prototype instructions:
Open the prototype link, it should be on the homepage, if not, press R/select reset in the top right-hand corner.
New Look for the Search Page to incorporate the Diet preferences into the search filter:
When you click the hamburger menu button on the homepage, a “my account” menu pop’s up. I had a few issues with this, so added in my changes. See if you can spot them.
So I first had an issue with the title, “my account” sounded so technical, instead I used the word Menu. Reasons for this word choice include:
I did A/B/C testing to decide on the wording of the heading:
“Menu” won and entered into the final design.
I then changed the layout of the design, and renamed the menu items, to make it more user-centred, and not use terms like “personal data”.
I then tested this using multi-variant testing, comparing a change in the layout and a change in the wording:
Users like my new design, compared to the original, and during the usability testing, I got feedback that maybe it should not include the possessive “my” in front of the menu list items. So I conducted further A/B testing with and without the “my”. In the end, the majority of people I surveyed voted against having the “my”, so it was removed from the final design.
Knowing I wanted to do a profile page where you can set your diet preferences, as a feature to improve the health consciousness on the site, I investigated what was available. And was utterly disgusted, to be honest…
The problems I had with this screen:
So I first started removing the unnecessary information and adding in the features I wanted on the page.
I then conducted usability testing to see if people liked the new design. I asked about 9 different people, my fellow designer peers, and random people in the building. Their feedback was very useful. They commented on wording they did not like and gave me design inspiration to make changes to the buttons and layout even further. I then conducted A/B testing to see what colour buttons I should have, and what wording users liked.
The orange button won, as it was the most appealing call-to-action, according to feedback I got from the people I surveyed. I then implemented this change and applied the same menu from the pop-up to the sidebar, and this resulted in my final design below:
This page took a lot of time, and probably would have gone a lot quicker if I made elements components! But sadly, I did not. Learnt my lesson the hard way. First, let’s take a look at the original screen to see how much it changed:
I really did not like the following:
I made a prototype and included all the features in the sidebar. I then took it for a spin and did some usability testing. Feedback from this included:
So I added these changes to the design:
I did A/B testing to confirm that the changes I made from the feedback I received were what the users would like, and they agreed it was better. And that is how I arrived at the final design that incorporates the different view and sorting options into the sidebar, as well as separate the search filter options into diet preferences (new feature added) and food category feature, and clean up the rest of the search filter sections.
After completing my new design for the website, it was time to think about how I would implement this design. The first thing to consider was who was going to be using the product, and what limitations or challenges might they face when using this platform. To demonstrate this I have created 3 user stories and acceptance criteria for them.
User Stories & Scenarios:
User 1: Bill
My first customer is Bill, he is a 56 yr old man who lives home alone after his wife tragically passed away from breast cancer a few months ago. Since then he has had to fend for himself but prefers to order take-out from the Thuisbezorgd.nl website instead of cooking all the time for one.
Scenario: Not very tech-savvy
When customers that are not so technologically skilled and they are used to using the website in it’s current state (like Bill), then the website does give them the option to view the website in the list format they are accustomed to, to help ease this transition period, and we can have a tutorial on the new features to help guide them through and orientate them to the new set-up of the search screen and profile page.
User 2: Sarah
Meet Sarah, she is a very busy 35 yr old lady. She is a single parent to her son Johnny, she works part-time at the local daycare centre and is also studying part-time to be a teacher. She is on the go and uses her mobile a lot, and her laptop when she is at home. She likes to order takeaway when her schedule does not allow her to cook food for her son and herself.
Scenario: Different devices
When the customer is on-the-go (like Sarah), and uses multiple devices to access the platform depending on where she is, then the platform is available for her to use on different devices, and also allows her to save her delivery addresses, so that she can deliver her food at work or at home, or wherever is convenient for her to receive the delivery.
User 3: Tom
This is Tom, the 29 yr old active man. He enjoys going for a run daily and has a gym session 4 times per week. He sometimes orders take-out for dinner at the office, when he works late at the law firm. Tom is a very visual person, so he likes to look at the map when he looks for where to get food (also if it’s close enough he would rather take a break and jog to the restaurant to pick up his order), but he would still like to be able to change the filter settings while in this view.
Scenario: Visual thinker
When customers like to search for their restaurant by viewing the map (like Tom) and they want to be able to adjust the filter options while in this view, then the sidebar view and search filter will still be visible when they are not in the full-screen view of the map, to allow them to easily change their preferences while still in the map view.
The last aspect in my final design process was to research what words to use in the new design to make it appear more in searches. Luckily for me, I had already used quite a few of these words in my design process. But this was an important step for the implementation of my design, as it’s no use it looks amazing if people can’t find it and use it (the whole purpose of this whole process). I would share this with my product team to ensure when we launch the new features, it will be viewed by more people.
To do this I created a list of words from Google trends (by searching Takeaway.com, food, diets and health, and viewing their related topics). I also wrote down words from my trend analysis I thought would be good to try and include, as well as include words that describe the features of the service.
First and foremost, I am immensely proud of what I accomplished in two weeks, as I did not believe I would accomplish what I did, especially while tackling personal problems.
I think through this process I learnt the importance of research in the design process to create meaningful creations. From doing the external analysis (especially the global trends), I learnt how everything is more connected than I realise.
I learnt that being aware of your own bias is important when making a design, and to allow the user’s voice to guide your design instead, whoever that may be, regardless if you agree with them or not.
I got to consolidate what we learnt in terms of our UI design skills, and improve on them further within the Figma framework. I got to improve on my time management skills, as well as my editing abilities (still needs work, but if I didn’t improve… let’s just say this article would probably have been at least double the length it is now).
I got to improve on my interview skills and work on my storytelling, both of which I really enjoyed doing as this is when I get to be my social self and express my creativity the most.
I think the most important thing I realised was that nothing is perfect, everything is in a state of constant iteration, and one should not be afraid of that, and accept imperfection as a part of life, have fun with it, and constantly be learning from failures, celebrating the successes, and constantly iterate to carry on improving in all aspects of your life.
Thank you for reading! If you like my style or have any feedback, please write me a response below, or feel free to drop me a mail (dr.m.theunissen@gmail.com), follow me here (or on Instagram), or stalk me on LinkedIn.
This design case was done in November 2018.
Satisfying the Hunger for Health
Research & References of Satisfying the Hunger for Health|A&C Accounting And Tax Services
Source
0 Comments