FIU UX Lab - Order Form
Oct 2021
The assignment description was as follows:
The FIU Marching Band (Links to an external site.) is planning a fundraiser to help offset their costs to travel to the away football games next semester. After the pandemic has affected so many in-person events, the marching band wants to sell limited edition Panther Pride t-shirts. You have been kindly asked to design the screen for the order form application that will be used to take an order for a single t-shirt. This will be a mobile application that will be used only by a band member who will process each of the orders. (For simplicity sake, assume that only one shirt can be ordered at a time.)
Tasks/Requirements
Use a free version Webflow to design your application (other web tools for design are also permitted). Be sure to save your project as a pdf or image file!
- Data that must be collected by the application on the order screen:
- Customer name
- Customer address, city, state, zip
- Customer phone number
- Customer email address
- Shirt color (choices are white, blue, gold)
- Shirt type (choices are short sleeve, long sleeve, and sleeveless muscle shirt)
- Shirt size (choices are small, medium, large, and extra large)
- Delivery option (pick up or ship to customer)
- Express shipping option
- Design the form for the application program that will meet the requirements described above, applying what you have learned so far in this course about design and usability.
- Use the toolbox controls from WebFlow.
- Include visual elements available at:
- Use color where appropriate to make the screen attractive.
- The form must have a field to display the total order cost.
- The form must provide buttons to place the order, to clear the form, and to exit the application.
REMINDER: You are not writing any programming code for this – you are only designing the screen prototype.
Deliverable
When you have completed this project, save your work as pdf or image files, and submit it via Canvas.
View Project Live