My Approach

Collaborating with our Chicago-based team, we aimed to provide a fresh and modern web experience that flexed the power of Sitecore’s context marketing capabilities. I wanted to build a solution that was scalable for all of Kimberly Clark’s brands (starting with Huggies). With that in mind, I wanted to build a modular framework consisting of powerful components that do some real heavy-lifting when it comes to serving content.

Outcome

Working in close collaboration with marketers and internal tech team, we delivered a powerful and flexible solution for Kimberly Clark’s Huggies. I built animated prototypes to test and validate interaction models as well as convey animation standards.

I collaborated with a great team of designers from our Chicago studio. My focus was to take their creative comps and translate them to a complete design system. Taking an exclusively Adobe Creative Suite workflow and introducing Sketch and InVision proved to be a worthwhile challenge. We handed off a complete turn-key solution for the development team to build.

My Contribution

• UX Strategy

• Information Architecture

• Design Systems

• Responsive Design

• Rapid Prototyping

Suite of Powerful Components

Modularity and scalability was the main objective. We wanted to create a library of powerful components that can be leveraged by all brands. With this in mind, I developed various components spanning simple to more interactive ones. From an image crop component to image library with batch downloads, I designed the components with efficiency in mind to help empower their brand partners.

Building a Design System

For the first phase of building a design system, I focused on all the core assets by building a UI Kit. The UI Kit outlined all the key states of all things brand portal (buttons, links, fields, etc.). Establishing and outlining the grid was also a very important task due to all the components that have to be responsive and each unique interactivity needed to be accounted for.

Since we were working with a very aggressive timeline, I opted to go for a tried and true comprehensive UI Kit approach. I decided to outline motion and interaction guidelines as phase two.