Web Interfaces

Product
Rodales.com

Problem

The original design of this e-commerce site was not mobile-friendly nor did it accommodate for editorial content directly adjacent to product, which developed as a key business need. The UX design challenge was to overhaul the structure of the site to be both responsive and gracefully dovetail the shopping experience with large-scale photography, articles, and social media.

Process

Ideation

Competitor Analysis & Research
Through the inspection of personas, we were able to identify specific e-commerce competitors. Thus, our research was focused on understanding the market, gathering a library of best UI pattern practices in the mobile e-commerce space, then planning to execute our patterns at the intersection of these two. 

User Mapping & Sketching
To explore flows and patterns, I sketched various design approaches.

WIREFRAMes & Prototypes

Wireframing
Very rudimentary wireframes were included in our e-commerce platform, Demandware. However, in an effort to build forward-thinking patterns, I designed, prototyped, and tested alternatives.  This initiative proved fruitful, as stakeholders galvanized around the newly proposed navigation structure.

Prototyping

HAND-OFF DOCUMENTATION & QA

Documenting the UI for Engineering
I created comprehensive hand-off documentation for engineering including high-fidelity mocks, wireframes, and detailed annotations.

QA
Bugs happen!

CUSTOM & SYSTEM Iconography

Designing Icons
I illustrated custom, branded iconography for use throughout the site.

the Delivered Product

Team & Role

The Rodale's e-commerce team consisted of the CEO, Director of Engineering, a team of engineers, one Product Manager, and a team of three UX Designers, which I led. My role as the head of the UX team was to lead the responsive design overhaul of the site. In addition to hands-on design work from ideation through testing, mocks, and delivery, this also included project management and cross-functional engagement with the Director of Marketing and Director of Photography. We worked in Agile.