top of page

Acerca de

CharvickHEader.png
Group 402-min-4.png

Project overview

Brief

Charvick Farm is a family-owned, small business that specializes in selling ethically harvested wood products and unique rustic items. It is looking to start a responsive e-commerce website that meets the customers' needs.  As the sole UX Designer and Content Designer, I designed this project from inception to final design through research, ideation, and UX design principles.

Group 405.png
Group 404.png

Product:

An accessible and responsive e-commerce website that allows customers to securely browse and purchase products directly from Charvick Farm

Project duration:

2 months

Problem:

Charvick Farm has no online presence, which makes it difficult for customers to purchase their products without going to the farm in person.

Solution:

I aimed to design an accessible and responsive website that allows customers to easily and securely browse and purchase products directly from the small business.

Group 406.png
Group 408.png
Project Oveview
Understanding the user

Understanding the user 

User research

I researched common user pain points when shopping online. Then, I interviewed 8 people with varying technical experiences to truly understand the needs, behaviors, and motivations of the users. I used this qualitative and quantitative data to create personas that reflected the users.

Screen Shot 2023-06-17 at 10.00.15 PM.png
Screen Shot 2023-06-17 at 10.00.37 PM.png

Personas

Problem statement:

Michelle is a Radiology Technologist who needs to pay with Apple Pay when shopping online because she wants a speedy checkout process while still knowing her payment information is secure.

Screen Shot 2022-06-29 at 3.06.02 PM.png
Screen Shot 2022-06-29 at 3.06.25 PM.png

Problem statement:

Nancy is a passionate biologist who needs to easily and securely purchase products on her mobile phone because she does not have time to sit at the computer and wants to feel confident in the purchases that she makes.

Pain points

CFpp1.png
CFpp2.png
CFpp3.png
CFpp4.png
CFpp5.png
Understanding the business

Understanding the business

Business goals

After analyzing the user research, I sat down with the executives of Charvick Farm to talk about their business goals and what they wanted to achieve through Charvick Farm. I wanted to make sure that the website not only reflected the desires of the users but also helped Charvick Farm achieve its goals. 

CFbgoals.png
CFbgoals2.png
CFbgoals3.png
CFbgoals4.png
CFbg5.png

Brainstorming

After addressing business goals, we began brainstorming about the Charvick Farm brand since the current brand identity was minimum.  I wanted to ensure the website retained the values and meaning that Charvick Farm held in the hearts and minds of the founders. I asked them to list any words, phrases, or colors that they associated with Charvick Farm. Then, I asked them to come up with 5 to 6 keywords that they felt embodied the company. I used this information as the design inspiration moving forward.

Screen Shot 2022-06-29 at 12.05.17 PM.png
Screen Shot 2022-06-29 at 12.05.17 PM.png
Screen Shot 2022-06-29 at 12.05.17 PM.png

Choosing the colors

I combined the color preferences provided to me by the executives with color psychology to select the best colors for the Charvick Farm website's visual design. I incorporated many natural and earthy colors that users would expect from a farm. I also included many neutral colors that resembled the colors found in wood since wood products are one of their main offerings.

Screen Shot 2022-06-29 at 12.06.32 PM.png
Screen Shot 2022-06-29 at 12.12.51 PM.png

Designing the logo

We utilized Crazy 8’s to ideate logos. Through this activity, we decided that the iconic Charvick Farm sign should be the logo for the company and I set to work digitalizing the sign.

Screen Shot 2022-06-29 at 12.12.19 PM.png
Starting the design

Starting the design

User journey map

To begin the ideation process, I mapped out the user flow to create a visual representation and gain an understanding of the steps a user would take to arrive at their end goal. This also helped to identify what screens to include in the design.  

flowchart charvick.png

Site map

Screen Shot 2022-06-28 at 8.23.21 PM.png

Afterward, I created a sitemap with the features and pages to be included on the website. I organized the information in a way that would be most intuitive to users and promote business goals.

Paper wireframes

Afterward creating the sitemap, I put pen to paper and began to design some wireframes. Firstly, I made various iterations of the website version of the homepage to get an idea of the layout that would best suit users at the beginning of their user journey. Then I sketched the main user flow of finding and purchasing an item. I included a few variations of the ‘Cart’ screen.

Screen Shot 2022-06-28 at 5.44.54 PM.png
Screen Shot 2022-06-28 at 5.47.43 PM.png

Digital wireframes

I took these designs to be reviewed by Charvick Farm executives, and we discussed which iterations and features they liked best. Noting which features to move forward with, I transferred these paper wireframes to digital wireframes. 

Sorting feature to make shopping more efficient 

SHOP mobile sort.png
SHOP.png

Lots of space for product information that is located front and center

ITEM -MOBILE.png
ITEM.png

Quick checkout process with lots of payment options and breadcrumbs to encourage and inform the user

Easily navigable online store for customers to shop all of Charvick Farm's products

HOME - MOBILE.png
Designing the visuals
Designing the content

Designing the content

Voice & tone

Apart from designing the copy throughout the main user journey, I created additional content to enhance the user experience with Charvick Farm and to provide a family-owned, small-business feel to the website. I designed the content so that it aligned with the brand's voice. Therefore, I ensured that the content reflected the fun and relaxed style of the brand, with an informative tone when necessary, while emphasizing on the concern and love for sustainability and transparency. Also, I highlighted the family members that help run the business to encourage a welcoming and “at home” feel for users.

Content design

CFcontent0.png
CFcontent1.png
Testing the design

Testing the design

Usability study

Usability testing was one of the most important parts of my design process. I conducted a usability study, which included an interview with 5 users. These users had varying degrees of technical experience and some experience with online shopping.  This study offered fantastic insight into the parts of the design that were unclear or difficult for the user.

CVF5users.png
10Q.png

Findings

CFfindings1.png
CFfindings3.png
Refining the design

Refining the design

Usability changes

Group 412-min.png

The cart was changed to be an overlay instead go having its own separate page to allow users to easily view the cart without leaving the current page Also, a 'Save for later' button was added to the cart area to provide users with more flexibility when shopping.

Group 413-min-2.png

Language while checking out was made clearer to prevent confusion during the checkout process. Some of the changes included changing 'Shipping' to 'Shipping Details' and changing 'Billing' to 'Billing Address'.

Accessibility considerations

CFacc1.png
CFacc2.png
Finalizing the design

Finalizing the design

Mockups

After incorporating the insights from the usability study, I finalized the mockups. I used photos of Charvick Farm’s products to ensure that the design complimented the products’ visual aspects well. 

mockup - splash page-min-2.png
mockup - shop-min.png
mockup - flow part 2-min-2.png
mockup - confirmation1-min.png
Conclusion

Conclusion

Takeaways

As an environmentalist, I am thrilled to know that the results of this project will not only benefit the customers of Charvick Farm but will also promote sustainability efforts. While designing this website, I wanted to communicate the importance of user-centered and responsive design while incorporating both the needs of users and business goals. This project taught me a lot about collaborating with executives, project management, and combining business goals with the needs and desires of users.  I look forward to using this knowledge and experience in future projects.

​

Impact:

Screen Shot 2023-06-17 at 10.04.50 PM.png
Screen Shot 2023-06-17 at 10.05.12 PM.png
Screen Shot 2023-06-17 at 10.05.27 PM.png

Next steps

  • Conducting additional research and studying metrics to see if any areas of the user experience could still use improvement

  • ​Adding some additional content and graphics to enhance the user experience while emphasizing sustainability and the family-owned small business aspect

bottom of page