AA Compliance
Waterline Square Website Redesign
Combining the condominium and rental websites, which have different target audiences and completely separate digital presences, into a unified platform that operates smoothly.
My Role
• Researching user patterns on the previous website.
• Wireframing to website visual design
• QA in close collaboration with a development team
Tools
Photoshop, Sketch, Illustrator, Invision, Zeplin, Jira
Team
Agency: The Charles NYC
Creative director, Senior designer, Content strategist, Copywriter, Front-End Developer
About
Waterline Square is a luxury apartment building on the upper west side in New York. It has two different target audiences who are looking for the rental properties and for the condominium properties.
Design Challenge
• The client maintained two target user-specific websites—one for rentals and one for condominiums—which created confusion for users and increased maintenance needs.
• Lack of storytelling to convince potential tenants.
Client’s Request & Our Approach
• Maintain all the pages on the global navigation bar.
→ The client wanted to retain all the sections on the navigation bar, even though we highlighted that some pages have extremely low performance and click rates. To reduce the complexity of the navigation area, our team decided to create dropdown navigation containing images for each section to enhance preformance for each tabs.
• Show all the features of the building to users.
→ We added a scroll-jacking effect to pause users momentarily, allowing them to focus on the properties.
• Clearly and immediately show there are two different products, rentals and condominium residences, when users enter the website.
→ We added two CTAs leading to each residence at the top of the homepage.
Goal
• Creating a consolidated website that accommodates both target users to eliminate digital confusion for users while preserving the distinction in voice and messaging between the rental and condominium products.
• Easy navigation positions the brand to increase leads for both condominium sales and rental leases.
Target Audience
Adults 30-55 with min HHI $250k+
Sophisticated Professionals
Marc / 48
Busy professionals who don’t spend much time at home
Typical employment includes: financial institutions, hospitals, law firms near Columbus Circle
Commuters who spend several nights a week in the city during the week
Not planning to establish permanent roots in Manhattan - drawn to amenities that allow a hassle-free lifestyle
International
Liu / 39
Families relocating temporarily or permanently
Professionals from overseas who are in New York often for work, or relocating full-time
Looking for a convenient location with easy access to all areas of Manhattan
Schools and culture in the immediate area will be an important consideration
Cultured Empty Nesters or Pied-A-Terre
Ellen /55
Established professionals, retirees, or empty nesters
Current Manhattan residents looking to downsize
Currently residing outside the city and need a place for frequent trips to NYC
Well-traveled owns a home in other areas of the country
Looking for a rental with hotel-like amenities
May host family/friend in a second bedroom, so space to host/entertain is of importance
Voice & Tone
Expand how you live.
Home doesn’t have to be just a place to sleep.
It can be the center of your micro-universe, an inspired destination that blends work, play, and rest and leaves you feeling renewed through ambiance, amenities, and community.
Mission: Waterline Square’s aim is to allow consumers to imagine a new way of living – one that expands their idea of what home is and seamlessly dialogues with the inherent contrasts of New York City.
Research
To learn more about the current design system and user flow of the current real estate website, I discovered a few websites that served as a key inspiration in user experience and design to help make this website better.
Constantly checked the hot jar and google analytics on the previous websites to define the user behavior and the user journey.
CONDOMINIUM WEBSITE
Top 4 pages (home, availability, amenities, one waterline square) - 74.2% of page views.
RENTAL WEBSITE
Top 4 pages (home, availability, residences, amenities)- 77.1% of page views
Competitive Analysis
Hudson Yards
Overview:
In the last few years, Hudson Yards has transformed a once-abandoned neighborhood, with businesses, residences, restaurants, bars, and more setting up shop in the area.
Strengths:
High brand awareness; significant PR and buzz
Engagement with cultural figures (Tom Sachs) Well
defined live-work-play proposition
Weaknesses:
Halfway open for business; landmark building not finished but mall, etc established.
While there is awareness of brand, not entirely sure all NY’ers have a consistent impression of what Hudson Yards is.
Haphazard execution of social content (look, tone, feel).
American Cooper
Overview:
American Copper defines their offering through “Ten Reasons” everyone wants to live there – helping them stand out from the rest. Brand is more associated with a lifestyle/way of living than being a residence.
Strengths:
Clear, enticing definition of offering on-site
Clever, insight-driven questionnaire reflective of how the target audience lives
Imagery positions building as in and of the city
Weaknesses:
Points of difference don’t clearly come to life on social
No CM on social to monitor negative comments
Visual consistency is lacking, social tone-of-voice isn’t as well defined as on-site
Related Group
Overview:
Related are a luxury rental group with two NY properties – the Caledonia, and the Eugene – that somewhat align with WSQ’s offerings.
Strengths:
Clear position as development group specializing in luxury rentals
Using social with clear purpose - to show off all properties
Consistent visuals/grid
Weaknesses:
Lack of owned social channels for each property can make it difficult to understand which posts/highlighted offering or event pertain to which property; makes it difficult for residents of each property to feel connected
Generic voice and tone on social
Information Architecture
UI Style Guide
Low-Fidelity Strategy
Easy Navigation
Dropdown navigation bar with image to allow quick navigation between all menus.
Immersive Full Width Building Highlight Gallery
Key Takeaways
Not only the design and visual storytelling but also the voice and tone are also the key elements to enhance the overall aesthetic and for the better user experience.
Data helped a lot with deciding what to focus on and what to emphasize on the design.
