Back to Projects

3D Model

Subtitle

Role

Services

Category

Category

Clients

Client

Modern MacBook Pro mockup displaying "DROP DESIGN YOUR" text on screen.

This travel blog website is built for a passionate traveler to share stories, photos, and travel tips. It features an engaging homepage, categorized blog posts, an interactive map, and an Instagram feed integration. The layout emphasizes readability and visual storytelling, making it a great platform for building a personal audience.

Process:
  • Designed immersive layouts for blog articles and galleries.

  • Integrated social sharing and subscription features.

  • Optimized for readability and mobile browsing.

Result:

Boosted organic traffic by 45% and improved reader engagement.

First Things First…

Check out this Room Planner sizzle reel, to get a quick sense of the product.

Chapter 1 — The Merge

When I joined, RoomPlanner existed as two distinct modes stitched together by a single button. Blueprint Mode was a 2D top-down floor plan tool. Design Mode was a 3D environment where products were placed, styled, and purchased. Switching between them meant a complete visual and contextual reset — different canvas, different navigation, different mental model. The unifying principle was straightforward: keep the 3D room persistent across both modes. Blueprint Mode and Design Mode became Floor Plan and Design — persistent tabs in a top navigation bar, always visible regardless of where you were in the experience. Switching modes no longer felt like leaving — it felt like changing tools. Because RoomPlanner is a whitelabel platform, every structural decision had to be brand-agnostic by default and brand-expressive through theming — working as fluently in B&Q's color system as it did in Howdens'.
When I joined, RoomPlanner existed as two distinct modes stitched together by a single button. Blueprint Mode was a 2D top-down floor plan tool. Design Mode was a 3D environment where products were placed, styled, and purchased. Switching between them meant a complete visual and contextual reset — different canvas, different navigation, different mental model. The unifying principle was straightforward: keep the 3D room persistent across both modes. Blueprint Mode and Design Mode became Floor Plan and Design — persistent tabs in a top navigation bar, always visible regardless of where you were in the experience. Switching modes no longer felt like leaving — it felt like changing tools. Because RoomPlanner is a whitelabel platform, every structural decision had to be brand-agnostic by default and brand-expressive through theming — working as fluently in B&Q's color system as it did in Howdens'.

Chapter 2 — Decking

Decking was the first major feature built on the unified platform — and deliberately the hardest one. Lowe's and Home Depot both wanted outdoor planning capability. Internally, we saw it as a proof of concept: if the new architecture could handle decking, it could handle anything. Every other RoomPlanner application lived on a single floor plane. Decking introduced elevation changes, multi-level structures, and stair logic that didn't exist in our other applications. The core design challenge was merging drawing, editing, and spatial decision-making into a single unified experience — one where users could freely move between layout thinking and design thinking without hitting a mode wall. The stair system was where that challenge was sharpest. Riser count, tread depth, the relationship between deck height and stair run — all of it had to be configurable by a consumer with no architectural knowledge, without surfacing the underlying complexity. It held up. Client reception from Lowe's and Home Depot was strong. SUS score: 4.8 / 5.
Decking was the first major feature built on the unified platform — and deliberately the hardest one. Lowe's and Home Depot both wanted outdoor planning capability. Internally, we saw it as a proof of concept: if the new architecture could handle decking, it could handle anything. Every other RoomPlanner application lived on a single floor plane. Decking introduced elevation changes, multi-level structures, and stair logic that didn't exist in our other applications. The core design challenge was merging drawing, editing, and spatial decision-making into a single unified experience — one where users could freely move between layout thinking and design thinking without hitting a mode wall. The stair system was where that challenge was sharpest. Riser count, tread depth, the relationship between deck height and stair run — all of it had to be configurable by a consumer with no architectural knowledge, without surfacing the underlying complexity. It held up. Client reception from Lowe's and Home Depot was strong. SUS score: 4.8 / 5.
Silver MacBook Air mockup open on a white pedestal.

Chapter 3 — Ceilings

Ceilings started as a single client request. Once built, it rolled out across the platform. The challenge was that users had never had to think about the ceiling before. It was always implicit — a byproduct of wall height. Making it an active design surface meant introducing a mental model that didn't exist anywhere else in the product: extruding a plane from the top edge of a wall and transforming it from there. The design challenge was finding the right balance between accessibility and power. An MVP ceiling tool is easy to learn but limiting. A fully customizable one handles complex multi-plane scenarios — vaulted sections, angled drops, intersecting geometries — but only if users can understand how individual planes relate to each other holistically. The solution had to do both: give users just enough individual control over each plane, while handling the hard part — calculating seams along collisions between planes — automatically. The placement of Ceilings within the navigation was a contested decision. My recommendation — supported by an IA card sort and tree test run by our UX researcher — was to house it in the left nav alongside other contextual tools. It shipped as a top-level tab instead, a call made above the design team. The research that followed validated the original recommendation, and a navigation correction is in progress.
Ceilings started as a single client request. Once built, it rolled out across the platform. The challenge was that users had never had to think about the ceiling before. It was always implicit — a byproduct of wall height. Making it an active design surface meant introducing a mental model that didn't exist anywhere else in the product: extruding a plane from the top edge of a wall and transforming it from there. The design challenge was finding the right balance between accessibility and power. An MVP ceiling tool is easy to learn but limiting. A fully customizable one handles complex multi-plane scenarios — vaulted sections, angled drops, intersecting geometries — but only if users can understand how individual planes relate to each other holistically. The solution had to do both: give users just enough individual control over each plane, while handling the hard part — calculating seams along collisions between planes — automatically. The placement of Ceilings within the navigation was a contested decision. My recommendation — supported by an IA card sort and tree test run by our UX researcher — was to house it in the left nav alongside other contextual tools. It shipped as a top-level tab instead, a call made above the design team. The research that followed validated the original recommendation, and a navigation correction is in progress.
Silver MacBook Air mockup open on a white pedestal.

Chapter 4 — Mobile

The desktop RoomPlanner experience was built for someone who sits down with intention — opens a browser, starts a project, spends time. Mobile is a different consumer entirely. They're in a store, or on a couch, or killing ten minutes. The interaction model that works for one doesn't work for the other, and a scaled-down version of the desktop wasn't going to cut it. The core thesis was making constrained feel user-driven. Mobile planning tools have hard limits: smaller screens, touch interactions, backend constraints on what can be configured in a lightweight session. The design response wasn't to expose those limits — it was to sequence around them. Choices were reordered to front-load the decisions users care most about. Progressive disclosure kept the interface from feeling overwhelming. The flow was engineered to feel like flexibility even where the system was tightly bound. I designed the end-to-end mobile consumer journey in Figma — room shape selection, kitchen configuration, product styling, asynchronous collaboration tools. I prototyped. We tested and validated with end users.
The desktop RoomPlanner experience was built for someone who sits down with intention — opens a browser, starts a project, spends time. Mobile is a different consumer entirely. They're in a store, or on a couch, or killing ten minutes. The interaction model that works for one doesn't work for the other, and a scaled-down version of the desktop wasn't going to cut it. The core thesis was making constrained feel user-driven. Mobile planning tools have hard limits: smaller screens, touch interactions, backend constraints on what can be configured in a lightweight session. The design response wasn't to expose those limits — it was to sequence around them. Choices were reordered to front-load the decisions users care most about. Progressive disclosure kept the interface from feeling overwhelming. The flow was engineered to feel like flexibility even where the system was tightly bound. I designed the end-to-end mobile consumer journey in Figma — room shape selection, kitchen configuration, product styling, asynchronous collaboration tools. I prototyped. We tested and validated with end users.
Portfolio project image