Project Detail

I added a bar to the bottom of the pages. I positioned the areas where smart phones should be in quick succession in the lower hand in the form of hand stance. According to this, our menu button, promotions link, cart, address and profile link were in the lower bar. According to the new arrangement, the right-to-left basket screen is planned to come up from the bottom.

The address selection field I usually think would be used 1 or 2 times for 1 order was on the left of the header section on the login screen. To the right of the header field, I positioned the courier reserve function, which I think would be used less frequently in one order period than in other areas. I planned to do this with an icon of the courier engine and key visuals.

In general, I tried to modernize all solid purple colors using a very thin gradient.

Home page

I attempted to use the areas providing confusion over the map for the entrance page more economically and to use the map for a cleaner use. I chose to use a customizable map of Mapbox instead of Google Map, regardless of the budget. This map can be edited in corporate color tones or arranged in more abstract colors, making the map on the map more prominent.

I positioned the product search function on the entry page under the map. By separating the map and product areas from each other, I plan to make new users more adaptable to implementation. In case of a possible use, we thought that the page would slide up automatically and we could list the product with a smooth transition by removing the map from the screen.

I made a card design to create more space for the categories instead of a classic listing of the product category list. I wanted to emphasize product diversity by showing 4 subcategories in each card for our 23 existing categories. On the other hand, when the 23 categories are listed in the 3-box design, an empty space appears at the end. I'm a little uncomfortable with this area. You can add as many categories as you like with the card design I've made. Depending on your usage habits, you can give priority to cards so that you can get to the product more quickly if you are looking for a call or a call.

Product Listing Page

I tried to keep the listing method as it is on the product listing page. I planned to make a simpler narration by getting rid of unnecessary shadows. Instead of the yellow band underneath the product cards, I tried to divide the bottom edge of the cards into a thin purple border. In the selection area at the top, I tried to give a button view by positioning the text + visual selections in an area. I positioned the total basket amount on the basket button on the product list screen.