[Case 02]
Spring Gardens Nursery
Spring Gardens Nursery
Enhancing Brand Presence Through Structured UI Design
[Project Overview]
Spring Gardens Nursery needed a stronger digital presence that reflected the quality and intentionality of its brand. The existing website lacked visual consistency, responsiveness, and scalable structure, limiting both user experience and long-term maintainability.
[Problem Statement]
Spring Gardens Nursery’s website did not effectively communicate the brand’s identity or provide a seamless experience across devices.
[Solution Statement]
To address these challenges, I implemented a structured UI redesign focused on consistency, responsiveness, and scalability.
[Industry]
Home & Garden Retail
[My Role]
Lead Designer
[Platforms]
Desktop Web (First Implementation)
[Timeline]
October 2024 – November 2024
[Process]
[01] User Research
Conducted a heuristic evaluation of the existing website to identify usability and visual consistency issues.
Analyzed layout structure, typography hierarchy, spacing inconsistencies, and CSS organization.
Reviewed competitor websites in the home & garden retail space to understand modern design patterns.
[02] Insights
The website lacked a cohesive visual system, leading to inconsistent brand presentation.
CSS structure was disorganized, making updates inefficient and difficult to scale.
Limited semantic structure affected accessibility and content clarity.
[03 Design Solution]
Established a structured UI system with defined typography scale, spacing rules, and color hierarchy.
Reorganized CSS into modular sections to simplify future updates and improve maintainability.
Refined visual hierarchy and navigation clarity to strengthen user flow and brand perception.
[04] Implementation & Refinement
Iteratively refined spacing, contrast, and typography for readability and accessibility.
Standardized UI elements to ensure consistent application of brand colors and design patterns.
Tested layout behavior across different desktop screen sizes to maintain visual alignment and structure.
[Outcome]
Standardized 100% of core UI components under a unified design system.
Strengthened brand consistency through defined typography and color hierarchy.
Reduced CSS redundancy by reorganizing styles into modular sections.
[Key Learnings]
Consistency builds trust
Unified typography, spacing, and color systems create a stronger, more professional presence.
Visual + Functional
Balancing aesthetics with maintainable code is essential for long-term usability.
Small Details Matter
Improving hierarchy, alignment, and semantic structure significantly elevates the overall experience.