UI PROJECT (2021)
Nike Shoe App
SOFTWARE
Adobe XD
Adobe Photoshop
ROLE
UX Designer
I attended Adobe Max last year (2020), and I learned a lot about Adobe XD. The conference inspired me to continue my learning, so for months I did tutorial after tutorial to get myself more acquainted with the program. After some time, I felt confident enough to try a complex prototype pertaining to interactions and animation.
My Goal was to create a high fidelity prototype with a unique and eye-catching animation that would capture the user as well as entice them to play with the website. Target Audience are sneakerheads, collectors, aficionados for creativity in web design.
The challenges I faced were to research some of the most requested and sought after sneakers in the past 5 years and maintain their quality for the prototype. The sneakers chosen were the Nike Sacai Waffle & the Nike Off-White Blazers. I put my photoshop skills to work and use the lasso tool to cut out these shoes from their original images. Then I started to get to work on XD. Below is the prototype I created and high fidelity mockups.
I sent these designs to multiple colleagues and also strangers to see how they felt about the prototype to get a consensus for usability. To my surprise, I learned that it was half and half. Some understood the concept, and others didn't. Some felt that the animations were cool but they did not understand why they were necessary. Those people were not the biggest sneaker fans so they did not fully comprehend the visual appeal with the exclusivity of the product.
In conclusion, I learned that some designs can be hyper focused on a particular target audience. So much to the point where anyone outside of that target audience, won't understand the unique effort behind the design and the product. This design in particular, many sneaker brands express their aesthetic through a series of high aesthetic photography. While in the designs below, are shown with animation and interactions. I believe if we combine those 2 concepts, you can create something that will tie both ends together.
