top of page
TLR Project Landing page.png

Goal

​
Initially, our goal was to redesign Texas Legacy Realty’s existing Squarespace website to improve usability and consistency. However, after completing a heuristic evaluation, we realized that the platform’s limitations restricted flexibility and responsiveness.
To build a scalable, customizable, and device-friendly experience, we decided to rebuild the website entirely using WordPress.

​
 

Project Context

  • ​​Title: Texas Legacy Realty Website Rebuild

  • My Role: Digital Designer

  • Process: Lean UX 

  • Project Timeline:
    The project took three months, covering end-to-end design from research and structure planning to responsive UI design across desktop, tablet, and mobile.

UNDERSTAND USERS: HEURISTIC REVIEW & THINK-ALOUD TEST​​

​

 

Began by evaluating the existing Squarespace website using heuristic principles and short user testing sessions with a think-aloud method.

 

This helped me identify usability issues and observe how users naturally navigated the site, revealing confusion points and helping define priorities for improvement.

​

TLR Project Evaluation.png

DEFINE VISUAL DIRECTION: COMPETITOR ANALYSIS & MOODBOARD​

​​

​

Before moving into design, I conducted competitor analysis to study how other real estate companies structured their websites, presented property information, and guided user flow.

 

From there, I created a moodboard to define a consistent visual tone that aligns with Texas Legacy Realty’s brand and user expectations in the market.

​

TLR Project Competitor Analysis + Moodboard.png

STRUCTURE THE EXPERIENCE: SITEMAP & FILTER LOGIC

​​

 

Based on insights from user testing, I designed a sitemap to organize the overall website flow and built a clear filter structure for property searches.

 

 

Many users found the original search experience confusing, so this step focused on simplifying the decision path and improving findability through logical grouping and intuitive filtering.

​

TLR Project Sitemap + Filter Structure.png

VISUALIZE THE FLOW: LOW–MID FIDELITY WIREFRAMES

​​​​

​

Developed low- to mid-fidelity wireframes to explore layout ideas, define content hierarchy, and visualize how users would interact with different sections.

​

This step helped identify repeated components and validate which structures best supported both content goals and user needs.

​​

TLR Project Low-Mi Fidelity.png

GET TO THE DESIGN SYSTEM: COLOR, TYPOGRAPHY & GRID FOUNDATION​

​

 

Once the wireframes were approved, I created the design foundation.

 

 

These core elements established consistency and scalability across the website, ensuring the design worked seamlessly across devices.

​

TLR Project Foundation.png

BUILDING CONSISTENCY: COMPONENT LIBRARY DEVELOPMENT

​

​

Started building reusable components from small units like buttons and cards to larger sections such as property listings and navigation bars.

 

This modular approach improved efficiency, consistency, and collaboration with developers during implementation.

​

TLR Project Components.png

FINAL DESIGN: RESPONSIVE LAYOUT & INTERACTIONS

​

​

Combined all foundations and components to produce high-fidelity mockups in Figma, refining visual details and interaction patterns.

TLR Project Hi-fi.png

Explore the final design that brings clarity and consistency to every interaction, creating a seamless browsing experience for users.

 

The final design captured the responsive behavior across screen sizes and reflected the polished, trustworthy identity of the Texas Legacy Realty brand.​

​

  • Instagram
  • Linkedin

© 2025, Bomi Han All Rights Reserved

bottom of page