Wirecademy: Ridgeline Project

My first attempt at Figma

Here is my wireframe! Please feel free to leave any reviews or suggestions on how I can improve. Thanks!

My starting wireframe was inspired by the Mountain Hardware product page design with the provided link in the design project. I sketched the design, then created the wireframe with Figma; with support of the Sanity Sketching Kit.

I love seeing everyone’s designs!

It’s a little messy, but this is my second draft of a wireframe for this jacket. I added some special features (which I know are difficult, but possible, to implement) to create the feeling you are buying a true luxury item.

I took inspiration from Apple, whose website doesn’t even feel like a store, more like an in depth product demonstration with the price as an afterthought. I didn’t’ go quite as far given this is for a clothing brand, so I put the price below the item images.

On either side of the product cutout view, which revolves using the buttons below, there are images of models in outdoor environments (helping the viewer picture themselves having positive experiences in the jacket). There is an option to click on text in the lower right corner to take you to a gallery view of more details.

I want to keep the details simple and sweet in the paragraph description with a tagline in bold before a very brief summary of the item. On the right, I have a bullet list of features. Between these elements, in a future iteration, I would shrink the cart button and move it and the “add to wishlist” button to the left, to allow the size and color buttons a more cohesive space on the right.

The rest, hopefully, is self-explanatory. Thoughts?