PROJECT OVERVIEW
Website Launch
Hudson — My Home was entering a crowded luxury property management market with zero brand recognition. They needed a website that would instantly communicate premium positioning and generate qualified leads; but I had just 2 weeks to make it happen. No assets. No sitemap. Just a high-level brief and an urgent launch deadline.
I took complete ownership of the experience: assuming user needs through client communications, designing the visual identity, and developing a fully responsive site using React, TypeScript, and Tailwind CSS.
Role
End-to-end ownership
(Design & Dev)
Technology
React
TypeScript
Tailwind CSS
Figma
Cursor
Timeline
1-2 weeks
ASK
Can you create a luxury brand website in 2 weeks that drives conversions, starting from scratch?
Business Goals
1. Brand Credibility
2. Lead Generation
3. Market Positioning
User Needs
1. Trust Validation
2. Service Clarity
3. Easy Contact Process
Target Users
1. High-net-worth individuals
2. Busy professionals
Success Metrics
1. Brand perception feedback
2. Booking form completion rate
IMPACT
Shipped production ready responsive website in 1 week with Design + Dev
​1. Leveraged strategic prompt engineering and modern development stack (React + TypeScript + Tailwind) to reduce engineering time while maintaining premium quality and mobile responsiveness.
​
2. Delivered a complete brand launch website from concept to live deployment, establishing luxury positioning and driving booking conversions through a streamlined user experience.
Watch the end result in the video ^
IDENTIFYING NEXT STEPS
Starting with Constraints, Not Requirements
When I received this project, I had one week, some UX copy, and a branding booklet. That was it. I realized traditional UX processes wouldn't work. There was no time for user interviews, competitive analysis, or iterative testing. I had to make smart assumptions and move fast.
1 week deadline
Concept to live homepage in a single week
Visual Disconnect
Existing visuals didn't read as luxury; typography, spacing, and texture needed complete overhaul
No foundation
No sitemap, no assets, no discovery phase, just a vague brief and email threads
Budget Constraints
Keep engineering costs minimal without sacrificing quality
Strategic Decisions I Made to Move Fast
Rather than waiting for perfect information, I made informed assumptions based on luxury brand principles and moved quickly. Shipping > perfection
Understanding the Audience
35+ high-net-worth users who browse on desktop, expect polish, and prefer curated content over overwhelming options
AI-Assisted Competitive Research
​
Used Claude Sonnet 4.5 to analyze luxury property sites and identify patterns: serif typography, generous whitespace, muted palettes
Fixing the Design System Foundation
​
Replaced Begum with Cormorant Garamond for more weight options
Increased line-height to 1.5 for better legibility
Expanded primary color into tint/shade system
Used Mid-Fidelity Wireframes for Early Validation
Translated UX copy into wireframe variations and got stakeholder feedback early, avoiding costly revisions later in visual design
Validating Assumptions Through Mid-Fidelity
Before investing in high-fidelity design, I created multiple wireframe variations to test different approaches to information hierarchy and trust-building. Each version explored a different hypothesis about what luxury consumers need to see first.
✓ Services must be visible early — Stakeholders immediately flagged the low placement of "What We Can Manage"​
​
✓ Teal palette resonated — Desktop 2's color direction felt premium
​
✓ Accordion services worked — Consensus that expandable format kept page scannable.
Wireframes transformed abstract requirements ("luxury," "trustworthy") into concrete decisions we could all align on.
Trust signals build credibility instantly. Added '500+ homes' social proof to establish legitimacy before users scroll.
Hero imagery showcases the lifestyle outcome, relaxed homeowner, not the service itself.
Quantified credibility metrics (40+ hours saved, 98% satisfaction) translate abstract 'quality' into concrete proof
Accordion pattern keeps services scannable while providing depth for interested users
Cormorant Garamond 32px with 1.5 line-height for elegant, confident headline
Images show real life moments (family time, relaxation, comfort) rather than service screenshots reinforcing emotional benefit over features.
"MyHome Guarantee" card uses brand color to draw attention to risk-reversal offer
DESIGN
Landing Page
With validated wireframes and clear stakeholder alignment, I moved into high-fidelity design. Every visual decision was made to communicate premium quality while maintaining the clear information hierarchy established in wireframes. Here's how I solved the key challenges:
SHIPPED DESIGN
I delivered two-page luxury brand experience, homepage and about page...fully responsive and optimized for conversion.
Live in one week from the initial brief to production deployment.
REFLECTION
What I Learned From This Sprint
-
Constraints force clarity. With only a week and no formal discovery phase, I couldn't afford to overthink decisions. This forced me to rely on luxury brand principles and proven UX patterns rather than getting lost in endless iterations.
​
-
AI is a multiplier, not a replacement. GPT-5 and Cursor accelerated development significantly, but the strategic decisions, what to build, why it matters, how it should feel, still required human judgment. The tools handled repetition; I focused on the nuance that makes luxury experiences work.
​
-
Speed and quality aren't mutually exclusive. By front-loading strategic decisions (audience assumptions, competitive patterns, design system) and using AI thoughtfully, I delivered premium quality under extreme time pressure. The key was knowing what to automate versus what demanded human craft.
Result: Production-ready site delivered in 2 weeks with maintained design fidelity
DEVELOPMENT & DELIVERY
From Design to Live Site in Hours
Once the design was finalized, I prepared it for development by adding auto-layout constraints and component specifications in Figma, ensuring that the design system could be translated directly to code without ambiguity.
Design-to-code preparation
Added auto-layout, spacing tokens, and breakpoint specs in Figma
AI-assisted development
Used Cursor to convert Figma components directly into React code accelerating development while maintaining design system consistency.
Strategic prompting
​
Refined prompts with GPT-5 before feeding to Cursor, ensuring generated React components matched design specs with precision
Quality control
​
Manually refined interactions, responsive behavior, and accessibility features.
