Audrey Unchained

image of Audrey Unchained website mockup by Tom Egan

01

Overview

Completed

2015

Role

Logo Design, UI/UX Design, Web Development

Promising a brighter future in beauty and fashion, Audrey Unchained provided an environmentally friendly, socially responsible, and cruelty-free alternative with their first jewelry collection in early 2015. With that debut came a need for an online outlet in order to sell their merchandise. One of the biggest challenges that this project presented was the fluid integration of an eCommerce framework while maintaining a custom/unique aesthetic. A custom Wordpress theme was developed from scratch alongside a custom WooCommerce theme; providing the necessary eCommerce engine and backend framework to meet all of the client's needs.

02

Technologies

HTML/CSS

jQuery

PHP

Bootstrap

Wordpress

WooCommerce

Adobe Illustrator

Adobe Photoshop

03

Colors

#222327
#B8BDC0
#FFFFFFF

04

Typography

Montserrat

Headings

A a

Lato

Body

A a

05

Logo Design

Image of AMR logo

06

Sitemap

1.0HomepageNewsletter4.3Edit Billing4.4Edit Shipping4.5SettingsSign Out Edit NameEdit EmailChange PasswordPromo CodeUpdate Cart 5.1Shop5.2CheckoutDashboard2.2Collections2.1Featured4.1Lost Password4.2Create Account2.4On Sale2.3New Arrivals2.5Top Sellers2.7 Necklaces2.6Bracelets2.8Rings2.9Earrings2.10Anklets2.11WatchesProduct GridView ProductAdd to CartRelated ProductsLOGINLOGINCreate AccountLost Password2.0Shop (mega menu)4.0 Dashboard5.0Cart3.0Our StorySearch

07

UX Decision Flow

USER ENTERS THE SITEACCESS NAVSCROLL DOWNLOGGED IN?SEARCHCREATE ACCOUNTLOGINOUR STORYNEWSLETTERSIGN-UPBROWSE ITEMSNOYESNEW USER?NOYESDASHBOARDSELECT ITEMADD TO CART?NOYESCHECKOUT?NOYESCOMPLETEPURCHASE

08

Wireframes

Home

Menu 5Menu 4Menu 3Menu 2Menu 1LOGOButtonImageImageImageImageImageImageImageImageImageImageImage

Product Grid

Menu 5Menu 4Menu 3Menu 2Menu 1LOGOImageImageImageImageImageImageImageImageImageImageImageImageImageImageImageImageImage

View Product

Menu 5Menu 4 Menu 3 Menu 2Menu 1LOGOImageImageImageImageImageImageButtonButtonButtonButtonButton

09

Mobile Navigation

Default State

Transition

Active

10

Final Design