Frontend Product Page

Design & Webflow Development

The Brief: To refresh the messaging of the Shogun Frontend product page.

My Role: Design, art direction, Webflow development

Aspirational Storefront

To tell the story of Shogun Frontend, the team wanted to create an "aspirational" online storefront that would be shown in the imagery throughout the page. Below is a moodboard of images I collected that convey the dreamy, colorful, and ambiguous store I had in mind.

Iconography

Shogun Frontend is a platform that allows online stores to separate the backend of their shop from the Frontend, allowing for more customization and quicker speeds. I used the concept of separation to develop the iconography and other elements throughout the page design.

Page design

Shogun Learn

Design & Webflow Development

The Brief: To create a place for Shogun's "greatest hits" content.

My Role: Design, art direction, Webflow development

Wireframes

Since the resource library is an ever-changing document, we wanted to create a system that was flexible enough to fit any type or quantity of content. The end result was inspired by the modularity of a newspaper grid system.

Iconography

Page Design

scroll

V2 Expansion

For the second version of the resource library, we expanded the new visual language to more content pages, including a combined blog (our original blog is separated by Shogun's two products), the blog article pages, content type pages, and category pages. Below are some examples of how the visual language translates across the additions.