Overview

The first Pharmaca store opened in Boulder, Colorado in the year 2000. Pharmaca is a holistic health and beauty company which exists within the e-commerce sphere as well as in traditional brick-and-mortar stores. Since their inception, they have opened 28 stores in 5states including Colorado, California, New Mexico, Oregon, and Washington, with plans to expand even more.

Disclaimer

This exercise was done from personal opinion and has no affiliation with Pharmaca.

Timeline

September 2020

Role

Sole Designer

Tools & Skills

Adobe Illustrator, Adobe Photoshop, Figma

Analysis

Pharmaca’s website was overly cluttered and confusing, and I wanted to practice my ability to create clean, custom websites for e-commerce. The new website minimizes the number of steps necessary to take between accessing the website, shopping, and finalizing the order to facilitate faster and easier user processes and retain customers. The website has many different categories that, with the redesign, have been reorganized in a way that makes more sense to the average user.

Pharmaca's existing website lacks visual hierarchy and clarity.

The largest category of people shopping for natural beauty and health products are between the ages of 18 and 29. In fact, 83% of Generation Z searches for words such as “natural” and “organic” when shopping for these products. In addition, 77% of people take dietary supplements including 74% of men. [a] I created two User Personas around these facts in order to better understand how different age groups might be interacting with the site.

I found that I wanted to organize information in a more understandable way. I accomplished this first through addressing the overall pages by creating a map of the current website’s pages.

Information architecture for Pharmaca's existing website.

On the landing page, I reduced the visual clutter and eye strain by increasing margin size and organizing information according to a grid.

Mid-fidelity prototype of a suggested landing page.

To minimize confusion about where on the page the user is currently, I included a breadcrumb trail just below the menu.

Suggested product review page.

Allowing for users to access assistance in the form of a live chat and a phone number, minimizing fields for completion only to those absolutely necessary, and allowing users to checkout as guests all facilitate ROI with the checkout process. [b]

High-Fidelity Prototype

After inserting images and filler information, the mockup websites reads more like a real prototype. You can view it below.