Tovala Meal Plan Magnet and UI/UX Prototype

Magnet Concept: Packaging label with QR Code that leads you to apple wallet coupon.

Scenario:

Jennifer goes to Costco and decides to buy and take home her new Tovala oven. Once she gets home she quickly opens it and throws the box away, however she notices the label wrapped around the Tovala open stopping her from opening it. She looks at it close up and notices the qr code at the front. She takes a picture of it so she can look at it further later but also scans it and decides to add this coupon to her apple wallet as she can’t fully go through the meal prep checkout flow right now but she does want to do it eventually when she finished the chores she has for the day. After adding it to apple wallet she also sets the label aside to read it later and continues her tasks for the day. She finally sits down after a few hours and sees that apple wallet has sent her a notification about her $65 meal plan offer she got with her oven. She decides to follow through right now and set it up, finishing the flow by opening it in the app after downloading it. If she doesn’t add the coupon to the apple wallet she can just use the code “65MEALDEAL” when finishing up the checkout flow, this code is found printed on the label and also written on the overlay screen.

Packaging element to the project:

Prototype URL:

https://www.figma.com/proto/bEdoJfJz0FIy50n1jncVF9/Alana-Palomo-Apple-Wallet-Tovala-Project?node-id=526-532&node-type=frame&t=9ipOiJ0eyk1vpngh-1&scaling=scale-down&content-scaling=fixed&page-id=0%3A1&starting-point-node-id=526%3A532&show-proto-sidebar=1

Tovala URL:

https://www.figma.com/design/bEdoJfJz0FIy50n1jncVF9/Alana-Palomo-Apple-Wallet-Tovala-Project?node-id=0-1&t=rDk0CLcd0PUmg1XH-1

How to Use the Prototype:

1. Start on the scan QR code screen.
2. Tap QR code and press on linked tab that opens.
3. Tap Coupon that pops up to redeem.
4. Tap again to add to apple wallet, app or use in website.
5. If chosen “Open in web”
6. Tap on coupon and then follow regular check out / sign-up flow.
7. Tap to add Coupon information to get discount in the payment screen. 
8. Click right arrow to return to first scan qr code screen.
9. Follow steps 1-4 and tap “Add to apple wallet” 
10. Tap “add”.
11. Tap on coupon to open.
12. Tap on three dots for more details.
13. Tap on “pass details” for additional info and links.
14. From here you can go to view in website, see details, deactivate notifications and more but just press Left arrow on keyboard (opens turned off screen).
15. Tap on screen for notification to pop up.
16. Tap notification.
17. Tap open in app.
18. Tap offload button.
19. Tap “Open” app button.
20. Follow regular check out / sign-up flow.