Website Development Case Study for

Bone and Blossom

Clients Business Background

Bone and Blossom is an intimate boutique that promotes sexual health, wellness, and inclusivity. It aims to provide a safe, supportive environment where adults can explore their desires, access quality products, and feel empowered through education and guidance.

Project Objectives

This project aims to create an intuitive and discreet online store that supports Bone and Blossom’s mission and overcomes the challenges of their limited digital presence. The project focused on the following key objectives:

Build a website that reflects the same comfort, privacy, and trust customers feel when shopping in person.
Design a clean, easy-to-navigate interface that helps customers quickly find what they need without confusion or overwhelm.
Create a discreet browsing and checkout experience, allowing users to explore products confidently and feel supported throughout.

Planning

A strategic approach was taken to ensure the website reflected Bone and Blossom’s brand and met customer expectations.

Discovery Session

Conducted an in-depth discovery session with the client to understand their brand voice, customer demographics, and sensitivity around the nature of their products. This helped shape the tone, visuals, and structure of the website.

Competitive & Market Research

We analyzed competitor websites in the sexual wellness and boutique retail space to identify industry standards and opportunities for differentiation, particularly regarding UX, discretion, and educational resources.

User Experience (UX) Mapping

Based on customer personas and shopping behavior, we mapped out key user flows—from landing on the homepage to completing a purchase. Priority was placed on privacy, clarity, and a seamless browsing experience.

Content & Messaging Strategy

We developed a content plan that balanced product promotion with educational support and empowerment. The language used aimed to be respectful, inclusive, and informative.

Design Wireframes & Prototyping

Initial wireframes were created low-fidelity to focus on layout and functionality, followed by high-fidelity mockups incorporating Bone and Blossom’s brand colors, imagery, and typography.

Development

Once the designs were approved, we moved into development using WordPress and Elementor. Emphasis was placed on performance, mobile responsiveness, and secure e-commerce integration. Custom sections were built to highlight educational content, while WooCommerce was tailored to provide a discreet and intuitive shopping experience. We also integrated analytics and SEO best practices to ensure long-term discoverability.

Challenges I Faced

Importing Product Data

Importing a large number of products, including variations and custom attributes, was time-consuming and needed multiple formatting changes to work properly with WooCommerce.
Performance Optimization
The site started with good load times, but as more products were added, performance slowed due to large images and unoptimized scripts. I improved speed by applying caching, image compression, lazy loading, and script deferral.
Plugin Conflicts

Several essential plugins for SEO, performance, and design clashed with each other, resulting in broken layouts or missing functionality. I resolved this by testing in a staging environment, replacing unstable plugins, and ensuring compatibility with the current WordPress version.
Elementor Crash (Edit in Safe Mode)

Elementor frequently crashed during edits, forcing me to use Safe Mode. The issue was traced to memory limits and third-party widget conflicts, which I resolved by increasing PHP memory and selectively disabling conflicting widgets during edits.

Elements

Typography

Inter

Offers a clean, contemporary sans-serif style that ensures excellent readability, making it ideal for body text and digital interfaces.

Lora

Classic serif character, adds a touch of sophistication and warmth, giving headlines and key elements a refined, organic feel.

Color Palette

Results