Setting up the Theme and Design Execution

Setting up the theme or choosing the color for your could be tricky but extremely impactful in building customer’s perception of the , Every color symbolizes some thing or other you may find different individuals have different theories about different colors.

I wanted to choose a color which signifies freshness so I picked green not the conventional red color which is generally used for different delivery apps. This app is not about hot ready to be delivered to your door step, this app is about surplus food it could be anything from raw eggs to chicken to vegetables to dairy products should be fresh and must have some shelf life and this aspect of freshness can be conveyed with a green theme.

Primary Color for the product

Type face and font selection

On-Boarding and Authentication screens

On-Boarding screens

Application starts with clean and neat on-boarding screen selling the main USP’s of the product that would surely encourage the user to signup in the application.

Authentication Screens

Post on-boarding will come signup screen with prominent social login at the top, since most of the users nowadays prefer signup through social accounts like Google and Facebook for quick access instead of registering through email and creating a password. Although there would be an option for the same if in any case user wants to signup via a different email. Post signup the app will start searching for the users nearby your location and will display a list of the users in a per-defined radius who are already sharing and receiving excess food via ”O”.

Landing and Product page

Landing page is divided into 4 main CTA’s Up for Grabs, Neighborhood Needs, Share Items and Request Items along with a search bar from where user can directly search for what they are looking.

Up for Grabs

List of all surplus food products/items that are posted by the user in the app.

Neighborhood Needs

This shows what your neighbors are looking for within the location radius set by you in the app, you could help them by sharing any food item you have in surplus matching the need of your neighbors.

Share Items

Here user can share any food product/item they have in surplus with them, one can share it with their neighbors who might be in need of it. Users can manually fill the details of the item they are sharing while creating the post or they can directly scan the bar code of the product if available which will automatically fetch all the info about the product.

Request Items

This section helps the user to request for something which they are looking for. This will create a post in the app which will display in the neighbors need feed for other users of the app.

Product Listing Page

Product listing page (Up for grab) shows the list of products the address where they can grab the product that meets their current requirement. Each card shows the picture of the product, name of the person who created that post, description of the product. Users can also share and bookmark different products available in the list.

Detailed Product page

Product detailed page gives detailed and all the sufficient information like food description, Ingredients used, Nutrition label and expiry date that one would need before grabbing any food product. There is an option where user can directly contact the owner of the post via a chat module in the application. At the time of creating this detailed post user can either fill the details like name of the product, Nutrition label, Ingredients etc manually or they can directly scan the the bar code of the product which will automatically fetch all the information related to that particular product and will reduce manual effort of the users.

Customizing your feed

User can put filters on their feed which would bring them close to what they are exactly looking for. As far as design goes I opted for a very basic structure for filtering your feed, as show in the screen above filters have divided in in three main categories Diet, Food type, Diet type and Best before(expiry date), these main categories will be divided into different sub categories this would eventually help the users to get really close to their requirement and will help in reducing their effort of scrolling in the application. Another major factor that will affect the users feed in the application is location, as you can see in design above location screen will give a control to the users to reduce and increase the radius of their search, the feed will be adjusted according to the location radius set by the user.

Invite, Rate app and Error screens.

Conclusion

This project taught me that design is not only about aesthetic screens, I learnt how important it is to follow a user-centered design process, how important it is to understand your audience, analyzing the problems, researching and developing a scalable and feasible solution for present and for future.

That’s all everyone! Hope you all would like the designs and process I followed while working on this project.

Follow me on



Source link https://blog..io/ui-ux-case-study-food-sharing-app-cup-o-sugar-61dbbbd84103?source=rss—-eb297ea1161a—4

LEAVE A REPLY

Please enter your comment!
Please enter your name here