heatherwood.
Discover luxury living
CLIENT
heatherwood.
Lead Visual Designer & UX Designer at HZ (Branding & Digital Agency)
Website/Mobile Redesign · Brand Identity · UX Research · Visual Q&A · Design System
ROLE/PROJECT
TOOLS
Figma · Asana · Webflow
TIMELINE
MAY 2022 - MAY 2023
Heatherwood is a family-owned real estate company that has been shaping communities across Long Island and New York City since the 1950s. With over 30 residential and commercial properties, they’re known for creating high-quality living spaces, luxury amenities, and a strong sense of community supported by quality service.
The client’s goal for this redesign was to strengthen their online presence and increase property rentals by enhancing user engagement. They needed a streamlined user experience with intuitive navigation and filtering to help visitors easily find the right property.
As the lead UX and visual designer, my role was to redesign Heatherwood’s website from wireframes to high-fidelity prototypes. I created a cohesive design system, simplified user flows, refreshed visuals and content, and worked closely with stakeholders and developers to bring a seamless, user-friendly experience to life.
OVERVIEW
In New York City, renters spend an average of 1–3 hours a day browsing multiple property websites, often facing information overload, irrelevant or outdated listings, and frustrating search tools. With over 67% of residents living in rental units, property companies need intuitive, visually engaging platforms that not only simplify the search process but also help them stand out to potential renters in this competitive market.
The challenge.
user goals.
Easily find properties by budget, location, lifestyle
Compare listings quickly
Clear floor plans, amenities, and availability
Fast, intuitive filtering
Seamless inquiry flow
business goals.
Increase rental inquiries and conversions
Improve engagement and browsing time
Modernize visual identity
Strengthen brand perception
Improve SEO & mobile performance
search filter - before.
Areas to Address
Primary navigation lacks organization
Search filters are small and very close together, with additional hidden filters
Some icons are confusing or don’t have a strong purpose
Precise locations aren’t shown on the map
No indicators for how many units are available
search filter - after.
Product Improvements
Simplified navigation to promote a streamlined search experience
Clear and intuitive search filters with dropdown menus
Map indicators that show how many properties are within a general area
Clear labels on how many units are available
my approach.
site mapping + identifying.
My team conducted a content audit of all website pages to identify which were essential. Together, we created a site map to visualize what was most important for users and to reorganize information to make the most sense. This step helped clarify how users would navigate between core sections—such as Property Search, listings, About, and Contact—and ensured that every page supported a clear purpose within the broader experience.
wireframing.
I created low-fidelity layouts for every unique page of the Heatherwood website. These wireframes helped me establish a clear information architecture and identify the components needed to support each content type. I collaborated closely with the client and project managers to ensure every section served a meaningful purpose and aligned with business goals. Ultimately, these wireframes became the blueprint for the visual design, structure, hierarchy, and functionality across the entire site.
Just a few of the many wireframes developed for this project.
designing.
I translated the approved wireframes into high-fidelity visuals that reflected Heatherwood’s brand, focusing on clarity, consistency, and a modern, trustworthy aesthetic. I refined typography, color, and component styles to create a cohesive design system that could scale across all pages. Throughout this process, I collaborated with the client to iterate on visual direction and ensure the final designs aligned with both user needs and business goals.
High-fidelity designs based on the wireframes above. The actual full set of designs contained over 100+ pages (including mobile).
prototyping + testing.
I brought the high-fidelity designs to life through interactive prototypes that mirrored real user flows across key pages. I conducted usability checks to validate navigation, content clarity, and overall ease of use, gathering feedback from stakeholders to identify areas for refinement. These insights helped me fine-tune interactions and ensure the final experience felt intuitive, seamless, and aligned with user expectations.
feedback + iterations.
I gathered input from the client, project managers, and stakeholders to identify opportunities for improvement across the design and user flows. I refined layouts, components, and interactions based on this feedback to ensure the experience felt clear, consistent, and aligned with user and business needs. This collaborative, iterative approach helped strengthen the final product and ensured the design was polished, purposeful, and ready for development.
The solution.
We transformed Heatherwood’s website into a modern, user-friendly platform that makes finding a home simpler and more enjoyable. By refreshing the brand’s look and feel, enhancing search and filter tools, streamlining navigation, and building an accessible design system, we created an experience that reflects Heatherwood’s essence and significantly improved user engagement.
