Toller: An online store for ceramics*

Role: *

UX/UI Design, Brand Design, Squarespace Developer

Year: *

2024

Platform: *

Squarespace


About Toller

Toller is the soulful ceramics brand of Maggie and Jane — a creative duo crafting each wheel-thrown and hand-built piece with intentionality and care. They needed a quiet, soulful website that would not only showcase and sell their limited-edition pieces but also invite visitors into the warmth of their friendship-driven studio practice.

The Mission

Launch a user-friendly shop where fans could easily browse each artisan piece and feel connected to the creators.

Invite visitors into their story, sharing the making process, duo dynamic, and the soulful spirit behind Toller.

The Home Page

Toller is the soulful ceramics brand of Maggie and Jane — a creative duo crafting each wheel-thrown and hand-built piece with intentionality and care. They needed a quiet, soulful website that would not only showcase and sell their limited-edition pieces but also invite visitors into the warmth of their friendship-driven studio practice.

View the live site ➝

Competitor & Industry Research

Step 1: Research & Brand Insight

I began by researching the competitive landscape of handmade pottery, slow living lifestyle brands, and creative friendships. Key patterns emerged:

  1. Authenticity matters: Buyers look for real stories—images of hands at the wheel, portraits of makers, and notes from studio life.

  2. Lifestyle context sells: Showcasing ceramics as part of daily rituals (coffee in the morning, family meals, journaling at dusk) helps customers envision using them.

  3. Community builds trust: Customer galleries, behind-the-scenes glimpses, and occasional studio peeks enhance brand connection.

Taking what I’ve learned

Step 2: Define the Goals

I now understood the success of the website would be in balancing commerce with community. From insights, I created actionable website objectives:

  1. Create a responsive ecommerce experience for browsing and purchasing one-of-a-kind and small-batch ceramics.

  2. Weave in Maggie and Jane’s friendship story, highlighting the two-hand approach to craft.

  3. Include lightweight content—studio journal, making photos, and a mailing list form—to nurture a growing community.

Competitor & Industry Research

Step 3: Design & Build

I could now approach the design phase with a clear and defined plan and made sure to keep the user needs and the goals of my client at the core of all my decision making. Here are the key highlights from the design:

  1. Emotion-first homepage: Full-screen hero with one of their mugs in use, overlaid with the tagline: “Handmade ceramics with soul”—inviting users deeper.

  2. Soft, tactile brand identity: Warm earth-tones reflecting clay colors, paired with clean typography to balance craft and clarity.

  3. Product pages optimized for purchase: High-quality mockups, clear descriptions, edge-case “sold out” states, and easy cart access.

  4. Story woven throughout: Sections like About the Makers, From the Studio, and occasional Latest Drop seamlessly guide visitors from origin to purchase.

  5. Responsiveness built in: Optimized scroll animations, fluid typography, and gesture-friendly mobile product carousels.

Technical Enhancements:

  • Gallery fade-in effect for scroll-triggered headers using GSAP, creating a tactile, hand-crafted feel.

  • Dynamic gradient text CSS keyed to scroll, invoking clay’s layered textures.

  • Accessibility-first approach: Proper alt text, keyboard navigation, high contrast, and semantic HTML for screen-readers.

  • Client-editable journal: Modular blog skeleton built into Squarespace to let Maggie and Jane journal easily without developer help.

Previous
Previous

Mika

Next
Next

Project Two