Challenge
The Challenge that was presented to me was to design an e-commerce website. First of all I decided to use the UX technique that is calles Competitive Analysis, thanks to this tool I could know the state of the competence in Spain and also get some inspiration to my website.
After knowing what is in the Market, and doing some Guerrilla Interviews with my some people, I decided to put all the information that I got and use the tool MoSCoW to prioritize what I would include in my design and what not.
Defining our Logo
A logo is a a big part of your brand identity (what people will see). A good logo is memorable, differentiates you from everyone else, and fosters brand loyalty. It's what I attempt with this design. I hope you like it!
The importance of having a Design System
Thanks to having a good Design System our projects will have lot of advantages. It is not only a classification of components, it will help you to reduce design debt, eliminate inconsistencies and save time. Here you have some samples of my Design System for this project.
In the following video that I made you will see how I uses components & variants to simplify my work while I was doing my cards.
Auto-Layout feature
Figma recently released a new feature: Auto-Layout. This feature helps you to create resizable components easily. Auto Layout allows you to create dynamic Frames that respond to their contents. I really recommend you to get use to this feature cause you will save lot of time. you will have total control in your components and it will be very helpful for developers too!
High-fidelity Wireframes
Design of the final product adapting the UX / UI process in all its phases. Tests using an interactive High-Fid prototype created in Figma.
Prototype video.
Here you can see the Prototype Video of the project designed with Figma.
That was all, if you want to know how the whole UX / UI process was carried out in depth, you can send me a message by filling out the following form.
