logo10

This application is the online store of the famous The Home Depot Store. Users can purchase the items from the store and pick them up at their nearest store or drop them off. Home Depot is a store with many products and the application has very large data.
In this redesign of the UI , I have tried first of all to reduce the screen scrolls as much as possible and make it laterally when possible. Also, improve the hierarchy. On some screens like "My Cart" the cards are confusing. You don't know when one ends and another begins, that's why I've also improved the cards. I have also created a UI KIT with new icons for all categories to make the App more pleasant since it is an application with a lot of information.

Home Depot Case Studie
adobe-frescofigmaillustrator
User Flow Changes
image 1Group 1179Group 1180Group 1183image 183Group 1181Group 1182First of all, I changed the My store to the top because it is more user-friendly since it is the first thing the user see.To shorten the scrolling of this "home" screen, I decided to merge "Offer" and "Events" into two sections. The user can switch to the left to see all offers or events in these sections.After shortening the scroll so much, I found it interesting to add direct links to the store categories. They are the same categories that the user has when he is in "Shop". In this way, the user can know what the store sells from the first screen.Group 11843image 5image 4Ellipse 835Ellipse 83Ellipse 8346Group 1500Group 1183In the old App the user can only compare two items. They can now compare up to fourTo see the result of the comparisons, the old App automatically goes to the screen when the user chooses the second item. Now you will have a button to go to see the results.I separated "filter" and "sort-by" into two buttons. Now the user does not need to open the filter screen to do the sort-by. This will be a small dropdownGroup 1499
Wireframes
image 6image 7image 8image 9image 10image 11image 12
White.hex}}Black.hex}}
Ui Kit
Colors
depotlight.styleName}}depotlight.rgba}}depotlight.hsla}}depotlight.hex}}
Stroke navs.styleName}}Stroke navs.rgba}}Stroke navs.hsla}}Stroke navs.hex}}
White.styleName}}White.rgba}}White.hsla}}
DEPOTDARK.styleName}}DEPOTDARK.rgba}}DEPOTDARK.hsla}}DEPOTDARK.hex}}
depot.styleName}}depot.rgba}}depot.hsla}}depot.hex}}
Black.styleName}}Black.rgba}}Black.hsla}}
Gradient home.styleName}}
compare.styleName}}compare.rgba}}compare.hsla}}compare.hex}}
Backgroundillustrations.styleName}}Backgroundillustrations.rgba}}Backgroundillustrations.hsla}}Backgroundillustrations.hex}}
Mockups
hOMEIMG_0696IMG_0697IMG_0697IMG_0698IMG_0698IMG_0699IMG_0699IMG_0700OLDNEWAfter shortening the scroll so much, I found it interesting to add direct links to the store categories. They are the same categories that the user has when he is in "Shop". In this way, the user can know what the store sells from the first screen.Group 1317Group 131833IMG_0696IMG_0697IMG_0697IMG_0698IMG_0698IMG_0699IMG_0699IMG_0700OLDNEWAfter shortening the scroll so much, I found it interesting to add direct links to the store categories. They are the same categories that the user has when he is in "Shop". In this way, the user can know what the store sells from the first screen.Group 1319Group 132033Group 1321Group 1322First of all, I changed the My store to the top because it is more user-friendly since it is the first thing the user see.Group 1323Group 1324To shorten the scrolling of this "home" screen, I decided to merge "Offer" and "Events" into two sections. The user can switch to the left to see all offers or events in these sections.image 66Group 1325Group 1326First of all, I changed the My store to the top because it is more user-friendly since it is the first thing the user see.Group 1327Group 1328To shorten the scrolling of this "home" screen, I decided to merge "Offer" and "Events" into two sections. The user can switch to the left to see all offers or events in these sections.
hOMEIMG_0696IMG_0697IMG_0697IMG_0698IMG_0698IMG_0699IMG_0699IMG_0700OLDNEWAfter shortening the scroll so much, I found it interesting to add direct links to the store categories. They are the same categories that the user has when he is in "Shop". In this way, the user can know what the store sells from the first screen.Group 1184Group 118533IMG_0696IMG_0697IMG_0697IMG_0698IMG_0698IMG_0699IMG_0699IMG_0700OLDNEWAfter shortening the scroll so much, I found it interesting to add direct links to the store categories. They are the same categories that the user has when he is in "Shop". In this way, the user can know what the store sells from the first screen.Group 1329Group 133033Group 1331Group 1332First of all, I changed the My store to the top because it is more user-friendly since it is the first thing the user see.Group 1333Group 1334To shorten the scrolling of this "home" screen, I decided to merge "Offer" and "Events" into two sections. The user can switch to the left to see all offers or events in these sections.Group 1335Group 1336First of all, I changed the My store to the top because it is more user-friendly since it is the first thing the user see.Group 1337Group 1338To shorten the scrolling of this "home" screen, I decided to merge "Offer" and "Events" into two sections. The user can switch to the left to see all offers or events in these sections.
Frame 581Frame 582Frame 529
About
Frame 530
IMG_149E5C3B4868-1 2image 17OLDNEWGroup 1501Group 1502In the old App the user can only compare two items. They can now compare up to fourTo see the result of the comparisons, the old App automatically goes to the screen when the user chooses the second item. Now you will have a button to go to see the results.image 65Group 1503Group 1504Group 1505Group 1506In the old App the user can only compare two items. They can now compare up to fourTo see the result of the comparisons, the old App automatically goes to the screen when the user chooses the second item. Now you will have a button to go to see the results.Group 1507Group 1508IMG_0707Group 1509Group 1186In the old App the user can only compare two items. They can now compare up to fourTo see the result of the comparisons, the old App automatically goes to the screen when the user chooses the second item. Now you will have a button to go to see the results.Group 1510Group 1187Group 1188Group 1189In the old App the user can only compare two items. They can now compare up to fourTo see the result of the comparisons, the old App automatically goes to the screen when the user chooses the second item. Now you will have a button to go to see the results.Group 1190Group 1191image 67IMG_4C76EEE1B9FB-1 4
Rectangle 366
Contact
behancelinkedin
Screen Shot 2022-11-01 at 8.35 1Screen Shot 2022-11-01 at 8.44 1Screen Shot 2022-11-01 at 8.54 1Screen Shot 2022-11-01 at 8.55 1Screen Shot 2022-11-01 at 8.57 1Screen Shot 2022-11-01 at 8.57 2Screen Shot 2022-11-01 at 8.59 1
image 84
Frame 633Frame 634

I am a UI/UX design professional, living and working in Vancouver, BC, Canada. I have a background in Product Design, and I am passionate about User Experience. I believe in the power of good design and storytelling

My interest in web and mobile app design started when I was working in a product design Studio in Madrid. As a product designer, the first phases of design are very similar to those of a UX designer. Personas, Good Design, Design thinking, Journal Maps, are some of basic concepts in all areas of design. Working in Madrid, I did product design from concept, 3D modeling and rendering, after that came the graphic design presentations of the products.

Although I studied engineering, I was always very interested in graphic design. I took the initiative to create a website for the studio, where I became interested in web design. After doing research on web documentaries, I was fascinated by interactive storytelling and data visualization. After studying at Langara College, I found the career path I want to follow: to become a UI/UX designer and establish a design studio in the future.

How did I get here?

About me
About

My value as a designer

• Diligent. I’m hardworking and determined.
• Creative. I come up with unique ideas.
• Responsible. I’m reliable and always do my best.
• Open-minded. I’m willing to learn new tools and technologies.
• Teamwork oriented. I collaborate well with other team members.

My skills

• UI Design (UI kit, mockups, interaction)
• UX Design (user flow, persona, wireframing)
• Branding Design (logo design and brand identity)
• Graphic Design (posters, marketing materials, illustrations)
• Front-end Development.
• Html/CSS.
• Wordpress

Frame 530
Group 1103Vector
Union