Home Styling Website

Home Styling
Website

A freelance project creating a website and brand identify for a company taking a thoughtful approach to home staging.

Skills

UX Research

UX Research

Visual Design

Visual Design

UI & UX Design

UI & UX Design

Tools

Figma

Photoshop

Procreate

Figma

Adobe Photoshop

Procreate

Figma

Adobe

Adobe Photoshop

Procreate

Client

Wykeham Home Styling

Wykeham Home

Styling

Wykeham Home Styling

Project

4 months (part-time)

4 months (part-time)

Images showing clipped mock-ups of the home page and portfolio page

Goals

How can we show home sellers the function of the home styling business and demonstrate the value of the service.

How can we show home sellers the function of the home styling business and demonstrate the value of the service.

How can we show home sellers the function of the home styling business and demonstrate the value of the service.

How can we show home sellers the function of the home styling business and demonstrate the value of the service.

The business goal was to create a professional website that educates home sellers about home styling, showcasing its benefits through clear explanations, testimonials, and a portfolio of work. By combining engaging content with a beautiful portfolio of projects, the site demonstrates expertise and makes the service accessible, positioning the business as a trusted solution for styling needs.

Limitations

  • Budget Restrains shaped the of the research conducted, leading to a narrower approach that foregrounded competitors research and a lean set of user interviews.

  • Time Restrains meant that a selective approach was taken to the empathise and define phases of the project, omitting certain UX Research which could have deepened our understanding of the user profile.

  • Client Expectations shaped the direction of the project, leading to a beautiful portfolio website to meet their needs.

Outcomes

Visual Identity

Full Service Graphic Design

Website Design

Process

The UX Design process with Empathise, Define, Ideat, Prototype, and Test steps described
The UX Design process with Empathise, Define, Ideat, Prototype, and Test steps described
The UX Design process with Empathise, Define, Ideat, Prototype, and Test steps described

Interviews Key Findings

Clear Services

Interviews revealed that some participants did not know what home styling was and were unsure how the service worked.

Difficult Feelings

Interviews showed that participants may be under stress when seeking home styling advice as the need to sell their home swiftly.

Interviews showed that participants may be under stress when seeking advice as the need to sell their home quickly.

Price Sensitivity

Price of service was a major concern for out test users and directly impacted how they interacted with the service.

Research

Illustration showing the user journey and a table comparing the competitor UI

Key Takeaway

Competitors establish trust with their users through elegant UI, sophisticated visual design, and a streamlined website structures that emphasises large, high-quality photographs.

Competitors establish trust with their users through elegant UI, sophisticated visual design, and a streamlined website structures that emphasises large, high-quality photographs.

Competitors establish trust with their users through elegant UI, sophisticated visual design, and a streamlined website structures that emphasises large, high-quality photographs.

Design System

Exerts from the simple design system showing the system colours and various button states.

Wireframes

1.

Use simple information architecture to allow users to navigate the site with ease.

2.

Prioritise visual design to reflect the function of the business as a visual styling business.

3.

Keep features to a minimum as the website is primarily a portfolio with limited need for complex features.

Website wireframes (landing page, mobile home, portfolio page, services)

High-Fidelity Mockups

Final website mock-ups (landing page, portfolio project, portfolio home, and contact page)

Working Prototype

Video showing the working prototype of the desktop website

Visual Identity

Typography

The serif typeface adds a touch of sophistication with its subtle curves, introducing a whimsical yet refined character. The sans-serif typeface balances the design, ensuring readability and a contemporary feel that keeps the branding professional. The combination of serif and sans-serif fonts creates a visual dynamic that is both engaging and structured, reinforcing the brand’s blend of creativity and professionalism.

Colour

These brand colours were carefully selected to create a harmonious palette that evokes a connection to nature while maintaining a refined, professional appeal. Dark Earth grounds the palette with stability and warmth, while Sea Spray encompasses wild waters and fresh air. The Soft Linen connects the palette back to the idea home and the core of the business.

Logo

Nature-Inspired: The incorporation of a leafy branch represents a strong connection to nature, reinforcing the brand’s focus on soft and friendly home styling. Structure & Stability: The minimalist house outline conveys professionalism and reliability, ensuring the brand is perceived as both professional and trustworthy, while visually indicating the purpose of the business. Balance & Harmony: The blend of natural elements with clean lines symbolises the intersection of nature and architecture, aligning with the business’s mission of creating beautifully styled homes.

Retrospective

Key Learnings

1.

Adapting Design to Client Vision

Balancing the client’s aesthetic preferences with effective design principles.

2.

Scalable Design Systems

Ensure the visual identity and website elements are adaptable for future use and growth.

3.

Manage Client Collaboration

Use communication, feedback, and approvals effectively to maintain project momentum.

4.

Brand Storytelling

Translate the client’s values and personality into compelling visual and written content.

5.

Scope Management

Navigating project constraints to deliver high-quality results within deadlines.

6.

Delivering Editable Assets

Providing the client with outcomes for independent use.

Project Status

The project has been paused until further notice.

The project has been paused until further notice.

The project has been paused until further notice.