Perfect Snacks E-Commerce Website Design

Creative Direction, UX, UI ,Wireframes, User Journey, Visual Design and Prototyping: Jennifer White

Start Up: Perfect Snacks

Honorable Mention: The Facebook mobile team requested to use elements of this new "mobile first" site as best in class examples of parts of the consumer journey.

Growing start up Perfect Bar into Perfect Snacks and successfully completing an acquisition in 2019 by Mondeléz International, I have redesigned the Perfect Snacks website twice. The first time, urgently cleaning up a decade of old artwork and outdated branding and optimizing the consumer journey to the best of our abilities within various platform and budget limitations due to start up life. It was a huge overhaul and a huge improvement. This also included creating new product photography, with my art direction and hiring the talented and delightful Greg Merino. The second time I redesigned the Perfect Snacks website, we were able to redesign from the ground up, further pushing the UX UI experience for a best in class shopping journey, getting users from point A to B in the most seamless, intuitive way possible, also ensuring the mobile experience accountable for 80% of traffic came first and foremost.  I have to add, everything I learned about ux I learned from Lindsay Matheson at my previous job, she's amazing! The new website continues to be optimized as we learn from data and analytics, resulting the most e-commerce sales in history at Perfect Snacks and honorably mentioned by the Facebook mobile team as best in class example of the consumer journey.

My Agile Process

I work in sprints to allow for user testing, developers and stakeholders to weigh in. I follow this process and repeat 'til the website is complete (but of course we continue this process for optimization as we analyze traffic data). Learn more below.

Step 1: Review Google Analytics, Define Personas, Set Goals

Step 2: Optimize User Experience & Create Mobile & Desktop Wireframes

Step 3: Visual Design

Desktop Designs

Mobile Designs

Step 4: Prototyping

Step 5: Create Interaction Guides & UI Library

Step 6: Create Additional Assest As Needed (Such as pop ups etc.)

A breath of fresh air

Sign up to receive letters delivered to your inbox once in a blue moon on branding, art, and design.

  • Grey Facebook Icon
  • Grey Twitter Icon
  • Grey Instagram Icon

©2019 by Sage & Spruce Design LLC