AW33 - AW37: Project Exam

Redesign

Espresso House Mobile App

Student name: Nga Pham

Submission date: 28/05/2023

About the project

I chose the open brief and the project is about re-designing the Espresso House pre ordering app

Coffee Bean Sketch

The goal of this project is to recreate the app based on research from customers frustration and pain points. Users should be able to easily and conveniently order and pay for coffee via the app, which should also improve the whole coffee experience.


The project will be guided by the design thinking process, with a focus on exploring the problem area and identifying user needs and pain points.

1

Table of contents

Design Process

User Research

Personas

User Scenarios

Problem Statement

Ideation

Sketch

IA - Userflow - Taskflow

Usability

Research Finding

01

06 - 11

12 - 13

14

15

17 - 18

19

20 - 22

23 - 25

26 - 28

Mid-fidelity Wireframe

High-fidelity Wireframe

Testing prototype

Report Finding

Improvement

High-fidelity overview

Accesesibility

Design system

29 - 31

32

33 - 36

37

38

39 -44

45

46 - 47

2

My Design process

Dashed Line Arrow
3D Neomorphic Light Square Debossed
3D Magnifying Glass Science Research
3D Neomorphic Light Square Debossed
3D Target Bussiness
3D Neomorphic Light Square Debossed
3D Brain AI Illustration
3D Neomorphic Light Square Debossed
3D School Pen
3D Neomorphic Light Square Debossed
3d checklist
Hand Drawn Spiral Dashed Arrow
Brushstroke Arrow Rapid Curved Long
Brushstroke Arrow Rapid Curved Long
Brushstroke Arrow Rapid Curved Long
Brushstroke Arrow Rapid Curved Long

research

Define

Ideation

Prototype

Testing

Create research plan

Literature review

Competitive analysis

User interview

Problemstatement

Personas

Scenarios

IA

User flow

Brainstorming

Sketching

Wireframes

Low-fidelity wireframe

User testing

Synthesising result

Analysis data

Report

3

User research

Empathise

To gain insights into the customer needs, behavior, motivations, and pain points, the research process will involve conducting literature study, competitive analysis, interviewing, and observing.

This will be used to define the problem area and user needs that the app should address, as well as to generate ideas for the app's design and features. The research process will help to ensure that the final product is user-friendly and meets the needs of its target audience.

The primary goal is to create a positive user experience by designing interfaces and interactions that are intuitive, efficient, and engaging

4

5

I conducted a heuristics evaluation on each screen of Espresso House app and found minor flaws

Empathise

5 w&h questions

Empathise

Who is the target audience for the app?

What are the user needs and goals for the app?

When will users use the app?

Where do users encounter issues with the current app?

Why are people unhappy with the app?

How will the app meet user needs and goals?


5 w&h questions

6

Method of research

Research Method

Qualitative

Quantitative

Primary

Secondary

Competitive analysis

✔️

✔️


✔️

Interview

✔️


✔️


Literature review

✔️

✔️


✔️

Observation

✔️


✔️


Usability testing

✔️

✔️

✔️


Empathise

To gain insights and understand the users' needs and goals, I used a combination of generative, exploratory, and evaluative research methods.

Generative research involves gathering information about the user and their needs, behaviors, and motivations to generate ideas and insights for the design of the app. Generative research methods that may be used include:


  • User interviews: Conducting interviews with existing and potential users to understand their pain points, needs, and desires when using a mobile app for ordering coffee and food.
  • User observation: Observe users in their natural environment (in-store or while ordering online) to understand how they interact with the current app.
  • Literature review: Gather important information about best practices, design strategies, and user behaviours related to mobile app
  • Usability testing: Testing the design/prototype of the app with a participant of users to ensure it is intuitive and easy to use.
  • Competitive analysis: This is a process of evaluating your competitors' performance, what they offer, and how well they are doing it.


7

Competitive Analysis

Name

Strength

Weakness

Opportunities

Threats

Espresso House

- Popular and growing coffee chain in Scandinavia

- Menu includes specialty drinks and baked goods

- Convenient locations in urban areas

- Limited international presence compared to Starbucks

- Smaller menu compared to Starbucks

- Less established rewards program and mobile ordering

- Potentially less recognizable brand outside of Scandinavia

- Continued growth and expansion into new markets

- Expansion of menu offerings to include more food items

- Partnership with local businesses for increased visibility

- Improved rewards program and mobile ordering capabilities

- Increased opposition from local stores and other coffee chains

Starbucks

- Strong brand recognition and global presence

- Wide variety of menu options, including food items

- Established mobile ordering and rewards program

- Consistent quality and customer experience

- Higher prices compared to other coffee chains

- Some places have inconsistent quality and service

- Few options on the menu for people with dietary restrictions

- Continued expansion into international marketsContinued expansion into international markets

- Expansion of mobile ordering capabilities

- Competition from established coffee chains like Starbucks

Kaffebrenneriet

High-quality coffee, cozy atmosphere, eco-friendly values

Limited menu options, higher prices compared to competitors

Expansion into new locations, partnerships with local businesses

Competition from larger coffee chains, economic downturn affecting sales

Baker Hansen

Freshly baked goods, wide range of menu options, convenient locations

Inconsistent quality across locations, limited seating space

Expansion into new markets, partnerships with hotels and other businesses

Competition from larger coffee chains, changing consumer preferences towards healthier options

Godt Brød

Organic and locally-sourced ingredients, freshly baked bread, cozy atmosphere

Limited menu options, higher prices compared to competitors

Expansion into new markets

Competition from larger coffee chains, economic downturn affecting sales

W.B. Samson

Long-standing reputation, traditional Norwegian bakery items, convenient locations

Limited menu options, outdated interior design

Expand the menu offerings

Competition from larger coffee chains, changing consumer preferences towards healthier options.

8

Coffee Bean Sketch

Literature ​Review

Fact

Experience

Research Method

Date Captured

Who is the target audience for the app?




Primarily coffee drinkers who are on the go and ​looking for a convenient way to order and pay ​for their coffee




Students




Youngt aldult




What are the user needs and goals for the app?




Order coffee and food easily and quick

Neutral

Literature review + ​Interview


Being able to customize their orders to their ​preferences

Neutral

Interview

28/04/2023

The app should be user-friendly and easy to ​navigate, allowing customers to quickly browse ​the menu, place their orders, and pay for their ​items

Positiv

Literature review

27/04/2023

Paying process need to be easy and quick

Neutral

Literature review + ​Interview


Track their rewards points and redeem them for ​discounts

Neutral

Interview

27/04/2023

Add vipps in paying process

Neutral

Literature review + ​Interview

27/04/2023





When will users use the app?




When they quickly grab their coffee and go ​without having to wait in line or interact with a ​barista.

Neutral

Interview

28/04/2023

People grab a cup of coffee on their way to work ​or school in the morning

Neutral

Interview


Want to save time and reduce wait times in line.

Neutral

Interview

28/04/2023

They want to track the nearest Espresso House

Neutral

Interview

28/04/2023

Check for special offer or deal

Neutral

Interview

28/04/2023

Check the menu

Neutral

Interview

28/04/2023

Scan the QR code

Neutral

Interview

29/04/2023





Where do users encounter issues with the ​current app?




Purchasing subscriptions on Android

Negative

Interview

28/04/2023

The transaction after order and paying is slow

Negative

Intterview + ​Observation

29/04/2023

Inaccurate wait times: Some users have reported ​that the estimated wait times for their orders are ​inaccurate or misleading, leading to longer wait ​times than expected.

Negative

Literature + ​Observation

29/04/2023

Payment issues

Negative

Literature review


The app does not offer enough customization ​options for their orders, such as the ability to ​add extra shots of espresso or make ​modifications to drinks.

Negative

Literature + Interview

28/04/2023

The payment processing in the app, including ​declined transactions or errors when entering ​payment information.

Negative

Interview

28/04/2023

App crashes

Negative

Literature review

27/04/2023

Take time to swipe the QR code


Interview

29/04/2023





Why are people unhappy with the app?




Users may experience technical issues such as ​app crashes, slow performance, which can be ​frustrating and make it difficult to use the app ​effectively

Negative



The visual, too much is going on.

Negative

Interview

29/04/2023

The subscription feautre doesn't show well ​enough what I can get with each different tier

Negative

Interview


The subscription feature work like a coupon, ​which is confusing

Negative



Way too many pop-ups when entering the app

Negative







How will the app meet user needs and goals?




Offering customization options for menu items, ​such as ingredient additions or removals, size ​selection, and extra syrup options, is appreciated ​by users.

Positiv

Interview + Literature ​review

28/04/2023

Users expect a hassle-free payment experience ​when using the app. The app can integrate with ​various payment systems, including Apple Pay ​and Vipps

Positiv

Inteview + Literature ​review

28/04/2023

Users want to know the status of their orders in ​real-time. The app can provide updates on the ​estimated wait time, order preparation status, ​and delivery status to keep users informed and ​reduce wait times.

Positiv

Interview + Literature ​review + Observation

28/04/2023, ​29/04/2023

Giving users the opportunity to share their ​experience and provide feedback is greatly ​appreciated. By allowing users to easily share ​their thoughts on their orders and overall ​experience through the app, it becomes simpler ​to identify and address any issues that may arise.

Positiv

Literature + Interview

29/04/2023

Participant Interview

Speech Bubble

I always got error messages and I ended up having to get my partner to gift the subscription for me.

Speech bubble

I had a lot of trouble actually purchasing the subscription I wanted

Speech Bubble SVG

I think the subscription feature can be a lot clearer of what you actually get with each tier

Speech Bubble Illustration

I like the idea of the subscription feature for people like myself who want coffee to be a part of their daily routine.

Simple Vector Speech Bubble

Have some issues with the order status not updating in real-time in the morning.

10

Coffee Bean Sketch

personas

Organic Abstract Shape

Define

"I don't have time to wait in long lines, but I still want my coffee fix."

Biography

Anna is 26 years old and works as a executive in marketing at a software company in Oslo. She works hard and is constantly moving. She likes coffee and enjoys exploring the city's various coffee shops.

Motivations

Anna is driven by the desire to be more productive and save time. In every area of her life, she places a high importance on efficiency and ease.

Goals

Anna's main objective is to quickly and simply get a cup of coffee from her preferred coffee shop. She wants an app to keep track of her preferences and offer personalized suggestions.

Frustrations

When Anna has to wait in line for a long time to order her coffee or when her order is wrong, she becomes irritated. Additionally, she finds it annoying when the app is sluggish or challenging to use, which can add unneeded stress to her already hectic day.

Behavioural patterns

Anna is a very active individual who is constantly moving. When ordering her coffee, she favors efficiency and convenience. She frequently uses mobile apps and loves to place orders using her smartphone.

Anna Hansen

Medium button

Marketing Manager

Personality

  • Organized
  • Efficient
  • Detail-oriented
  • Values quality

11

Mark Eriksen

"Coffee fuels my study sessions, and I need it fast."

Organic Abstract Shape

Student

Biography

Mark is a 22-year-old university student pursuing a degree in computer science. He is known among his peers as a dedicated and focused student who spends long hours studying at coffee shops. He enjoys the ambiance and the buzz of activity around him while he works on his assignments and projects.

Motivations

Mark is motivated to find a coffee ordering app that caters specifically to students like him. He wants an app that provides fast and convenient ordering options, along with exclusive student discounts. He seeks a seamless and hassle-free experience that saves him time and money.

Personality

  • Modern
  • Quick
  • Analytical
  • Motivated
Coffee Bean Sketch

Define

Goals

Mark's primary goal is to have a smooth and efficient coffee ordering experience that aligns with his busy student life. He wants an app that offers student coupons, loyalty rewards, and personalized recommendations based on his preferences. His ultimate goal is to have a reliable and student-friendly coffee ordering app that enhances his study sessions.

Frustrations

Mark gets frustrated when he has to wait in long lines to order his coffee, especially when he has limited time before his study session. He also feels disappointed when coffee shops do not offer any student-specific discounts or promotions.

Behavioural patterns

Mark has a regular routine of visiting coffee shops before each study session. He prefers to order his coffee quickly and efficiently, as time is precious to him. He looks for coffee shops that offer student-friendly features and discounts, as he is always on a tight budget. Mark is tech-savvy and prefers using mobile apps to place his orders and make payments.

12

personas

User Scenarios Icon

User Scenarios

Define

Blank Bubble Speech

Anna, a busy marketing manager, enjoys coffee and visiting several coffee shops throughout the city. She needs her daily coffee fix to stay motivated because she is constantly on the go. She made the time-saving decision one morning to get her coffee from Espresso House using their app.

Blank Bubble Speech

On the app, Anna quickly found her chosen drink, a vanilla latte, and placed her order. She was disappointed to see that there was no way to increase the amount of vanilla syrup in her drink. She was upset that the app didn't have a feature for personalizing orders because she enjoys her coffee with an extra shot of vanilla.

Blank Bubble Speech


Anna still went ahead and placed her order and paid for it via the app. When her order was ready for pickup, the app notified her. When she arrived at the Espresso House, she noticed that the app had indicated that her order was complete. However, when she arrived, she was informed that her drink had not yet been prepared and that she would need to wait for a few minutes.


Blank Bubble Speech

Anna felt frustrated that despite the app indicating that her order was ready, she had to wait because she was on a strict time constraint. She wished the app featured real-time updates so she could see how her order was actually progressing.

Blank Bubble Speech

When Anna finally got her drink, it was as good as always. She was somewhat irritated by the app's problems, which added additional stress to her already hectic day. Despite this, she valued the app's simplicity and would still use it in the future.

13

Orange Blur Circle Illustration

Problem Statement

As a young working professional, I often like to grab a quick cup of coffee on my way to work. However, sometimes I'm unable to order a personalized drink or the estimated wait time isn't accurate, which can be frustrating in the morning.



Define

3d Telescope
Drop Shadow
3D Neomorphic Light Rounded Rectangle Debossed

POV

User who is frequently on-the-go needs an app that is easy to navigate and quick to use because they value convenience and efficiency in their daily routine.

14

"I don't have time to wait in long lines, but I still want my coffee fix

I need my coffee to be efficient and convenient.

I want a way to personalize my order and keep track of my preferences."

Driven by the desire to be more productive and save time.

Places high importance on efficiency and ease in every area of her life.

Becomes irritated when waiting in line for a long time or when her order is wrong.

Finds it annoying when the app is sluggish or challenging to use.

Define

What They Do

Person Talking Icon
Hand Holding Mobile Phone

What They Say

Empathy map

Think Icon

They Think and Feel

Desires and Needs

Hand click icon. Hand clicking. Vector illustration.

Pain Points

  • Waiting in long lines to order coffee.
  • Inability to customize orders using the app
  • App is slow or challenging to use.
  • Order is incorrect upon arrival, causing frustration and inconvenience.

Insights

  • Anna values her time and prioritizes efficiency in all aspects of her life.
  • She enjoys exploring new coffee flavors but prefers to do so in a convenient and efficient manner.
  • The ability to customize orders and receive personalized suggestions would enhance her experience and loyalty to the app.
  • The app must be fast, reliable, and easy to use to meet Anna's expectations.


Uses mobile apps to place orders using her smartphone.

Frequently visits various coffee shops in the city to explore new coffee flavors.

Favors efficiency and convenience when ordering her coffee.

Quick and simple way to order her preferred coffee.

App that allows for customization and personalization of orders.

Ability to keep track of preferences and receive personalized suggestions.

Finds it annoying when the app is sluggish or challenging to use.

15

Brainstorming

How might we reduce estimated order times on the Espresso House app to make the ordering process more efficient and convenient for customers?

In-app payment options

Simplified customization options

Streamline customizing options for orders

Add a "your order is delayed" button

Order stage notifications

Dedicated barista for app orders

Drawn Right Arrow

The focus here should primarily be the app itself and its clarity it displays to the users.

There needs to be streamlined customization options where the users feel they can express themselves, but not to the detriment of the baristas. Simple checkboxes with "more sugar, less sugar" etc. is key here. AI can be used here as well to better track the journey of each order and update the user.

How might we enable customers to personalize their orders through the Espresso House app, so they can create a customized coffee experience that meets their specific preferences and needs?

Comment section with word count restriction

Ai-tool to recognize popular customizations

Save their previous orders

10 orders for a free menu item

Order preferences is saved to account - not device

Favorite order section with further reccomendations

Drawn Right Arrow

Personalizing your orders is important to make the users feel at home and catered towards. Making it easy for the users to make these personalizations are equally important. There needs to be features that saves orders with all the unique information

How might we make the Espresso House app's payment system quicker, safer, and more user-friendly for customers?

Integrated third-party payment options

Store payment outside of subscriptions

Incentivize wallet funds

Save credit cards previously used

Drawn Right Arrow

Saved payment options and preferences

Vipps

Quicker, safer and more user-friendly can be hard to achieve at the same time.

Here it is important to think of usability vs. security. Using popular third party integrations like Vipps or Revolut can help with usability. Another angle can be to incentivise wallet funds as they are safely stored there once put in. We can do that by

giving users rewards for spending X amount over time, etc. Lastly, saving user info and payment options is key to achieving good UX.


16

Divergent and convergent thinking

The fist stage to create problem solving is discovery, therefore I used Divergent thinking with the mindmap technique to help with exploring and creating the ideas, followed by convergent thinking to analyse and narrow down the ideas, and then lastly I used divergent thinking again to come up with fresh perspectives and follow convergent thinking to narrow down the best solution to this problem

3D Light Bulb
Border Rectangle Frame

Divergent

  1. Discover

Brainstorming,

finding the problem

3D define
Border Rectangle Frame

Convergent

2. define

Narrowing down the potential cause of the problem

3D Search Icon
Border Rectangle Frame

Divergent

3. deduce

Back to divergent thinking to find the solution to the problem

find 3d
Border Rectangle Frame

Convergent

4. determind

Determine the solution will most effective eliminate the problem

17

Pencil Icon Style

Ideation

Sketch

18

Information Architecture

nformation architecture (IA) is a structure that improves the usability of a product. “The main purpose of information architecture is to focus on the organisation and structure of a website’s content, which allows the user to navigate the content quickly and seamlessly, without frustration” (Noroff, School of technology and digital media, n.d.b). Unstructured overload of content on a website can cause frustrations and irritations for users when interacting with the product. Information architecture aims to organise the information on the website in a meaningful way for the users, taking account for their mental models. The goal for the IA is that information is findable for the users, easy to navigate and that users’ needs to pay as little attention as possible when aiming to reach their needs and goals.

Ideation

19

User flow

Ideation

“User flows focus on what the user’s needs and goals are and figure out the best possible way to complete a task effortlessly and deliver a seamless experience with no frustration” (Noroff, School of technology and digital media, n.d.b). Creating a user flow will portray how a user navigates through products, websites and applications. The user flow illustrates the path a user takes in interacting with the application, in which can be linear or non-linear with multiple branches, it depicts the decision points and shows how a user may enter or exit the flow. User flows improves the usability of the application.


20

Task flow

The task flow focuses on the specific task at hand that the users perform. It focuses on how the users navigate through the application and in distinction to user flows, it only has one linear path without multiple branches. Task flows illustrates “the high-level steps a user will take to get to a specific goal or endpoint” (Noroff, School of technology and digital media, n.d.b). Task flows are a simpler version of the user flows and are assumed to be completed similarly by all the users for a specific task.

Ideation

21

Lo-fi designs

Ideation

20

Usability testing plan

Test

Objective


The objective of this usability testing is to evaluate the redesigned Espresso House Order app's user interface, functionality, and overall user experience. The feedback and insights gained from this testing will help identify areas for improvement and ensure that the app meets the needs and expectations of its users.

Methodology

Type of study: Qualitative remote unmoderated

Software: Discord, messenger

Observer table: Task completion, Error per task, time taken, error detail, Assistance required detail.


Participant Profile


The target participant for this usability testing is a regular coffee consumer who frequently uses coffee ordering apps on their mobile devices. They should have a basic understanding of how to navigate mobile apps and have some familiarity with the coffee ordering process.

Participant

Age

Frequency buying

Isaac

25

Once a week

Kit

24

Twice a month

Tuli

30

Twice a month

Huyana

27

Once a month

21

Screening question


1. Have you ever used the Espresso House Order app before?

- This question helps determine if the participant has prior experience with the app and can provide valuable insights based on their familiarity with its functionalities.

2. How often do you use coffee ordering apps on your mobile device?

- This question helps identify participants who frequently use coffee ordering apps and are more likely to provide relevant feedback based on their usage patterns.

3. Are you comfortable using mobile apps and navigating through different screens?

- This question assesses the participant's comfort level and proficiency in using mobile apps, ensuring they can effectively complete the tasks during the usability testing.

4. Can you briefly describe your typical coffee ordering process and what factors are important to you when using a coffee ordering app?

- This question allows participants to share their preferences and expectations, providing insights into their specific needs and considerations during the usability testing.

5. Are you available and willing to participate in a usability testing session lasting approximately [duration] at a mutually agreed-upon time?

- This question ensures that the participant has the time and availability to commit to the usability testing session, minimizing scheduling conflicts and ensuring their active participation.

Test

Procedure


  1. Greet the participant and provide a brief overview of the usability testing process.
  2. Obtain informed consent from the participant.
  3. Pre-test Interview:
    • Ask the participant about their previous experience with coffee ordering apps.
    • Inquire about their expectations and preferences when using such apps.
  4. Introduce the test scenario and explain the tasks to be completed.
  5. Ask the participant to think aloud while performing the tasks and encourage them to express their thoughts, opinions, and any difficulties encountered.
  6. Observe the participant's interactions, paying attention to their navigation, actions, and expressions.
  7. Take notes on the participant's feedback, observations, and any issues identified.
  8. After the participant completes the tasks, ask follow-up questions to gather additional insights and clarify any points of confusion.
  9. Conduct a post-test interview to gather the participant's overall impressions, suggestions, and areas of improvement.
  10. Thank the participant for their participation and provide any compensation


22

Usability study on low fidelity wireframe

Test

After I made the the first low fidelity wireframe I started the first usability test with 2 participants. The participants were people who often used the Espresso House app. The goal was to find potential pain point and improvements to make.

Mockup Realistic Computer Monitor Device with Transparent Screen. Vector Isolated Technology Illustration.

23

Research finding & interaction

Finding




Solution




Having easy sign on options ís great, but maybe there should be several options for those who do not have a phone number who still want to order.

Add more sign-on options like e-mail, username, etc.

The coupon section might be a bit too large, but i understand that you want to show the drinks off.

Consider making the coupon section smaller in size


The large buttons are easy to clearly press. Prefer if the milk selection pop-up was a bit smaller and didnt cover the name and info of the drink.


Lessen the size of the pop-up to show the name and info of the drink while selecting.


24

Finding




Solution




I would like the default pick-up time to be "right now" instead of the choose.

There is no obvious button to proceed to pay for the order.

Maybe there should be a final message or pop-up that says that your drink is ready or picked up. Like a confirmaton message.

the layout of the 3x3 boxes might be a bit boring.


Add a "pay" button

Set the default value of the pick-up time to right now


Add confirmation message

Log out button and other smaller functioning buttons can be smaller and make room for more important ones like Send gift or my orders. They do not even have to be buttons, just text fields.

25

Mid-fidelity wireframe

After the low fidelity usability testing was completed

and all the feedback was gathered, I made a mid-fidelity wireframe with that very feedback in mind.

Hand Holding Smartphone

26

iphone 14 pro mockup
iphone 14 pro mockup
iphone 14 pro mockup
iphone 14 pro mockup
iphone 14 pro mockup
iphone 14 pro mockup
iphone 14 pro mockup

27

28

High-fidelity wireframe + prototype

After the first testing session there were many improvements to be made. I took those pointers and directed them into the high fidelity wireframe.

Hand Holding Smartphone

29

Testing prototype

I ran the second round of usability testing, this time with the high fidelity wireframe I made. This was done to find more improvements which might be smaller and more detailed.

Test

Test Scenario

The participant will be asked to complete the following scenario:


Scenario: You are in a rush in the morning and want to order your coffee from Espresso House app. Please walk us through the process of placing an order, customizing your drink preferences, and making a payment.

Task


  1. Customize the drink preferences and add any extra items to your order (e.g., cake, snacks).
  2. Go to the payment page and choose the payment method you prefer.
  3. Complete the order and check the confirmation details of your order.
  4. Provide feedback on the overall ordering experience, ease of use, and any difficulties encountered.


30

Metrics

The metrics of a testing phase is equally important to the test itself. Deciding what to measure is key in order to gain quality insights for your app and future development. I will be measuring:


  1. Time of completion to see if the users are spending too much time to complete a task in order to see if there are steps that need to be clearer and simpler.
  2. Success rate in order to see if the path through to the end goal is easily understood.
  3. Critical error in order to see if there are major obstacles that need to be looked at.
  4. Non-critical error in order to see if there are smaller obstacles and pain-points that make the path to completion inconsistent.
  5. Subjective measures in order to gain personal insight of the satisfaction level of the tasks and the experience of performing it in general. For this project I will be measuring the satisfaction of each task from a scale of 1-10.

31

32

Improvements after user testing

After the testing , one of the large changes I made

was additions to the subscription model. I added a

student version to cater to younger audiences, together with a

carousel like display for the different subscription.

When it came to accessibility, it was highly important that

the app could be properly used by people with disabilities.

I decided to add a compatability mode which you can enable

and decide which specific feature you want added. The features are based on the WCAG most common accessibility mistakes.

35

Welcome screen with common options for log-in and sign-up with mobile and Google.

There are also options for logging in with e-mail and password for those who do not wish to use their phone number.

Signing up should be clear and simple to execute. Here the user is again reminded that they can use other sign-up methods.

2-step-verification is crucial on modern apps due to the app containing payment information and general personal info.

Greeting screen to inform the user that they have successfully made an account on the app.

36

The home screen contains all the immediate information a user would need to start their order process. I feel it is important to make the user feel that the app is personalized to their preferences hence the coupons, subscriptions, favourite order, etc. is given much room.

When beginning to order you are greeted with selecting which coffee shop. Here I added some more information about each location so users can make a more informed decision.

The favourite drink screen is given more room here to clearly display the different orders a users commonly gets. Here it is important to display all the information in case the user made a custom order for the drinks.

37

On the top of the screen are sections a user would use to make the quickest decision in case they already know what they want. Each type of drink (cold, warm, etc.) is given more room in each section to give way for larger pictures.

When a user wants to see all of the drink in a section in a more clear way they can press "see all". Here each drink is given more room in a vertical grid.

Upon choosing a drink the picture of the item is largely displayed so users can indeed see if they chose the correct item. Here the users are given choices of customization with clear icons for each category of customizing.

38

The order summarising screen is the most busy of the bunch. Here it is important to display all the key information the users need to see, while still making it understandable. I decided to also show viable coupons for their order in case users did not see the coupon beforehand.

The payment screen is given more room here to show each of the payment methods clearly to the user. To ease the future use of customers I added a "set as default" button which would reduce the number of "clicks" for a user the next time they order.

One important aspect of the app is to display the journey of each order to the user. Users need to properly know when their order is ready, and showing each step makes for good communication.

Profile screens in apps are quite boilerplate, and it should not be a place for large variance and experimentation. The screen is divided between personal actions and the settings section. The settings are given no graphics to enhance the display of the personal actions.

For users with any type of disability, a combatability mode is here to help. Users can choose which assistances they want in the drop-down menu. This "mode" has been trendy in modern video-games in the last 5 years and has had great success with making platforms more accessible.

39

User control and freedom

The user should have a form of agency in the process which is done by giving them the choice to go back or cancel the process

Search documentation

This have a lot of documentation so to have search bar on the top is the best way to help user have their needs

Visibility of system status

I want to keep the user inform with a clean and simple status bar that show how many step their are in the process

Recognizable icon

Recognizable icon

40

Notifications

Items

Favourite icon

See more

41

Hamburger menu

Search bar

Advertisement

Categories

Navigation bar

Accessibility


When making a mobile app, there are several accessibility features that are important to consider to ensure that people with disabilities can use and benefit from the app. Here are some of the key features i adding to the settings:

Screen Reader Compatibility: This feature ensures that the app is compatible with screen readers, allowing users with visual impairments to access the app's content.

Voice Navigation: This feature allows users to navigate through the app using voice commands, which can be particularly helpful for users who have difficulty using touchscreens or physical buttons.

High Contrast Mode: This feature increases the contrast between text and background, making it easier for people with visual impairments to read.

Adjustable Text Size: This feature allows users to increase or decrease the font size of the app's text, making it easier to read for those with visual impairments.

42

44

Research Search Find Reference Icon

References

Uxplanet (2023) Starbucks India app - Reimagined. A UI/UX Case Study. Available at: https://uxplanet.org/starbucks-india-app-reimagined-a-ui-ux-case-study-d096dec7ac1e, accessed 25.05.2023.