2550 Stephens St.
Vancouver, BC  Canada V6K 4K4
+1 604 565 0382
info@studiofaculty.com
M–F / 900am–500pm
2015

Fox & Flourish

Branding / Website
Product Photography: Nicole Wong

BACKGROUND

Living in Vancouver, where the creative community isn’t as large as bigger cities, we have been fortunate to meet many talented local creatives. Such was the case when we had the chance to meet Christina Luo—founder of the calligraphy and creative service brand—Fox & Flourish. With an early interest in calligraphy and lettering, Christina helped pioneer the popularity of her craft through her projects and workshops. After returning from an inspiring trip to Copenhagen, Christina met with us to discuss the next chapter for Fox & Flourish as well as plans to renew her online presence. At the time, Fox & Flourish already had a particular hand-crafted aesthetic that was fitting to her work and industry. However, Christina and our team both felt there was potential to refine the overall appearance. This would be done through a simple introduction of a brand typeface and a tightened selection of colour tones.

Faculty-Fox-and-Flourish-Vancouver-Caligraphy-website-design-process-1

Design Process

We asked Christina to write some short calligraphy phrases to be used on the website’s homepage. The selected phrase for the site launch was scattering stars like dust.

DESIGN

Through the design of the website, we began to introduce the refined brand direction for Fox & Flourish. We chose Caslon as the sole typeface to be used complementary to the calligraphic work Christina does. In this way, it actually allowed her work to stand out greater as artwork, or graphics while Caslon stood as the foundational voice of her brand. At the same time, Christina had renewed her identity to a crest of the fox silhouette and flowers, and the use of Caslon in her wordmark would prove to be a great pairing with the new crest. Apart from the type choice, our main objective was to create the right amount of a structure to organize yet highlight her content. In designing the section for showcasing her online portfolio, we wanted to display Christina’s work in such a way that made the website feel as though it were the paper, and the calligraphic work was display right in front of the viewer. This objective led us to display her work in its original scans in black ink on a light grey background, removing any clutter that would hinder the viewing experience.

Faculty-Fox-and-Flourish-Vancouver-Caligraphy-website-design-1

foxandflourish.com Homepage Design

Like a blank piece of paper, we wanted to give Christina a blank canvas on the homepage where she can write and easily upload calligraphy work.

Faculty-Fox-and-Flourish-Vancouver-Caligraphy-website-design-2

left: Quick links to various secondary pages are available on the homepage.
right: Contact form design slides out from menu.

Faculty-Fox-and-Flourish-Vancouver-Caligraphy-website-design-3

foxandflourish.com Ink (Portfolio) Page

Background colour changes subtly as the viewer scrolls through the page.

Faculty-Fox-and-Flourish-Vancouver-Caligraphy-website-design-4

foxandflourish.com Project Page

A full width image slideshow gallery with swipe feature on mobile devices.

Faculty-Fox-and-Flourish-Vancouver-Caligraphy-website-design-5

foxandflourish.com Project Page (Info)

The project’s title, sharing features and description opens on one half of the page.

Faculty-Fox-and-Flourish-Vancouver-Caligraphy-website-design-6

foxandflourish.com Workshop Page (left) and About Page (right)

Faculty-Fox-and-Flourish-Vancouver-Caligraphy-mobile-website-design-1

foxandflourish.com Mobile Responsive Layouts