AllPeople

An environmentally driven e-commerce website disrupting the traditional retail model for the greater good by offering sustainable products to return profit.

Problem

Shopping for products is a headache. With so many options and websites, how do people decide where and whether to buy a reliable product? Especially with the pandemic placing websites as the primary platform for consumer purchase, it was essential for AllPeople to revamp their website while clearly conveying their purpose and goals for the community.

“How might we differentiate ourselves from other sustainable e-commerce shops so customers know our company’s core values?

Competitive Analysis

To get inspiration and understand how current marketplaces run their website, we conducted a competitive analysis on the sustainable product industry. We looked at popular websites catered towards environmentally driven consumers including Thrive Market, Grove Collaborative and The Body Shop. From there, we created a collaborative list of the navigation mechanisms and critical product information to develop a strategy that would best appeal to customers. In addition, we took a deeper look at our own website to reevaluate inconsistent features or details.

Insights

After interviewing 20 people and conducting extensive research, we discovered consistent trends and patterns in our findings. These were the primary insights we gathered.

Meet the Users

Based on our user interviews and research through the analytics of our site, I constructed two user personas that encapsulated the primary pain points and needs. This would help our team guide ourselves throughout the design of the website, keeping these user patterns in mind.

Information Architecture

Since AllPeople’s brand places emphasis on its eco-friendly products, donations, and core values, I decided to divide the main navigation into four main sections. Rather than highlighting only products, I wanted to make sure that customers had the opportunity to learn about the company while effortlessly browsing our website. The creation of a site map to allowed me to define the overall structure of the website, helping me visualize the steps that must take to get to each page.

Wireframes

Before moving onto high fidelity wireframes, I crafted low fidelity wireframes to get a sense of what the final product would look like. I kept content organization and unique sections in mind when creating these wireframes.

Design System

To capture AllPeople’s earthy and welcoming atmosphere, I decided to use various shades of green as the primary colors to convey the importance of environmental protection and sustainability on our website. The addition of pink invokes feelings of comfort while the green represents growth in users, pairing perfectly with the atmosphere of the application. The main typeface of choice would be open sans since it offered versatility with its lowercase and uppercase styling.

Solutions

Within one week, I was able to redesign the home page, product page, and the category page of our website utilizing the research we gathered. Below, view the solution.

Home Page

Our Company:
Read our company’s mission and learn how you can participate in giving back to the community

How it Works:
Learn about how your purchase impacts the world by reading about the way our company operates in five easy steps.

New Products:
Browse some of our new products that are updated daily

Popular Categories:
Shop our customers’ favorite categories with a simple click of an image

AllPeople Blog:
View our blog to learn other ways you can protect the environment while supporting your community

Product Page

Breadcrumb Navigation:
Easily navigate categories and reduce your clicks by using our simple breadcrumb trail

Product Features:
See how this product benefits both the you and environment with our customized icons and labels

Why We Love This Product:
Learn why our company endorses this product and how it aligns with our company values

We Also Love :
Browser curated recommendations based on your recently viewed products and searches

Customer Reviews:
Read trusted reviews from real people

Category Page

Subcategory:
Easily find products by clicking on the drop down menu to select the desired subcategory

Filter + Sort:
Refine searches even further by narrowing the selected subcategory by type, size, and price

Takeaways

Never be afraid to ask questions
Since this was my first internship, I gained valuable lessons from not only my team members, but the entire company. I learned to never make assumptions about customers, always recognizing and clarifying assumptions first to truly empathize with the audience. Through the act of simply asking questions, conducting user interviews and crafting user personas became a true game changer for me, allowing me to uncover hidden pain points I would’ve never thought of.

Collaboration is key
Additionally, I learned to not be afraid asking others for help or collaboration. Before this internship, I would often rely on myself and find resources online for when I needed assistance. However, after completing this internship, I learned that the best product comes from effective teams, not from one genius. Regardless of their role, every person was extraordinarily helpful through every step of the process and I will forever be thankful for their care and support. Not only did these learnings make me a better designer, but they also made me a better team member.

Next Steps

While this project had a short deadline, I was still able to successfully redesign a website to increase customer acquisition and demand. However if I had more time, I would explore more navigation systems and focus on unique to further differentiate our site from other companies. As for next steps, I hope to carry on these lessons in future internships to truly make an impact on society. I’m extremely grateful for this opportunity and I can’t wait to see where my learnings take me.