Designing a brand and flexible website for Natali Zollinger

Design, project management front-end development

Natali Zollinger is an emerging leader in the standup paddleboard industry and a sponsored athlete. She needed a hybrid blog/website that represented her vibrant, energetic personality through its layout and aesthetic while still providing useful information about her classes and activities. It was important that the site be responsive, and built on a CMS framework, giving her full control of her content.

The biggest strategic challenge we faced at the start of this project was to the find the balance between Natali’s personal brand and that of her company. Independently, she was earning credibility for her performance in various SUP competitions as well as for her popular Yoga Challenges. Now she wanted to leverage that momentum into her company, through which she could conduct workshops and gain new clients.

Visual direction

We knew we wanted a bright palette for this project, so we took to Pinterest to collect images that inspired Natali and drew our colors from that set. Natali is drawn to the colors of the ocean: bright, vivid golds and and pinks with saturated greens and blues. This defined our palette and the mood for the site. Additionally, we decided I would play with gradients and bold, playful typography to keep the mood bright and bold.

Natali is drawn to the colors of the ocean: bright, vivid golds and and pinks with saturated greens and blues.

Headers and body text are set in Halis Round, a playful alternative to omnipresent Brandon Grotesque. The script "Olivier" is brought in selectively to create a fun, less structured feel.

Patterns and layout

While I did most of the designing in code, I started with wireframes for the homepage to discuss hierarchy and to establish a layout. After working through several layout options and landing on one that worked best with the content, I created a small pattern library to be used throughout the site.