Overview

Archer & Olive is a premium stationery brand known for thoughtfully designed notebooks, planning tools, and creative supplies. Their products emphasize craftsmanship, creativity, and mental wellness, and their audience is deeply loyal and design-savvy.

While the brand and products were already strong, the website and broader visual system did not reflect the maturity or quality of the brand. This project was not just a redesign, but a strategic evolution of Archer & Olive’s brand expression and digital experience.

Prismfly partnered with Archer & Olive to refine their visual system, modernize the site experience, and build a scalable foundation for product launches and long-term growth.

‍

‍

The Challenge

Archer & Olive needed a site that would:

• Match the premium quality of their products
• Feel calm and intentional
• Support frequent drops and seasonal shifts
• Improve usability, accessibility, and conversion
• Scale without increasing ongoing maintenance or dev dependency

Their previous site struggled with cohesion. Products felt disconnected, the experience felt busy, and merchandising for repeat customers, who make up the majority of their audience, was harder than it needed to be. The site also had accessibility limitations that made navigating and shopping more difficult for some users.

‍

‍

The Brand

With the logo remaining unchanged to preserve brand recognition, Prismfly focused on refining how the brand shows up everywhere else. This included:

• Typography
• Color usage (including flexible light and dark applications for seasonality)
• Spacing and hierarchy
• Layout balance across dense product catalogs

A key goal was ensuring the visual system felt consistent but flexible, able to evolve with seasons and drops without feeling disjointed.

Design decisions were meticulously validated not just in website mocks, but across graphics, thumbnails, and potential future brand applications, ensuring the evolution could extend beyond the site itself.

‍

‍

New Framework

We built the site using an modular framework to strike a balance between:

• Elevated visual storytelling
• Modular flexibility for launches and merchandising
• Long-term scalability without custom rebuilds

This framework allowed design and development to collaborate earlier and more fluidly.

This reduced friction, improved alignment, and let both teams focus on experience and functionality, not recreating fundamentals.

‍

‍

Design Highlights

• Balanced layouts that accommodate a large catalog without overwhelming users
• Flexible color systems that can shift seasonally while remaining on-brand
• Purposeful sections that contribute to storytelling or conversion
• Brand-driven details like: Diagonal washi tape treatments, Sticker section, Cats subtly inetgrated into the footer
• Playful moments that enhance brand personality without hurting usabillity

These elements don’t exist to “boost conversion” directly, but they build trust, delight, and emotional connection with the brand.

‍

‍

‍

Developement Decisions that Scaled

• Extensive use of Horizon blocks and groups to empower the client to self-manage
• Custom navigation menu built to support nested, flexible content structures
• Avoided third-party JS libraries in favor of native solutions to improve performance
• Dynamic PDP architecture using metafields and metaobjects instead of multiple templates
• Automatic product sorting to reduce manual merchandising effort
• Reusable blog templates to streamline content creation

Performance & Maintenance

• Implemented Prismfly’s Speed Package to improve perceived performance and site responsiveness
• Reduced technical debt by strategically extending existing theme components
• Built flexibility directly into settings to avoid future dev bottlenecks

‍

Key Outcomes

• A calmer, more premium shopping experience aligned with the brand’s mission
• Improved product discovery through connected PDPs and sibling products
• Faster shopping for repeat customers during high-traffic drop days
• A site architecture that empowers the Archer & Olive team to move quickly and independently

‍

What This Project Represents for Prismfly

This project is a clear example of how Prismfly approaches redesigns:

• Start with systems, not just pages
• Design and development working together, not in sequence
• Build for what the client will need next, not just launch day
• Prioritize flexibility, longevity, and brand integrity

From small details like viewport-specific button visibility to larger systems like color schemes and reusable presets, the goal was simple: remove future roadblocks before they exist.

‍

‍

Looking Ahead

With a refined brand expression and a flexible Horizon foundation in place, Archer & Olive now has a site built to evolve. It supports new collections, campaigns, and creative ideas without constant rework.

This project was an investment in the brand’s next chapter.

‍