HvA: Responsive Multi Device Design
Assignment - individual: Think of and design a multi-device experience for a specific activity. Consider especially the user goals that are important before, during, and after this activity, and which device would be most suitable in each stage.
In Valorant, there's a store with 4 weapons (skins) that refreshes every day, so you have to be lucky to find the skin you want in the store each day. If you're on vacation and don't have your computer with you, you can't check your store or make any purchases. I want to design an app for Valorant where you can quickly check the store and make purchases, so the next time you play games, you can use your new skin.
Valorant players
The user wants to be able to view their store while they are on their phone and make purchases.
Before: Playing Valorant at home on their computer.
During: On vacation, checking the Valorant store on their phone and purchasing a skin.
After: Back home, playing Valorant on their computer again with their new skin.
Phone and computer/laptop
My Valorant app (store) is consistent because the basic experience on both phone and PC/laptop is the same. The flow, structure, and core functions are identical. The main function of my app is primarily the “store,” so you cannot play the game like on PC (that's not consistent).
My app also has Continuous Design, with a sequenced activities flow. You buy something in the app and continue to use it on the PC/laptop.
The Valorant store app also features Complementary Design, as the basic experience takes place on your PC/laptop (where you play the game), but in the app, you can also buy skins to use later on your PC/laptop.
In the following link, you can see all the screens that I have designed, including the monitor screens after the purchase is completed.
https://xd.adobe.com/view/44de0c30-63cb-40de-8024-ff63d40c5fd5-118d/To see the full screenflow you can download the following PDF.
Screenflow-Valorant app