Supergoop! is a premium brand of broad-spectrum sunscreen products. I joined Supergoop! in early 2015 to provide design direction for the brand’s digital presence and ongoing feature development for its growing Ecommerce platform.
- User Experience Design (UX)
- User Interface Design (UI)
- Frontend Development
- Web Development
Workflow & Codebase Updates
At the project outset, I established version control for the codebase, implemented a custom child theme, and configured LESS locally – making ongoing updates faster and more stable. It also allowed for a single place to define brand styles – for example, a concise, tidy list of color variables:
/* ** Color Palette */ @white: #fff; @gray-dark: #1c1c1c; @black: #000; @sg-blue: #0055a5; @sg-blue-light: #77bcee; @sg-yellow: #fee952; @text-light: #9c9c9c; @text-primary: #555; @text-semidark: #4c4c4c; @text-dark: #3c3c3c; @trim: #d3d3d3; @trim-light: #eaeaea; @bg-light: #f7f7f7;
Visual Design & Brand Consulting
As a next step, I worked with the Supergoop! team to define accurate digital counterparts for their offline brand guidelines. This involved the design and consistent application (using those handy variables) of the following visual components:
- Typographic guidelines
- Color palette values and variants
- Shadows, trim, and animations
- UI elements, interactive behavior, and microcopy
Free Shipping Upsell, Store Locator, & More
My ongoing project with Supergoop! involves working with their team to concept, design, implement, and test new features and optimizations. Such updates include a store locator and a shopping cart upsell feature that encourages users to add items that would qualify their order for free shipping. By iterating quickly and testing our assumptions using an array of analytics tools, we have improved on nearly every key performance indicator.
Metrics-based Ecommerce Consulting
Ecommerce platforms are some of my favorite projects, as they tend to be focused in their goals and diligent about validating their assumptions. If you have an Ecommerce project and you’re looking for design or development support, I’d love to hear more!
Interested in working together?
I’m always looking for interesting problems to solve – if you want to bring your product or website to the next level, I’d love help.Get in Touch