Tropical smoothie cafe mobile order kiosk
Software Used:
Figma
Duration:
15 Weeks, January - April 2023
Software Used:
Figma
Duration:
15 Weeks, January - April 2023
USER EXPERIENCE RESEARCH
A large portion of the 15 weeks of this project was devoted to research and planning. The first stage of this was a Heuristic Evaluation, where I looked at the mobile order kiosk for Crumbl Cookies and evaluated it's strengths and weaknesses.
USER EXPERIENCE RESEARCH
A large portion of the 15 weeks of this project was devoted to research and planning. The first stage of this was a Heuristic Evaluation, where I looked at the mobile order kiosk for Crumbl Cookies and evaluated it's strengths and weaknesses.
USER FLOW
Before getting into the design, I created a full user flow shows all the possible interactions a user can have with this kiosk. It includes error messages and limits on properties. This flow can be seen broken down on pages 13-16 of the process document.
USER FLOW
Before getting into the design, I created a full user flow shows all the possible interactions a user can have with this kiosk. It includes error messages and limits on properties. This flow can be seen broken down on pages 13-16 of the process document.
PRODUCT REQUIREMENTS
For the product requirements documentation, I considered many hardware considerations such as which tablet would be used, where it would be located in the store, and what software it would be displayed on. I decided it would be on an iPad Square Stand, and I also considered things such as how the information would be broken down, how the user could access nutritional information, the order information would be displayed, and how features could be filtered.
PRODUCT REQUIREMENTS
For the product requirements documentation, I considered many hardware considerations such as which tablet would be used, where it would be located in the store, and what software it would be displayed on. I decided it would be on an iPad Square Stand, and I also considered things such as how the information would be broken down, how the user could access nutritional information, the order information would be displayed, and how features could be filtered.
LOFI WIREFRAMES
The lo-fi wireframes provide a basic layout of where basic elements of the screen would fall. It also showed a basic demonstration of the flow.
LOFI WIREFRAMES
The lo-fi wireframes provide a basic layout of where basic elements of the screen would fall. It also showed a basic demonstration of the flow.
HIFI WIREFRAMES
The hi-fi wireframes provide a much more detailed layout. It includes error messages and much more text samples. In pages 36-50 process document, you can see the wireframes including comments on what each box represents.
HIFI WIREFRAMES
The hi-fi wireframes provide a much more detailed layout. It includes error messages and much more text samples. In pages 36-50 process document, you can see the wireframes including comments on what each box represents.
STYLE GUIDE
The style guide shows treatment of type, cards, buttons, and color palettes. The full style guide with full descriptions can be found on pages 52-66 of the process document.
STYLE GUIDE
The style guide shows treatment of type, cards, buttons, and color palettes. The full style guide with full descriptions can be found on pages 52-66 of the process document.
VISUAL COMPS
The final visual comps show the style executed. It shows the color palette and cards and how they can be interacted with.
TLDR
Download my process document or click through below!
FINAL PROTOTYPE
This prototype demonstrates all the steps a user will interact with in the flow. It shows error messages, user inputs, and customization screens.
I would definitely consider this project to be one of the most educational projects of my career thus far. It really taught me so much about the user experience research process, and really drilled in the idea of the process to get to the final result being equally as important as the final result.
AnimationsV1 from Kayla Krurnowski on Vimeo.
TAKEAWAYS
I would definitely consider this project to be one of the most educational projects of my career thus far. It really taught me so much about the user experience research process, and really drilled in the idea of the process to get to the final result being equally as important as the final result.
what comes next?
The next step of this project I hope to complete is to make this fully operational using Figma variables! Stay tuned!
TLDR
Download my process document or click through below!
Tropical smoothie cafe kiosk