Module 3 Activity Research

Weekly Activity Template

Marley Luna

Project 3

Module 3

Final Project: Testing & Prototyping

Workshop 1

This is the week 10 bodystormming activity that we completed, our task was to make a bank app flow. This is an image of me working on one of the parts of the app. To put it right now, this project assisted me and my group member a good bit with understanding the flow and direction of our project, helping us move forward more than the last project.

This is the first screen, for downloading and running the app.

This is the second screen, where the user opens the app and logs into their bank account.

This is the next screen, here the user is viewing their account and preparing to transfer their funds.

This is the user transferring their funds to another account.

Workshop 2

Activity 1: My Research

These are the high-fidelity wireframes designed during this project for the kiosk interfaces, with some of the customer-side screen, as well as some of the kitchen-side screens. This is the first screen, it contains the Welcome screen on the customers side, as well as the dine options screen. This welcomes the user and gives them options on where to go, guiding them through the first parts of the journey. These screens didn't differ too much from the last project, but they are more polished and look visually better overall, providing a more complete look.

This is the personalization screen, this is where the idea of our concept kicks in more, here the user would be able to pick from options if they want to fill in any allergies or specific preferences they might have. Images and labels were added for the third project, adding real potential examples for user choices, as well as providing once again, a more complete look and feel. After looking into some of the allergies and diets people might have going into a restaurant establishment, I added some choices of the most common options, bringing a better understanding to what our design is and how effective it could potentially be.

These are the menu screens, one of them is checked off and one of them isn't. This screen is the main ordering part of the process, where the user chooses their food and potentially customizes their order further, as other restaurants tend to do. The un-checked screen shows the screen with warning symbols for unsafe options, food that the user cannot consume, where the checked screen has the filter checked off to remove all unsafe options. This allows to user to ignore any of the unsafe options and safely go on with their process.

This is the orders and new order received screen from the kitchen-side kiosk. Here the kitchen would receive the customers order and continue the process, it contains previous orders with the newest orders popping up on screen.

This is the order details screen, where the staff needs to review the order of the customer to know what they need to make, as well as to acknowledge any specific allergies or preferences the customer may have. The staff cannot move on with the order until they check off and acknowledge the order for safety purposes, as the customer did choose the safe option when ordering, but this step is extremely important to ensure everything goes safe and smoothly. To round out this activity, I added more visual elements to the screens, I also added more screens into the entire wireframe, to add realism and to make the flow more complete, allowing our concept to really be shown in terms of its potential.

Activity 2: My Research

For this activity, I put the new high-fidelity wireframes into ProtoPie to create an improved interactive prototype from the last project, I made things much smoother here, and feel more like a real kiosk system that interacts with another end, meaning customer interacting with kitchen through the order process. This allows for a better understanding of the flow and how the user would interact with the kiosk system. This is the welcome screen, where the user would start their journey. From here they would be able to proceed to the next steps.

This is the personalization screen, where the user would be able to choose any allergies or preferences they might have, allowing the kiosk to filter out any unsafe options for the user. This is a key part of our concept, allowing users to have a more personalized experience when ordering food at a restaurant, making it safer and more efficient. With this specific screen, the buttons that are usable are the back and continue button, which leads to the confirm screen, the interactions definitely could have been pushed further here, but the visual aspect and the user being able to go forward and back still gives a good idea of how things will work if the idea were to be fully fledged out.

This is the menu screen, where the user would choose their food and customize their order further if needed. Here the user can see the warning symbols for unsafe options, as well as the filter button to remove those unsafe options from the menu. The interactions on this screen allow the user to go back to the previous screen, proceed to the next screen, as well as select a food item to add to their order, which leads to a customize screen to then complete and add to their cart. This screen has more interactions than the previous screens, allowing for a better understanding of how the user would interact with the kiosk system. Also being a drastic improvement from the last project, as where those screens were empty and less interactive, this really pushed the project into a more complete prototype, and feel more like a real system in some areas.

This is the receive orders screen, here the staff would be able to click on orders, though they can only click on the newest one for the sake of the prototype and providing a better understanding of the flow, rather than creating a whole database of orders. When the customer sends their order to the kitchen, the pop up for a new order received would appear and have the button for the staff to continue that order, confirming the customers order and moving forward both processes. So in ProtoPie, the customer clicking the send order button would actually send a request and the pop up/screen would appear, allowing for a real interaction between the two kiosks for the project 3 prototype.

This is the order details screen, where the staff would review the customers order and check off the personalization boxes to ensure they are aware of any allergies or preferences the customer may have to begin the order, here in ProtoPie the boxes are actually clickable to show how it would work with the real thing. This is a key part of our concept, as it ensures safety and accuracy in the order process. The interactions on this screen allow the staff to go back to the previous screen or confirm the order and move forward. This screen, like the receive orders screen, has more interactions than the previous screens, allowing for a better understanding of how the staff would interact with the kiosk system and how important the customers preferences are, allowing the process to move forward. Overall, this ProtoPie prototype is a significant improvement from the last project, providing a more complete and interactive experience that better showcases our concept and how it might work with smoother digital interactions added in.

Additional Research or Workshops

Project 2

Project 3 Final Prototype

This is the final prototype for project 3. It includes all the improvements and changes made during the activities and workshops, resulting in a more polished and complete prototype that effectively showcases our concept much better than before. On the sides of the laptop are the physical kiosks which are a drastic improvement compared to the last cardboard kiosks built from the last project, where those ones were more stationary and less functional, these ones are move refined and polished, with the tactile buttons implemented which work with the kiosk screens. The kiosk screens are also shown on the laptop screen with the customer-side and the kitchen-side. The Makey-Makey boards are also connected to the laptop and are implemented within the design of the kiosks themselves.