Product Design + Branding

Areka

Empowering people to make sustainable choices - A responsive website for eco-friendly dinnerware
Client

The Solid Ventures Inc.

Service

Product Design + Branding

Industry

E-commerce

project timeline

June 2022 - Aug 2022

Areka is a brand that's looking to sell eco-friendly dinnerware.

The Solid Ventures Inc., a Toronto-based organization, required a solution to showcase their environmentally conscious products and educate individuals about sustainable practices. Areka, the chosen platform, places a strong emphasis on user experience, offering a smooth journey through informative, interactive elements. This enables users to gain insights into their purchases, including sourcing details and the sustainability initiatives linked to the products.

The problem

Lack of general knowledge about eco-friendly alternatives that can replace single-use plastic dinnerware.

While plastic disposable dinnerware is cheap and easy to use, it is often not recycled and contains harmful materials that pollute our land, rivers, lakes and oceans - harming the ecosystem. A lot of people are not aware of the benefits of replacing single-use plastic dinnerware with eco-friendly dinnerware.

The solution

Learn about the benefits as you buy the product.

Nunc ac arcu erat. In volutpat ornare massa non condimentum. Praesent lacinia interdum mi sit amet volutpat. Integer suscipit orci vel fringilla hendrerit. Nunc ac arcu erat. In volutpat ornare massa non condimentum. Praesent lacinia interdum mi sit amet volutpat. Integer suscipit orci vel fringilla hendrerit. Nunc ac arcu erat.

Our Approach

Creating a full relationship management platform to measure growth activities.

Nunc ac arcu erat. In volutpat ornare massa non condimentum. Praesent lacinia interdum mi sit amet volutpat. Integer suscipit orci vel fringilla hendrerit. Nunc ac arcu erat. In volutpat ornare massa non condimentum. Praesent lacinia interdum mi sit amet volutpat. Integer suscipit orci vel fringilla hendrerit. Nunc ac arcu erat.

Our impact for

The Solid Ventures Inc.

Our impact for

The Solid Ventures Inc.

Our impact for

The Solid Ventures Inc.

Our impact for

The Solid Ventures Inc.

Our impact for

The Solid Ventures Inc.

Our impact for

The Solid Ventures Inc.

"Quisque id elit semper, vehicula tellus in, posuere lacus. Curabitur nisi eros, finibus ac eleifend at, varius vel purus maecenas."

Emily Dalsher

The Solid Ventures Inc.
Showcase
No items found.
Product Design + Branding

Areka

Empowering people to make sustainable choices - A responsive website for eco-friendly dinnerware
Client

The Solid Ventures Inc.

Service

Product Design + Branding

Industry

E-commerce

project timeline

June 2022 - Aug 2022

Areka is a brand that's looking to sell eco-friendly dinnerware.

The Solid Ventures Inc., a Toronto-based organization, required a solution to showcase their environmentally conscious products and educate individuals about sustainable practices. Areka, the chosen platform, places a strong emphasis on user experience, offering a smooth journey through informative, interactive elements. This enables users to gain insights into their purchases, including sourcing details and the sustainability initiatives linked to the products.

The problem

Lack of general knowledge about eco-friendly alternatives that can replace single-use plastic dinnerware.

While plastic disposable dinnerware is cheap and easy to use, it is often not recycled and contains harmful materials that pollute our land, rivers, lakes and oceans - harming the ecosystem. A lot of people are not aware of the benefits of replacing single-use plastic dinnerware with eco-friendly dinnerware.

The solution

Learn about the benefits as you buy the product.

Nunc ac arcu erat. In volutpat ornare massa non condimentum. Praesent lacinia interdum mi sit amet volutpat. Integer suscipit orci vel fringilla hendrerit. Nunc ac arcu erat. In volutpat ornare massa non condimentum. Praesent lacinia interdum mi sit amet volutpat. Integer suscipit orci vel fringilla hendrerit. Nunc ac arcu erat.

Our Approach

Creating a full relationship management platform to measure growth activities.

Nunc ac arcu erat. In volutpat ornare massa non condimentum. Praesent lacinia interdum mi sit amet volutpat. Integer suscipit orci vel fringilla hendrerit. Nunc ac arcu erat. In volutpat ornare massa non condimentum. Praesent lacinia interdum mi sit amet volutpat. Integer suscipit orci vel fringilla hendrerit. Nunc ac arcu erat.

Our impact for

The Solid Ventures Inc.

Our impact for

The Solid Ventures Inc.

Our impact for

The Solid Ventures Inc.

Our impact for

The Solid Ventures Inc.

Our impact for

The Solid Ventures Inc.

Our impact for

The Solid Ventures Inc.

"Quisque id elit semper, vehicula tellus in, posuere lacus. Curabitur nisi eros, finibus ac eleifend at, varius vel purus maecenas."

Emily Dalsher

The Solid Ventures Inc.
Showcase
No items found.
Product Design + Branding

Areka

Empowering people to make sustainable choices - A responsive website for eco-friendly dinnerware
Client

The Solid Ventures Inc.

Service

Product Design + Branding

Industry

E-commerce

project timeline

June 2022 - Aug 2022

Overview

Areka is a brand that's looking to sell eco-friendly dinnerware.

The Solid Ventures Inc., a Toronto-based organization, required a solution to showcase their environmentally conscious products and educate individuals about sustainable practices. Areka, the chosen platform, places a strong emphasis on user experience, offering a smooth journey through informative, interactive elements. This enables users to gain insights into their purchases, including sourcing details and the sustainability initiatives linked to the products.

My Role
Product Designer — Research, User Flows, Visual Design, Prototyping, Branding
The problem

Lack of general knowledge about eco-friendly alternatives that can replace single-use plastic dinnerware.

While plastic disposable dinnerware is cheap and easy to use, it is often not recycled and contains harmful materials that pollute our land, rivers, lakes and oceans - harming the ecosystem. A lot of people are not aware of the benefits of replacing single-use plastic dinnerware with eco-friendly dinnerware.

Problem Image showing plastic dinnerware.
business goals

Make people switch from single-use plastic items to more environment-friendly options.

I collaborated with multiple stakeholders at Solid Ventures Inc. to define their business objectives, ensuring alignment with both user and business requirements. After thorough discussions, I summarized these objectives into three key business goals:

The solution

Learn about the benefits as you buy the product.

The aim of the project was to craft a responsive website that emphasized the importance of minimizing plastic waste and embracing sustainable practices to safeguard the environment. I envisioned a platform where users could not only explore the advantages of eco-friendly choices but also experience a sense of fulfillment as they contribute to sustainability through their purchases.

background research

Not everyone follows through with sustainable practices.

To begin my research process, I explored articles and websites that provided background information about sustainable responsibility and the current single-use plastic waste situation, which was when I discovered an eye-opening statistic from "The Elusive Green Consumer", an article written by Katherine White, David J. Hardisty, and Rishad Habib:

"...65% [of consumers] said they want to buy purpose-driven brands that advocate for sustainability, yet only about 26% actually do so."

competitive analysis

User experience is not given as much importance as the product.

To get a sense of the current market, I analyzed 4 popular websites that sell eco-friendly and sustainable products. The main purpose of the audit was to understand the competition and find areas for improvement.

Key insights derived from the competitive analysis:

  • Challenging to navigate websites due to too much information clustered on one page.
  • Lack of accessibility considerations makes the websites less inclusive.
  • More focused on selling wholesale, making it difficult for individuals and families to purchase products.
  • Emphasis is given to promoting products rather than improving site quality, resulting in websites with poor user experiences.
understanding the user

People are more likely to buy an eco-friendly product when they know the value behind it.

In addition to the competitive analysis, i found it imperative to gain insights from users to determine Areka's target audience. I conducted an online survey, which gathered 49 responses, to understand the users' thoughts about sustainability and existing websites selling eco-friendly products.

Key insights derived from surveys:

  • 90% of participants buy single-use dinnerware due to convenience and cheaper prices.
  • 75% of participants want to be more environmentally conscious but don't know where to start.
  • 79% of participants would like to know where and how the eco-friendly products are sourced.
  • 80% of participants want brands to be more transparent about the sustainability of their products.
PAIN POINTS

Might be eco-friendly but not user-friendly.

Based on the insights gathered through the background research, competitive analysis, and surveys, I deduced vital pain points users experienced on eco-friendly branded websites.

I will focus on addressing the following pain points when designing Areka's user experience:

starting the design

Taking a new direction towards making the right choice.

4 Major Goals

To begin my ideation phase, I outlined 4 major goals that would serve as a guideline throughout the design process. The main purpose of this exercise was to ensure that I addressed the user pain points in the most effective way possible.

User Flows

The main objective I had when developing Areka's user flows was to make it easy for users to complete a task without being overwhelmed with too many options and pages to navigate, using Hick's Law as a guiding principle to create the most efficient user flows. This led me to organize Areka's user flows into two main categories: Browsing & Purchase and Curate.

Browsing & Purchase User Flow

To ensure that users don't feel overwhelmed with browsing and purchasing a product, the user flow follows a simple and familiar structure that efficiently incorporates all the necessary steps to give users more time for decision making.

An additional feature incorporated within the user flow is the inclusion of the "Feature", "Process", and "After Use" categories under Product Details to address the user pain point of Transparency. Providing adequate information about the product would allow users to feel the brand's genuineness and be more inclined to revisit the website.

Curate User Flow

To address the user pain point of Guidance, I developed the Curate feature to provide users with personalized recommendations based on their current needs. This would make it easier for users who are undecided about a product or want additional help with their decision-making process.

Users can choose from two options, curating their product recommendations or browsing featured products based on insights collected from trending searches, user activity and seasonal interests.

Digital Wireframes

The initial designs for Areka's responsive website focused on incorporating 4 main goals previously outlined to deliver a personalized experience for users who wish to learn more about eco-friendly dinnerware as they purchase it. I divided the wireframes into four underlying typologies: Home, Curate, Product, and Checkout.

Home Page Wireframe Iteration

For the Home screen, I distilled a simplified layout with a hero banner and a top navigation bar to highlight the fundamental aspect of the website - to shop for products. This layout would allow users to access the page they need quickly and easily without navigating through multiple pages.

Curate Page Wireframe Iteration

Another essential and unique feature of the website is the addition of a Curate page, a feature that would allow users to curate a personalized collection of products based on their needs and interests. The curation is completed in small, simple steps to avoid overwhelming the users with multiple options.

Product Page Wireframe Iteration

The Product pages' primary function is to be transparent with the product details to increase user engagement. Emphasizing the image carousel and product info section by placing them in the center of the page will allow users to focus on the product rather than get distracted while making a decision.

Checkout Page Wireframe Iteration

While drafting Areka's checkout experience, I placed an emphasis on familiarity and efficiency. I used existing checkout models to let users focus on completing their purchases rather than learning how to move onto the next step.

branding

Reflecting Ssustainability through brand identity.

For Areka's branding, I focused on creating an identity that reflected the business' sustainability goals and bringing an in-person shopping experience to home. I incorporated both business and user needs to establish the business' design and branding strategies and create a sophisticated, polished end-product.

Logo

The goal of the logo was to incoporate the areca palm leaf into the design to highlight the material from which most of the products are made.

Typography

My choice of typeface for headings and titles was that of something elegant and geometric to stand out to users. For the subheadings and body text, I chose to use a typeface that combines traditional and modern styles while maintaining enhanced legibility to add a bit of character and refinement.

Colour Palette

Areka's colour palette was predominantly inspired by the aesthetic of the tropical forests from where the areca palm leaves are sourced. To maximize accessibility and usability, I used the Adobe Colour Accessibility Tool to ensure I adhered to accessibility guidelines to create a colour palette that is both user-friendly and visually appealing.

final designs

Refining the design and prototyping the final product.

During the final stage of the design process, my main goal was to implement the branding strategies previously outlined within the drafted wireframes to create high-fidelity mock-ups for the responsive website. I emphasized developing a clean and sophisticated website that allowed users to browse for products and learn about sustainability simultaneously in order to address business and user needs effectively.

Mobile Experience

The mobile version of the website simplifies the features to avoid overwhelming the users with content and provides a clean user interface for users to browse through products easily.

going forward

Reflecting on what I learned and what I could do better.

As this was my first ever freelance project, I was immensely grateful to have the opportunity to collaborate with various stakeholders to develop a responsive website, end-to-end. Throughout this design process, it was interesting to realize that so many design considerations need to taken into account for any given design solution, even for simple user experiences.

Lessons Learned

Next Steps

View more projects

View more projects

View more projects

View more projects

View more projects

View more projects

View more projects

View more projects

View more projects

View more projects

View more projects

View more projects

Product Design + Branding

Areka

Empowering people to make sustainable choices - A responsive website for eco-friendly dinnerware
Client

The Solid Ventures Inc.

Service

Product Design + Branding

Industry

E-commerce

project timeline

June 2022 - Aug 2022

overview

Areka is a brand that's looking to sell eco-friendly dinnerware.

The Solid Ventures Inc., a Toronto-based organization, required a solution to showcase their environmentally conscious products and educate individuals about sustainable practices. Areka, the chosen platform, places a strong emphasis on user experience, offering a smooth journey through informative, interactive elements. This enables users to gain insights into their purchases, including sourcing details and the sustainability initiatives linked to the products.

my role

UX Designer — Research, Information Architecture, Usability Testing, Wireframing & Prototyping

The problem

Lack of general knowledge about eco-friendly alternatives that can replace single-use plastic dinnerware.

While plastic disposable dinnerware is cheap and easy to use, it is often not recycled and contains harmful materials that pollute our land, rivers, lakes and oceans - harming the ecosystem. A lot of people are not aware of the benefits of replacing single-use plastic dinnerware with eco-friendly dinnerware.

Problem image for SettleCAN showcasing icons describing immigrants in Canada.
The solution

Learn about the benefits as you buy the product.

The aim of the project was to craft a responsive website that emphasized the importance of minimizing plastic waste and embracing sustainable practices to safeguard the environment. I envisioned a platform where users could not only explore the advantages of eco-friendly choices but also experience a sense of fulfillment as they contribute to sustainability through their purchases.

understanding the user

Acknowledging newcomers' (challenging) experience.

Starting with qualitative research, I interviewed 8 people who had recently immigrated to Canada are in the midst of settling in. The goal was to identify the challenges newcomers faced during their settlement process.

Key insights derived from the interviews:

For quantitative research, I conducted an online survey using Google Forms to understand how newcomers experienced their settling-in process in Canada and to observe any patterns between them. The survey gathered a total of 45 responses which assisted me in identifying distinguishable insights into the problem.

Key insights derived from the survey:

competitive audit

Too much information with too little diversity.

In addition to the qualitative and quantitative research, I conducted a competitive audit that analyzed 3 of the most well-known online resources currently available for newcomers in Canada.

Key insights derived from the competitive audit:

  • Lack of diverse information that caters to various groups of people.
  • Too much information at a glance - creating confusion rather than providing clarity.
  • No way of keeping track of the settlement process, leading to feeling disorganized and lost.
  • Lack of accessibility features results in excluding certain groups of people with different needs.
pain points

Not enough for everyone, everywhere.

By combining the insights gathered from the interviews, surveys, and competitive audit, Iwas able to deduce key pain points that users experienced while searching for newcomer-related online resources.

I will address the following pain points when designing SettleCAN's user experience:

user journey map

Think like a user...

Based on the research conducted, I created a user journey map to help understand the pain points and emotions that a user might feel while searching for an online resource as a newcomer. The visual representation of the user's journey also highlights improvement opportunities, which will be applied when iterating designs for the mobile app.

starting the design

Prioritizing convenience and usability.

How might we?

I developed a few How Might We statements to begin my ideation process and explore ideas that might help solve the outlined user problems. I aimesd to translate the gained insights into actionable design solutions and work on reframing user pain points into valuable opportunities.

Information Architecture

My goal when developing the app's information architecture was to prioritize seamless and efficient user navigation. This was done so to ensure that users can focus on completing their tasks rather than trying to figure out how the app works.

Paper Wireframes

Keeping the user pain points, awareness, accessibility and accuracy, in mind, I started creating paper wireframes to begin sketching out potential screen designs. I prioritized a clear and straightforward navigation process to ensure users are comfortable with the process and avoid confusion.

Digital Wireframes

When creating the digital wireframes for the SettleCAN app, easy navigation was an essential user need toaddress in the designs inaddition to allowing users tokeep track of their settlement process.

I categorized the wireframes into 3 main groups based on their primary functions: Home and Browsing, Online Resources, and Progress Tracking.

Home and Browsing

My main focus when designing the home and browsing screens was to keep them simple and easy for the users to understand. To avoid any navigational difficulty, the content was categorized into major topic to assist users with finding information they needed quickly and easily.

Online Resources

Features such as a news page and informative articles were included to prevent users from feeling like they have inadequate knowledge about the settlement process. This would allow users to find all the information in one place rather than searching through multiple sites.

Progress Tracking

A checklist function was introduced to optimize user efficiency and allow users to track their settlement process. Additionally, including a discussion board and a search function would allow users to find answers to their enquiries while completed required tasks.

Low-Fidelity Prototype

To prepare for usability testing, I created a low-fidelity prototype using the digital wireframes to construct a user flow that emphasized the browsing of topics to adding a task to an existing checklist.

Usability Study

Navigating usability: Where functionality meets satisfaction.

Parameters

Affinity Map

After conducting the usability study, I created an Affinity Map to help analyze the data collected. I organized the findings under specific topics to better understand the user insights as well as recognize & prioritize user pain points for future iterations.

Usability Study Findings

Here are the key observations derived from the usability study:

refining the design

Turning setbacks into (improvement) opportunities.

Taking into consideration the feedback gathered from the usability study, I refined the designs to address the insights collected and enhance the overall user experience of the app.

accessibility considerations

An inclusive and accessible approach.

Throughout my design process, my focus was always on designing an app that EVERYONE could use. I included features such as a translation function, recognizable icons, and a neutral colour palette to maximize usability and accessibility.

Final Designs

Settling in Canada with a click of a button.

Based on the feedback gathered during the usability study, I reiterated the designs of the final screens to bring focus to certain features and improve the app's overall user flow.

High-Fidelity Prototype

The high-fidelity prototype followed the same user flow as the low-fidelity porotype while including additional screens to accommodate user needs observed after the usability study.

going forward

What I learned (what I'd do differently).

As I progressed, I realized that attending to particular user requirements at every phase of the design process enabled me to devise solutions that were practical and valuable.

Lessons Learned

Next Steps

View more projects

View more projects

View more projects

View more projects

View more projects

View more projects

View more projects

View more projects

View more projects

View more projects

View more projects

View more projects