COFFEE CORNER: HIGH LEVEL PROTOTYPING (HLP)
INTRODUCTION
1.1 When and where the testing took place?
Testing prototypes is an inherent part of finalizing designs. Nobody wants to wonder why users are not utilizing an app the way it should be utilized or why they can’t seem to complete a purchase on our website. And nobody wants to rework something that’s already been shipped. Conducting tests as early as the prototyping stage can help us avoid these unfortunate scenarios.
After developing our system prototype, we we’ll testing our prototype on 17th January,2021 in remotely using Zoom application.
1.2 What equipment used?
Prototyping tools allow designers and clients to collaborate better while being in the same context rather than having conflicting perspectives. The clients get a visual overview of what is actually going to be made. It helps teams to build understanding, to explore options and barriers that only become visible when you build and test something. At the end of the day, prototyping tools become a platform for full creativity and experimentation for the product team.
Fort developing the high-fidelity prototype we were using Adobe XD. It’s is a powerful UI/UX design and prototyping tool for apps, built by the world’s leader in creative technologies. With XD, we can quickly go from wireframes and mockups to static UI designs to interactive prototypes that simulate a user experience — using just one tool for our whole design process. Streamline our design process by wiring together artboards with a single click to define user flows, add transitions and animations, and define micro-interactions for all types of user inputs like tap, drag, voice commands, keyboard shortcuts, and more. we can also prototype with UI elements from your design system such as:
- High-fidelity interactions
- Integration with the other Adobe products you already use
- Real-time viewing, commenting, and sharing capabilities
1.4 How many participants involved?
Since user experience is a powerful metric for branding, we often use prototyping tools to show our targeted user different iterations of the product mockup that they requested. It allows our UI/UX designers to produce a ‘Proof of Concept’ which could be a key factor in the commercial relationship between developers and their clients. To successfully conducting this testing part total five (5) participants were involved.
1.5 What tasks are tested?
TASK 1: USE AN ONLINE COFFEE ORDERING SYSTEM
TASK 2: ORDERING VARIETY OF COFFEE FROM DIFFERENT SHOPS
TASK 3: TRACKING THE ORDER
2.0 PROTOTYPE
TASK 1:USE AN ONLINE COFFEE ORDERING SYSTEM
TASK 2: ORDERING VARIETY OF COFFEE FROM DIFFERENT SHOPS
TASK 3: Tracking the order
TASK 4: PAYMENT FLEXIBILITY
FULL PROTOTYPE
3.0 BRIEFING
Purpose:
The purpose of this note is to test of our application “Coffee Corner”. As it is an application, we want some of the tester who will test our application by completing our main task.
A very good morning/afternoon/evening, Mr/Mrs ABC, I am representative of my group from course SECV 2113 Human Computer Interaction section 04, we are designing a mobile application called Coffee Corner. This application is actually based on Food ordering system.
We are researching our application to see how much it is useful. Can I have 10 minutes of yours to become a tester of our prototype.
I will give you a short briefing about our application then we will start the testing. So, our application has three main tasks.
The first task is USE AN ONLINE COFFEE ORDERING SYSTEM where after installing the application you need to sign up to our application. In sign up function you have to provide basic info and your address then the sign up will be completed. The second task is ORDERING VARIETY OF COFFEE FROM DIFFERENT SHOPS. You can order variety types of coffee from different shops. The final task is TRACKING THE ORDER. After confirming your order, you can track the delivery man where it will show the real time location and time need to deliver the Coffee.
I will give you three tasks to complete by using the mobile phone. So, I already told you what to do and make sure that you are understanding while doing the task. If you don’t understand the what should you do next, you can say terminate. If you don’t have any question, then we can start testing the application prototype.
Interview:
- What was easy?
- What was difficult?
- What would you suggest to improve the interaction flow?
- Would you use/not use the system in real life? Please give a brief reason.
PERSONAS AND SCENARIOS:
User 1:
User 2:
User 3:
.
User’s Testing:
User 1: University Staff:
User 2: Job Holder:
User 3: University Student:
4.0 OBSERVATIONS
While doing the user testing for 3 users, we observed that all users have followed the scenario tasks that we were given. They can understand the tasks that we give them and do the user testing without confusing. They test the prototype and can continue the next steps of the tasks by themselves without our guide. However, some of them need to think about the functions of the design of the prototype. All of them feel that this “Coffee Corner” prototype is useful and user-friendly for them. For all the tasks carried out by users, most of the users feel easy to use this app but there are still some of the users think that there is some difficulty using this app. However, we also had to do the useability testing when proceeding with the users to find out the problems and categorized them. However, they still give some suggestions to us in improving the design and interaction of apps. We can see that all the users used the apps in relaxing and joyful ways and feel that this app can be used by them in real life.
User 1:
For task 1, the user tests the task easily without difficulty. During the task, the user notices double button for the user information, he was quite confused about it. However, the user suggests to remove on button. The user says that he liked the top button because it is a quick, simple and easy to get his own information. For task 2, the user also feels easy to do the task without confusion and without difficulty. The user suggests that the maps can have different languages such as Malay for her to find the nearby locations easier. For task 3, the user does the task in an easy way. The user said that, when pressing the “track” icon, he immediately went to the next page but there was no title that told him that the page had entered the page, making him confused too because it is very similar to other menus. The user says that he will use this app in real life because this app is easy to use and help him to order coffee online.
User 2:
For task 1, the user has some difficulty in testing and he feels a little bit confused at first but after he continues testing the task, he tests it without any problems. The user suggests that adjusting keywords according to the application, such as “Search a coffee item”. For task 2, the user does this task very easily and without any difficulty. He says that this task is already perfect and does not have any problems or suggestions for this task because finding different type of coffee is very convenient and useful for him. For task 3, the user says that it is the easiest task for this app. However, he suggested that the bottom navigation menus background color can be constant. He was quite happy to order different type of coffee on the same time.
User 3:
In doing task 1, the user tests the task easily without confusion and difficulty. However, he also suggests that the interface design of the task can be minimized and simplified for easier read and do the task. He says that the quantity information distracted him and he suggested to add the quantity increment and decrement button bottom of the quantity to make it easy to find. In doing task 2, the user also tests the task perfectly in an easy way and he does not have difficulty for this task. He also suggests that this task can be improved by adding the sounds for the direction for the route of the map. The user likes to use this task because the maps and recycling point location is very accurate. Next, for task 3, the user asked about the green, yellow and red icons have no explanation for each box, making him not aware of the use of these icons. That’s why he suggested to remove them or give an explanation for them.
.
Methodology:
Heuristic evaluation is a usability method for finding usability problems in user interface design so that it can be done as part of the iterative design process. For conducting a successfully heuristic evolution, we have separately gone through all the Goals and we evaluated the “Coffee Corner” app by Jakob Nielsen’s Ten Usability Heuristics. On the perspective of Jakob Nielsen, “Heuristic evaluation is a systematic inspection where a small set of evaluators examine the interface and judge its compliance with recognized usability principles, which are also called heuristics”.
As an evaluator, our team worked separately and tested our first, second and third targeted goals by the users in order to generate this study. We therefore defined a total of three goals commonly required by ” Coffee Corner”. And the debate centered largely on assessing the rankings of problem severity and the ease of fixing rankings.
| Heuristic | Severity Rating (1-low, 4-high) |
| 1. Visibility of system status. 2. Match between system and real world. 3. User control and freedom. 4. Consistency and standards. 5. Error prevention. 6. Recognition rather than recall. 7. Flexibility and efficiency of use. 8. Aesthetic and minimalist design. 9. Help users recognize, diagnose, recover from errors. 10. Help and documentation. | 1. Cosmetic issue – affects the appearance and should be fixed only if time permits. 2. Minor issue – hinders the user’s ability to navigate and should be fixed when possible. 3. Major issue – Frustrates or confuses users and requires repair as soon possible. 4. Catastrophic issue – prohibits users from performing their given task. |
We focus on the online coffee buying system and coffee delivery. The platform we make for mobile, the same design as the usual delivery but they we another feature in our app and it’s different.
Our goals are:
1 USE AN ONLINE COFFEE ORDERING APPLICATION (Initial Installation)
2 ORDERING VARIETY OF COFFEE FROM DIFFERENT SHOPS
3 TRACKING THE ORDER / DELIVERY THAT USERS PURCHASE
With all the above goals taken from the instructions given to us to evaluate our prototypes, my group evaluated and discussed the application that may need to be improved or changed based on our prototype to make it better.
5.0 RESULTS FROM USUABILITY TESTING
6.0 POSSIBLE SOLUTIONS
FINAL PROTOTYPE:
PROTOTYPE TESTING LINK:
https://xd.adobe.com/view/771167e2-454f-4167-9975-a7d6719c7e51-2242/?fullscreen
7.0 CONCLUSION
One of the proposed system benefits is that the system simplifies the task of taking orders and delivering food from the café since the users can access it fairly easily and have the choice of dine in or takeaway while the workers can access orders on their smartphone. Rechecking for orders has also been made easy. Reliability is important especially when we are just starting out because the first impression makes a very good foundation for the system to grow its audience. The project focuses on functionality which aims to give the users the most out of the system without them feeling left out by other competitors. Users should feel comfortable with the design and functions that the system provides and all the café management team understands how the system works without regularly referring to any kind of guidance or manuals. This streamlined the experience for both users and workers. From a business perspective, this analysis brought in a very reliable look on the project and how it is possible for the cafe to give their greenlight. Besides, using the application, they can use the delivery service, either pay in cash (COD) or also use online banking or credit / debit card payments. By using mobile application-based system for delivery service will make it easier for all the cafe’s management team to record and analyses the actual profit and loss of this service. From the customers’ side, this application can track the status and location of their order, whether their order is still in process or already on the way to be delivered and so on, this will make customers less anxiety to order coffee from “Coffee Corner”.
Let’s make something beautiful together.
THREE GENIX 