Website

Webflow (Custom Design & Development), Photography, Copywriting, Typography, Adobe Illustrator, Adobe Photoshop

Lorraine's Cakes' existing WordPress website had served the business in its earliest stage, but was now holding them back. It was difficult to manage or update, felt unstable and buggy with inconsistent design details, and generally did not accurately convey the quality of their growing business. It also lacked support for direct-to-consumer ecommerce integration, which is an expansion the business aspires to.

Using Webflow to visually code the new website allowed for a totally custom design and a fluid transition to development. This flexibility helped transform the entire website experience—for both the client and their customers—with tastefully engaging visuals and interactions, improved content hierarchy, stronger brand messaging, much easier content management (via Webflow CMS and Editor), and even preparation for future ecommerce integration.

Visual Branding Refresh

Adobe Illustrator, Typography

Lorraine's Cakes already had a logo that they loved and felt represented their brand with sophistication and quality, as well as the "natural, healthy, and wholesome" values they intend to communicate. However, the existing logo had a challenge with flexibility and versatility when it came to scale and compatibility with certain situations and backgrounds. The new website design process provided an opportunity to resolve these issues, improving the overall readability and detail.

Notably, the logomark's capital "L" was simplified, and its stroke weight increased, in order to balance its elegance with scalability. The circular, green "helix" ornament was re-rendered from scratch and adapted into three different versions for flexibility at smaller display sizes, using progressively heavier stroke weight as scale is reduced.

We also created several solid-fill-color versions, as well as black and white variations.

Photography

Staging, Lighting, Photography, Editing

For consistency of quality and brand style, nearly all photography on the new website was shot specially for the project.

All photography was shot and initially edited in RAW format.

Product Photography – When planning and capturing the product images, we relied entirely on natural lighting as the most appropriate choice for communicating the "natural, healthy, and wholesome" values of the Lorraine's Cakes brand. The staging was carefully arranged with decorative props, backgrounds, and time of day on location for lighting.

Portrait Photography – It was also important to show the friendly humans behind the brand, as the company's story is so closely tied to Tyler and his grandmother Lorraine. We staged and lit a few simple portraits of the two founders with a counter full of their products, right in Lorraine's own home kitchen, where the first Lorraine's Cakes recipes were created. We selected just one shot for the website.

Macro Photography – With the very goal of inducing the inter-sensory experience of craving, these enticing, magnified cake and frosting textures were captured using macroscopic photography—perfect for abstract backgrounds throughout the website.

‍
‍Special-case Shots & Advanced Edits – In a couple cases, special shots and edits were custom-tailored to achieve conceptual goals in the website design: (top) in the Commitments section, the mostly empty dish on the tablecloth was purpose-shot to imply that a cake was shared and fully devoured; and (bottom) on the Story page, top-down shots of products were carefully clipped from their backgrounds, with realistically color-tinted shadows artificially rendered, so they appear to rest in three dimensions over the pure white backdrop.

(Right) Each of these images are implemented with a subtle, parallax-background animation technique: scrolling at a slower rate than the "foreground" content, causing them to appear further away, thus evoking a sense of depth.