Design Leader
Lighter.png

Director of Product Design, Lighter

The vegan Lighter app combines wellness recommendations with user preferences to curate recipes and build grocery lists. I led the team in the application of lean UX/UI design to continuously deliver product experiences that attract, retain and convert their customers.

The Lighter customer journey, outlining actions steps and connected emotions.

Gathering User Data

User data was gathered in two ways: in-app analytics (Kissmetrics and Google Analytics) and through regularly-scheduled (five per week) qualitative user interviews. Trends were compiled by the product manager and UX researcher respectively, and discussed with the team every Monday.

One of the major challenges of our shopping- and cooking-intensive vegan population was differentiating meals that were:

  1. Not shopped for or prepared (meal plan, shopping list)

  2. Shopped for but not prepared (prep list)

  3. Shopped for and prepared (archive)

Grooming

At the same Monday meeting, the team would examine trends in the data and select the user story to develop that week. We’d weigh the stories’ complexity, lift, and relationship to broader testing and product development strategies. We “groomed” this data into the following user story: "As a Lighter user, I'd like one place to view the recipes that I've either added to my upcoming week's menu or that I've already shopped for."

Concepting & Testing

Once groomed, I’d work with the product manager, UX researcher and dev lead to create some early prototypes, usually in a whiteboarding session. Together, we’d ensure that the data was being translated properly and the potential feature solutions were within dev’s scope.

Initial team sketches showing concept and proposed flow

Initial team sketches showing concept and proposed flow

 

A focus on the specific feature and how it would live within the existing framework

 

Once we felt good about the general direction, we’d create paper prototypes to test the concepts with users, iterating as we shift from internal instincts to proven directions.

An initial paper prototype

Prototype highlighting primary calls to action

Prototype highlighting primary calls to action

A refined paper prototype describing more complex flows

A refined paper prototype describing more complex flows

Brand

Inheriting an app is a challenge, especially as it's maturing out of its very early stages. Simultaneously codifying and refining the existing UI allowed me to quickly build new designs without abandoning the existing look and feel.

Typography

Calls-to-action

Color pallete

Long-Term Vision

I also identify and design out central elements, allowing for big-picture, long-term vision in short, isolated iterations. Recipe cards live in various places throughout the app and play a central role in many user stories in our pipeline.

The sketch below shows various possible expressions of a single visual style, which gives the team confidence in applying it to the story at hand.

A working sketch outlining consistent recipe card language across use-cases and flows, incorporating both existing and proposed design elements

Ready for Engineering

Once testing is complete and considerations are made for how this new element fits into the app's overall design, I mock up several designs.

 
Primary and secondary digital designs for the component

Primary and secondary digital designs for the component

 

Launch & Iteration

Finally, and in close collaboration with engineering, the story is visually integrated into the product's existing design.

The element in place at release

The element in place at release

 

After launch, the development of related features required a slight redesign. This smaller story is queued alongside all other stories in our product pipeline.

 

The entire process takes about a week. After launch, the story is tracked against its pre-identified KPIs to measure performance and gauge the need for review and revision.

 

Check out my Behance portfolio for more Lighter work.