WAIKAHE ART & DESIGN

TIME FRAME
1 Month
PROJECT TYPE
UX/UI Designer
SCOPE
Research, UX/UI, Prototyping, Testing
PROJECT OVERVIEW
REFINING THE VISION
jump to prototype
down arrow

Waikahe Art & Design is an interior design studio founded by Anne Catlin in Kailua-Kona, Hawaii. Though the business is just a few years old, it has grown quickly to meet the high demand for services on island. 

The current website is the main point of leads for new clients, but it was assembled quickly during fledgling days. It does not reflect the full vision or scope of services the owner wishes to promote.

In essence, there may be plenty of wind for sailing, but without adjusting the sails, her business is blown in too many directions.

Waikahe's service offerings are unique— almost too unique
Unique services need good storytelling. Waikahe offers custom art and furniture services in addition to full interior design services. They also host creative workshops, have a retail store, and a materials library open to the public by appointment. The business components work harmoniously together from the back end, but the average user visiting the website isn’t able to understand the full scope of services available to them.  Waikahe currently gets a lot of full service design clients, but ideally wants more custom art and furniture clients.
The existing website doesn't target an ideal client
Waikahe is currently booked up with full service interior design clients. However, Anne Catlin, the founder, is the only designer on staff and her time and attention are limited. Instead of appealing broadly to different kinds of clients, as was the strategy in early business days, Anne wants to appeal to a desired client, one that engages her specific aesthetic. If she has to work (she has to), she wants to enjoy what she’s creating and who she’s creating with.
The essence of Waikahe's aesthetic and process is missing
The current website does not accurately reflect the refinement of Waikahe’s design work and process. As Anne Catlin’s professional background is in the arts, her own design process is artistic in nature. She is inspired by design as a means of living a more nourishing and meaningful life. In addition to beautiful images of her designs, Anne wants to add a travel and design blog so users can engage with inspiring philosophies and experiences in addition to project images.
PROJECT OVERVIEW
WHAT'S IN A NAME?

In order for this story to start taking shape, I first needed to understand the building blocks of interior design websites. What is the story people expect and want?



The question Shakespeare almost asked:

"What's in an interior design website?"

I surveyed the websites of all local competitors to Waikahe and successful examples from the mainland. I also began user research to understand what makes a successful interior design website.

USER RESEARCH
WHAT MAKES A SUCCESSFUL INTERIOR DESIGN WEBSITE?
Research Goal

Gather insights from users about their experiences and expectations when visiting interior design websites, particularly those that have multiple service offerings. What are the key elements that make an interior design website successful?

Research Objectives
  • Identify the key features and content users expect from an interior design website
  • Determine the strengths and weaknesses of Anne's current website from a user's perspective.
  • Discover elements from successful interior design websites that can be incorporated into Anne's site.
  • Understand how users perceive and navigate websites that offer multiple services, such as interior design, art, custom furniture, and online retail.
Research Methods
  • Competitive analysis to study existing products
  • User interviews to gain insights from iphone users
Competitive Analysis

Waikahe offers some of the most comprehensive and custom list of services on island. The other most adept interior design business in town, Roost, focuses their website on homegoods and furniture retail. Looking more broadly at examples of interior design websites on the main land, Hommeboys was the best website to tell story with UI, employing material textures and rich colors to convey the feeling of their work. The best site organization came from Avery Cox Design, which used a really simple grid to contrast vibrant imagery.

user interviews
CLARIFYING SERVICES
Interviewees
  • 3 participants
  • Online and in person
  • Industry and non-industry users
  • Women and Men
  • Age range 33–70

Research confirmed that Waikahe's extent of services was not easy to grasp. However, users understood the eclectic taste which Waikahe's uniquely offers and found this positive. In general, users were found to expect one thing from interior design websites— interior design. If there are other offerings, they needed to be made clearly distinct.

affinity mapping link
arrow
“I think her services page could be a bit more clear. I got a sense that she does multiple things but I wasn’t sure about which was most important.”
—Samantha, 33
a silhouette of a woman with long hair
USER INTERVIEWS

KEY POINTS

For navigation, users want to see what they expect to see

For services, users want to understand how separate components work together

For project showcase, users wanted more info about process and materials

Key Insight:

Users visiting interior design websites expect them to focus entirely on services. If the designer offers anything else, it should be clearly indicated, possibly in its own section.

Key Insight:

Since all users visit the projects/portfolio section first, project images are the most effective way to convey who the interior designer is and what they do. Users learn about the projects before learning about the designer.

user personas

Based on themes found in user interviews, user personas were distilled to capture the different clients engaging with Waikahe's services, each service with varying degrees for barriers to entry.

ideation

HOW MIGHT WE

How might we structure Anne's website to seamlessly reflect her business, integrating travel and art into her branding and services?

How might we present projects on Anne's website in a manner that makes users feel inspired to explore and engage with her services?

ideation
BRAINSTORMING

Given the research and how-might-we statements, ideation techniques were used to form as many solutions as possible. Techniques included top of mind, analagous inspiration, and playing with opposites. Below are a select few from the brainstorming session.

Use navigation menus that are intuitive and reflect the different aspects of Anne's business, such as "Artwork," "Travel Experiences," and "Services."

Incorporate storytelling elements throughout the website to further emphasize the connection between travel, art, and Anne's services.

Utilize storytelling techniques to convey the story behind each product and its significance, enhancing its appeal to potential clients.

Use whitespace effectively to reduce clutter and create a sense of spaciousness, enhancing readability and navigation.

Design a homepage that seamlessly integrates elements of travel and art, perhaps using subtle background images or motifs that evoke a sense of wanderlust and creativity.

Incorporate whimsical animations on top of project photos to give a sense of Anne’s work process and make photos feel alive

Incorporate a simple navigation with a clean and clutter-free layout, that highlights subjects of travel and art with whimsical touches

Create a services page that feels much like an agency’s page with dynamic representation of options, scope, and timeline

Expanding a solution

A webpage that incorporates details that make the entire feeling of the webpage bespoke, much like Waikahe's services. However, we also needed to simplify her services. I diagrammed her multi-faceted business model to understand which parts of the story fit together for early site navigation. Since Anne Catlin's time is limited, I want to pay special attention to targeting her passive streams of income - Materials Rep and Homegoods Retail.

ideation
SKETCHING AND WIREFRAMING

To begin structuring the site, I first organized all the necessary components and grouped them under relevant navigation headers. Using this sitemap as a guide, I sketched low-fidelity mockups to lay out the overall structure. Given the graphic-heavy nature of the site, I made sure these sketches felt like 'figure-ground' drawings, emphasizing the relationship between content and negative space. Once the basic layout was established, I transitioned to mid-fidelity designs, which added more detail to each section and allowed me to test the effectiveness of the structure from the initial sketches.

Product roadmap

Since Waikahe's main challenge was presenting her interior design services, phase one focuses on showcasing her projects, offerings, and story. The shop, being secondary, is planned for phase two. Originally, the journal was also set for phase two, but it became essential for storytelling, making it part of phase one as the minimum viable product.

INTERFACE DESIGN
PROTOTYPING

To improve user understanding of Waikahe's services, I added a new 'Services' section on the homepage. It highlights our two main offerings: 'Full Service Interior Design' and 'Custom Art and Furniture.' Each service uses drop-down menus for further details, providing clarity at a glance while keeping the page organized.

Research shows that users are drawn to Interior Design websites that inspire awe and possibility. While the site uses a structured grid, the project pages break away with an asymmetrical, free-flowing image showcase. Minimal text highlights philosophy and process, inviting users to envision their own design journey.

To strengthen the inspirational aspect of Waikahe's brand and unify her designs into cohesive stories, a new UI element with journal entries was introduced. The left side offers slides to explore more, while the right features an in-place scroll that updates with each journal entry.

To match the polish and expertise of Waikahe’s practice, small hand-drawn icons were added throughout the site to evoke whimsy and individuality. Each card reveals a different unique icon on hover, offering users a sense of wonder as they explore and discover.

Waikahe's business goals align with user needs at the Materials Library. Given the limited quality material resources on the island, she aims to expand as a reseller. To support this, a materials library preview was added to the website, encouraging users to purchase materials from Waikahe, with or without their design services.

TESTING

ARE USERS DELIGHTED?

The focus of testing was to asses the ease of navigation, clarity of services, presentation of projects, and overall user satisfaction.

INTERFACE DESIGN
USABILITY TESTING
Interviewees
  • 3 participants
  • Online and in person
  • Industry and non-industry
  • Women and Men
  • Age range 33–70
Task flows
  • Find info for services
  • Explore a project that inspires you
  • Find info for custom art & furniture
  • Find info for the upcoming workshop
  • Find info for the materials library
Testing Goals
  • Navigation and UX: are the users able to quickly find information related to services, materials, and projects
  • Services and Offerings: are the users easily able to understand the variety of services and find info for upcoming creative workshops
  • Mobile Experience: is the mobile experience seamless with the desktop experience and easy to understand and navigate
Results summary

User testing provided key insights for enhancing user experience. Participants highlighted the need for easier contact access, leading to the addition of a "Contact" link in the main navigation. Users also wanted more context for materials in the Materials Library, prompting the inclusion of photos showing real-world applications. Large images on the Homepage and Project pages were reduced in height to encourage scrolling, as some users missed further content. Lastly, relocating Art & Home Goods information to the Shop page improved clarity. These changes emphasized the importance of clear navigation, contextual imagery, and an effective content hierarchy.

Revision: contact link in navigation

A "Contact" link was added to the site navigation. Two out of three participants expressed the need for easier access to the Interior Designer's contact information. Although contact links were already dispersed throughout the site, adding a Contact button in the main navigation, based on user feedback, provides a quicker and more convenient access point.

Revision: Photos in materials library

Secondary photos, activated on hover, were added to each material, allowing users to catch a glimpse of the materials as they appear in actual applications. This section is meant to be a sampler of the materials available in the Waikahe Materials Library, encouraging users to book an appointment to view them in person. All three participants mentioned wanting to see the materials in use, as just showing the material samples felt too much like a teaser.

Revision: Homepage and Project Page Images

The large images above the fold on the Homepage and Project pages were made shorter. Two of the participants did not realize they needed to scroll down past the images, as the images took up too much of the screen and gave the impression that they were the entirety of the webpages. The images were shortened to encourage users to scroll and explore more of the content.

Revision: Art & Home Goods Retail Info

The Art & Home Goods retail information was moved from the Studio page to the Shop page. Although retail is available both online and in-store, after discussing with the client, we decided to prioritize the online retail experience. The Shop page is not fully built out in the prototype, as the main focus of the initial prototype was to establish clarity and a hierarchy of information for the services and the multi-faceted business model.

Final Navigation and High-fidelity Wireframes
CONCLUSION
LESSONS & NEXT STEPS

This project was ultimately about storytelling. User research showed that users wanted easily digestible information and to feel inspired by possibility. By aligning business goals with refined messaging and visuals, the new website captures Waikahe's direction and improves business performance. While the next step is to build out the online shop, which isn't a major sales driver, the priority remained focused on messaging.

tools
Figma, Adobe Illustrator, Adobe Photoshop