Pushing performance and environmental responsibility.

 
rakesh-shetty-1096459-unsplash.jpg

EARTH ETHIC

Branding | UX/UI E-Commerce App & Desktop Design

 
 

About Earth Ethic.

Earth Ethic is an E-Commerce OUtdoor EQUipment manufacturer with its main focus is raising awareness of harmful products being made in most waterproofing materials, and selling only high quality and smart alternative products.


LogosArtboard 32 copy 2@300x.png

Drawing inspiration from trails and organic forms in nature and paired with a bold typeface and the opportunity to work with the double E’s in the name, this logo gives an informative and clean voice to a quality and purposeful outdoor manufacturer.

 
 
Artboard 7 copy 10.png
 

PROBLEM:

Nearly all participants did not know outdoor equipment companies manufacture gear with chemical perfluorinated compounds, (PFC for short), which is used for inexpensive waterproof material, but is a recently discovered carcinogen, and extremely pollutant to the environment, people, and animals in it.

my GOALS:

To create and brand an e-commerce company in an informative approach, reaching mid to older age audiences and their families.

To design a mobile app and website with great usability for the best e-commerce experience, and raise awareness of the harmful PFC chemicals being made in most outdoor gear.

Identifying a need.

  • what do users need in e-commerce browsing and shopping?

  • How MIGHT I raise awareness of PFC being made in products?

These are some of the questioned I asked myself in the planning phase of the project.

To begin, an online survey was conducted and over 90% of participants did NOT know about PFC chemicals in most waterproofing gear, or if there were alternative sources to purchase instead.

Additionally, 81% of participants answered yes to paying a little more for outdoor products if it meant keeping the environment safer!


Brainstorming.

-social media seems likely outlet for raising awareness and using as a marketing technique. Possibly a rotating featured user section on website/mobile. #earthethic; #wheresyourearthethic

-I started researching user based design decisions for best practices for e-commerce companies, and online ordering to help me create the best experience possible for the user.

 

Personas.

I created some personas of fictional users that would help me formulate an idea of how to tackle some of the problems for this project.

 
Artboard – 5.png
Artboard – 2.png

 

Initial Prototyping + User testing.

 
 
Artboard 19.png
 
 
landing mobile.png
 
Day Hiker Products.png
 
Day Hiker Product Selected – 1.png
 
Day Hiker Product Selected.png
 

Early prototyping + testing shown some problems, but room for opportunity. Based on user feedback:

  • Add to cart feature was overwhelming user

  • Viewing product on product page as a silhouette would be difficult to view the the actual item

  • silhouette feature dividing space is too busy and distracts the user

 

 

Solutions + Features.

Based off feedback, a more subtle UI element of a silhouette was added throughout the desktop and mobile. A sleek ‘add to cart’ feature that animates to the right of the screen and gives a cleaner experience for the user.

Typography.

 
 
newArtboard 7 copy 13.png

Color Palette.

 
 
 
iPhoneX_Mockup_1.png
 
 
landing mobile.png
 
 
 
EE_Desktop_Spill_2.png
 
 
EHM_mobile_mockup1.png
 

“Taking steps towards renewable and eco-friendly gear.”

hiker3.jpg
 

Thank you for viewing my project!

Next Project.

 
BCBFPhotoedit.jpg