Joenel Farms Ecommerce App
An Ecommerce App for customers to buy fresh farm produce.
An Ecommerce App for customers to buy fresh farm produce.
An Ecommerce App for customers to buy fresh farm produce.
Client
Joenel Farms Limited
Role
UI/UX Designer
Industries
Agriculture E-commerce
Date
April 2023
Project Introduction Joenel Farms is an agricultural business specializing in fresh produce and livestock products. The farm is developing an E-commerce App to provide customers with a convenient way to browse and purchase their products. For this project, I decided to use a goal-directed design method that focuses on empathizing with users and meeting client expectations.
Project Introduction Joenel Farms is an agricultural business specializing in fresh produce and livestock products. The farm is developing an E-commerce App to provide customers with a convenient way to browse and purchase their products. For this project, I decided to use a goal-directed design method that focuses on empathizing with users and meeting client expectations.
Project Introduction Joenel Farms is an agricultural business specializing in fresh produce and livestock products. The farm is developing an E-commerce App to provide customers with a convenient way to browse and purchase their products. For this project, I decided to use a goal-directed design method that focuses on empathizing with users and meeting client expectations.



Problem Statement Joenel Farms wants to expand its customer base and make it easy for customers to purchase fresh produce and livestock products. However, current sales channels are limited and do not reach a wider audience. To address this issue, I designed an E-commerce App that aims to offer a convenient and seamless purchasing experience for customers. The challenge is to develop an app that meets the needs and expectations of customers while overcoming technical challenges.
Problem Statement Joenel Farms wants to expand its customer base and make it easy for customers to purchase fresh produce and livestock products. However, current sales channels are limited and do not reach a wider audience. To address this issue, I designed an E-commerce App that aims to offer a convenient and seamless purchasing experience for customers. The challenge is to develop an app that meets the needs and expectations of customers while overcoming technical challenges.
Problem Statement Joenel Farms wants to expand its customer base and make it easy for customers to purchase fresh produce and livestock products. However, current sales channels are limited and do not reach a wider audience. To address this issue, I designed an E-commerce App that aims to offer a convenient and seamless purchasing experience for customers. The challenge is to develop an app that meets the needs and expectations of customers while overcoming technical challenges.
Project Goals 1. Create a user friendly onboarding process 2. Design a cohesive interface for both tech savy users, and users with a poor tech background. 3. Design an interface in a way that makes it easy for users to navigate and easily find different categories of produce. 4. Design an intereface that makes the products the focus
Project Goals 1. Create a user friendly onboarding process 2. Design a cohesive interface for both tech savy users, and users with a poor tech background. 3. Design an interface in a way that makes it easy for users to navigate and easily find different categories of produce. 4. Design an intereface that makes the products the focus
Project Goals 1. Create a user friendly onboarding process 2. Design a cohesive interface for both tech savy users, and users with a poor tech background. 3. Design an interface in a way that makes it easy for users to navigate and easily find different categories of produce. 4. Design an intereface that makes the products the focus
User Research
User Research
User Research
Research Summary The UX research for Joenel Farms E-commerce App involved conducting user interviews, surveys, and analyzing user feedback. The research aimed to understand user preferences, pain points, and expectations related to purchasing agricultural produce and livestock products online. The research findings revealed that users value convenience, transparency in pricing and delivery, and high-quality products. Users also expressed concerns regarding the security of online payments, the freshness of products, and the reliability of delivery.
Research Summary The UX research for Joenel Farms E-commerce App involved conducting user interviews, surveys, and analyzing user feedback. The research aimed to understand user preferences, pain points, and expectations related to purchasing agricultural produce and livestock products online. The research findings revealed that users value convenience, transparency in pricing and delivery, and high-quality products. Users also expressed concerns regarding the security of online payments, the freshness of products, and the reliability of delivery.
Research Summary The UX research for Joenel Farms E-commerce App involved conducting user interviews, surveys, and analyzing user feedback. The research aimed to understand user preferences, pain points, and expectations related to purchasing agricultural produce and livestock products online. The research findings revealed that users value convenience, transparency in pricing and delivery, and high-quality products. Users also expressed concerns regarding the security of online payments, the freshness of products, and the reliability of delivery.
Pain points 1. Getting farm produce directly from the source can be very difficult because farms are usually very far away in rural areas. This makes it very inconvinient to for customers to comute to the farm to buy produce. 2. Fruits and vegetables are sometimes not fresh when they are bought from the shops. They are far more likely to be fresh if they came from the farm directly. 3. Farm produce become way more costly when they are bought from shops. They cost less when they are purchased right from the farm.
Pain points 1. Getting farm produce directly from the source can be very difficult because farms are usually very far away in rural areas. This makes it very inconvinient to for customers to comute to the farm to buy produce. 2. Fruits and vegetables are sometimes not fresh when they are bought from the shops. They are far more likely to be fresh if they came from the farm directly. 3. Farm produce become way more costly when they are bought from shops. They cost less when they are purchased right from the farm.
Pain points 1. Getting farm produce directly from the source can be very difficult because farms are usually very far away in rural areas. This makes it very inconvinient to for customers to comute to the farm to buy produce. 2. Fruits and vegetables are sometimes not fresh when they are bought from the shops. They are far more likely to be fresh if they came from the farm directly. 3. Farm produce become way more costly when they are bought from shops. They cost less when they are purchased right from the farm.
User Personas
User Personas
User Personas






Empathy Map I created an empathy map to help develop a deeper understanding of the users by examining their emotions, attitudes, behaviors, and motivations. By examining these aspects of a users emotions and behaviors, I could establish a connection with the user and understand them much better. For this case study, I used an aggregated empathy map that combined similar expressions from users during my research.
Empathy Map I created an empathy map to help develop a deeper understanding of the users by examining their emotions, attitudes, behaviors, and motivations. By examining these aspects of a users emotions and behaviors, I could establish a connection with the user and understand them much better. For this case study, I used an aggregated empathy map that combined similar expressions from users during my research.
Empathy Map I created an empathy map to help develop a deeper understanding of the users by examining their emotions, attitudes, behaviors, and motivations. By examining these aspects of a users emotions and behaviors, I could establish a connection with the user and understand them much better. For this case study, I used an aggregated empathy map that combined similar expressions from users during my research.



The User Journey
The User Journey
The User Journey
Information Architecture I designed the information architecture of the application to properly define how the content of the app would be layed out. The aim was to design the app in a way that made it easy for users to navigate through the app to achieve their goals.
Information Architecture I designed the information architecture of the application to properly define how the content of the app would be layed out. The aim was to design the app in a way that made it easy for users to navigate through the app to achieve their goals.
Information Architecture I designed the information architecture of the application to properly define how the content of the app would be layed out. The aim was to design the app in a way that made it easy for users to navigate through the app to achieve their goals.



User Journey Map I used the future-state mapping approach to prepare a user journey map for a user (Amanda Amad) who wants to order farm produce in an easy and convinient way, without visiting the farm in person. Mapping Amanda's journey revealed how helpful it would be for users to have access to a dedicated Joenel Farms Ecommerce application.
User Journey Map I used the future-state mapping approach to prepare a user journey map for a user (Amanda Amad) who wants to order farm produce in an easy and convinient way, without visiting the farm in person. Mapping Amanda's journey revealed how helpful it would be for users to have access to a dedicated Joenel Farms Ecommerce application.
User Journey Map I used the future-state mapping approach to prepare a user journey map for a user (Amanda Amad) who wants to order farm produce in an easy and convinient way, without visiting the farm in person. Mapping Amanda's journey revealed how helpful it would be for users to have access to a dedicated Joenel Farms Ecommerce application.



Starting the Design
Starting the Design
Starting the Design
Paper wireframes Making several versions of each screen of the app on paper allowed for careful consideration of each element before transferring them to digital wireframes, guaranteeing their effectiveness in addressing user problems. When designing the home screen, the main focus was to create a streamlined ordering process that would be simple and efficient, thus saving users time.
Paper wireframes Making several versions of each screen of the app on paper allowed for careful consideration of each element before transferring them to digital wireframes, guaranteeing their effectiveness in addressing user problems. When designing the home screen, the main focus was to create a streamlined ordering process that would be simple and efficient, thus saving users time.
Paper wireframes Making several versions of each screen of the app on paper allowed for careful consideration of each element before transferring them to digital wireframes, guaranteeing their effectiveness in addressing user problems. When designing the home screen, the main focus was to create a streamlined ordering process that would be simple and efficient, thus saving users time.






Digital wireframes In the early stages of the design process, I made sure that the screen designs were informed by feedback and discoveries obtained from the user research.
Digital wireframes In the early stages of the design process, I made sure that the screen designs were informed by feedback and discoveries obtained from the user research.
Digital wireframes In the early stages of the design process, I made sure that the screen designs were informed by feedback and discoveries obtained from the user research.






Low fidelity Prototype When I completed the digital wireframes, I generated a low-fidelity prototype. Since the main user flow was centered ordering farm produce from the app, I used this prototype for usability testing.
Low fidelity Prototype When I completed the digital wireframes, I generated a low-fidelity prototype. Since the main user flow was centered ordering farm produce from the app, I used this prototype for usability testing.
Low fidelity Prototype When I completed the digital wireframes, I generated a low-fidelity prototype. Since the main user flow was centered ordering farm produce from the app, I used this prototype for usability testing.



Usability Studies I conducted usability studies. One with the low fidelity prtotypes to inform design decisions with regards to the form and functionality of the app, and one with high fidelity prototypes to reveal further aspects of the design that needed to be refined. Findings 1. Users want to find items they want easily. 2. Users want easy navigation through the app. 3. Users want a map interface to choose their location. 4. Users want to be able to edit their order.
Usability Studies I conducted usability studies. One with the low fidelity prtotypes to inform design decisions with regards to the form and functionality of the app, and one with high fidelity prototypes to reveal further aspects of the design that needed to be refined. Findings 1. Users want to find items they want easily. 2. Users want easy navigation through the app. 3. Users want a map interface to choose their location. 4. Users want to be able to edit their order.
Usability Studies I conducted usability studies. One with the low fidelity prtotypes to inform design decisions with regards to the form and functionality of the app, and one with high fidelity prototypes to reveal further aspects of the design that needed to be refined. Findings 1. Users want to find items they want easily. 2. Users want easy navigation through the app. 3. Users want a map interface to choose their location. 4. Users want to be able to edit their order.
High Fidelity Mockups
High Fidelity Mockups
High Fidelity Mockups
After conducting usability studies, I applied the insigths from the findings to create High fidelity mockups for the app. My focus was to address pain pain points that were itentified during interviews and usability tests. Below are some examples of transitions from low to high fidelity designs, that were made after iterations based on user pain points and insights from usability research findings.
After conducting usability studies, I applied the insigths from the findings to create High fidelity mockups for the app. My focus was to address pain pain points that were itentified during interviews and usability tests. Below are some examples of transitions from low to high fidelity designs, that were made after iterations based on user pain points and insights from usability research findings.
After conducting usability studies, I applied the insigths from the findings to create High fidelity mockups for the app. My focus was to address pain pain points that were itentified during interviews and usability tests. Below are some examples of transitions from low to high fidelity designs, that were made after iterations based on user pain points and insights from usability research findings.









Some High fidelity Mockups
Some High fidelity Mockups
Some High fidelity Mockups















High fidelity Prototype When I completed the High fidelity mockups, I generated a High-fidelity prototype. The main focus here was to ensure that navigation was easy, and it was easy for the user to find items they would like to purchase.
High fidelity Prototype When I completed the High fidelity mockups, I generated a High-fidelity prototype. The main focus here was to ensure that navigation was easy, and it was easy for the user to find items they would like to purchase.
High fidelity Prototype When I completed the High fidelity mockups, I generated a High-fidelity prototype. The main focus here was to ensure that navigation was easy, and it was easy for the user to find items they would like to purchase.



Accessibility considerations 1. Make images accessible for screen readers by adding alternative text, thus users with visual impairments can have access to the content. 2. Used detailed images for farm produce tp help users understand what each item is. 3. Used descriptive text and videos at the feed screen so that users can see how farm produce actually looks.
Going Forward
Going Forward
Going Forward
Takeaways Impact The app makes users feel like they the farm in the palm of their hands, and they can get any farm produce they need anywhere, at any time. What I learnt While doing research for this app. I learnt that users are always concerned about how easy it is for them to achieve their primary goals using an app. This makes easy navigation very important always.
Next Steps 1. Design an order tracking feature for the app, so that users can track their orders. 2. Conduct more research to identify any new areas of need.
Want to work
Want to work
Thanks for checking out my case study!
Thanks for checking out my case study!
Thanks for checking out my case study!
I specialize in creating exceptional digital products that lead to great experiences for users and help my clients and organizations achieve their business goals.
Thank you for viewing Daniel Selorm Ocloo's Portfolio
I specialize in creating exceptional digital products that lead to great experiences for users and help my clients and organizations achieve their business goals.
Thank you for viewing Daniel Selorm Ocloo's Portfolio
I specialize in creating exceptional digital products that lead to great experiences for users and help my clients and organizations achieve their business goals.
Thank you for viewing Daniel Selorm Ocloo's Portfolio