Spain Tourism Board x Gardens By The Bay
UI/UX Design · Website
May 2022 – Sep 2022
Overview
The Spain Tourism Board partnered with Gardens by the Bay to launch the Spanish Serenade with Sunflowers exhibition, aimed at promoting Andalusia as a travel destination.
As part of the campaign, a microsite was required to serve as the event’s primary digital touchpoint, providing visitors with information about the exhibition while supporting engagement through a social media contest.
With no clearly defined direction at the start, the project required establishing the site’s structure, content strategy, and overall experience from the ground up.
I designed the microsite end-to-end, from information architecture to final UI, ensuring a cohesive and responsive experience across desktop and mobile.
Team
Designer
Developers
My Role
Project Lead
UI/UX Design
Prototyping
Developer Handoff
The Challenge
The initial brief lacked clarity on the purpose and direction of the microsite. It was unclear whether the site should focus on promoting Andalusia as a travel destination or on guiding visitors through the exhibition at Gardens by the Bay.
Without a defined audience or content strategy, key decisions around information structure, content hierarchy, and navigation could not be established confidently. This required aligning with stakeholders early to define a clear scope and direction before proceeding with the design.
Goals
Based on the client brief, the microsite needed to:
Introduce Andalusia’s cultural, historical, and artistic identity through a digital experience
Complement the physical exhibition by reflecting its storytelling and spatial journey
Highlight key exhibition elements such as culture, gastronomy, and traditions
Support engagement through a social media contest and online participation
Leverage Gardens by the Bay’s audience to increase awareness of Spain and Andalusia
Deliver a clear, mobile-friendly experience for visitors accessing the site on-site
Research & Early Exploration
At the start of the project, the exhibition had not yet been fully set up, and there were no concrete materials or audience data available.
During client walkthroughs, stakeholders shared the planned layout of the exhibition spaces and the intent behind each section. This provided an initial understanding of how visitors would experience the exhibition physically.
The project brief also outlined key objectives such as promoting Andalusia’s cultural identity and supporting engagement through a social media contest, which informed early content and structural decisions.
In parallel, I explored how the microsite could translate this journey into a digital experience, structuring content to mirror the exhibition flow while keeping it clear and accessible. This early exploration established a flexible foundation, allowing the design to evolve as the project direction and scope became clearer.
Website Design
Information Architecture
With the project scope and goals clarified, the microsite was structured to prioritise clarity, scannability, and alignment with the exhibition’s flow. Given the limited timeline and lack of detailed documentation, content prioritisation was guided by exhibition panels and client-provided materials. These were organised around three core user needs:
Understanding Andalusia and the Exhibition
Content introducing Andalusia and its cultural context was consolidated into a dedicated About page, supported by visuals and key highlights to provide an accessible overview.
Accessing Key Event and Contest Information
Essential information was surfaced prominently across the Home and Social Media Contest pages, using clear sectioning and hierarchy to help users quickly locate what they needed.
Learning How to Participate
Essential information was surfaced prominently across the Home and Social Media Contest pages, using clear sectioning and hierarchy to help users quickly locate what they needed.
To support these needs, a simple and flat navigation structure was implemented, ensuring all key content was easily accessible — particularly for mobile users who were likely viewing the site during or shortly after visiting the exhibition.
This approach reduced cognitive load while maintaining a clear connection between the physical exhibition journey and the digital experience.
Early Structuring & Wireframing
With the scope and direction still being defined, I began translating the exhibition content into early wireframes to explore possible information structures and page flows, grounding early decisions in both content needs and user context.
These initial wireframes focused on organising content into clear, scannable sections, while aligning the digital experience with how visitors would naturally move through the physical exhibition.
The information architecture was shaped by the exhibition’s physical zones (e.g. culture, olive oil, experiences) and key digital actions such as learning, exploration, and contest participation.
🏠 Home Page
Designed as the main entry point to introduce the exhibition and guide users to key actions.
Hero banners highlighted the exhibition, contest, and Andalusia
Key sections surfaced highlights, experiences, and contest entry points
Social content reinforced engagement
🌹 Discover Andalusia Page
Focused on deeper exploration and cultural context.
Introductory content established the significance of Andalusia
Highlight sections allowed users to explore different exhibition zones
Content was structured to reflect the physical exhibition panels
🤳🏼 Contest Page
Structured to clearly communicate participation steps.
Hero introduced the contest and prize incentives
Step-by-step instructions reduced friction
Supporting content reinforced context and credibility
Final Website Design
The final interface was designed as a cohesive, scroll-based experience across the Home, Discover Andalusia, and Contest pages — each supporting different user needs while maintaining a consistent visual and structural system.
The Home page acts as the central entry point, introducing the exhibition and guiding users toward key actions. The Discover Andalusia page focuses on cultural storytelling and deeper exploration, while the Contest page is structured to clearly communicate participation steps and encourage engagement.
Across all pages, the design prioritises clarity, scannability, and strong visual storytelling — ensuring users can easily navigate content, whether browsing casually or accessing information during the exhibition.
Visual Design Approach
The visual direction was developed to reflect the vibrancy and cultural richness of Andalusia, while maintaining clarity and readability across content-heavy sections. Drawing from Spanish architecture, textiles, and garden landscapes, the design incorporates warm tones, intricate patterns, and expressive imagery to create an immersive yet structured experience.
Colour & Inspiration
A warm, vibrant palette was used to capture the essence of Andalusia:
Terracotta and warm neutrals inspired by traditional architecture
Bright accent colours referencing floral elements and cultural motifs
Balanced contrast to ensure readability across sections
Imagery & Composition
Imagery plays a central role in the interface:
Large, immersive visuals help reflect the atmosphere of the exhibition
Images are used as primary storytelling elements, reducing reliance on long text
Visual groupings create a connection between digital content and exhibition zones
Patterns & Visual Motifs
Subtle patterns and geometric elements were introduced to reinforce cultural identity:
Inspired by Spanish tiles and ornamental details
Used sparingly to add texture without overwhelming the interface
Helps create a distinctive and cohesive visual language
Layout & Readability
Content is structured into modular sections for easy scanning
Generous spacing improves readability, especially on mobile
Clear hierarchy ensures users can quickly identify key information
Impact
The microsite provided a clear and engaging digital touchpoint that complemented the exhibition, helping visitors better understand Andalusia’s cultural context and navigate key highlights.
By structuring content into digestible sections, the site enabled users to quickly access essential information such as exhibition highlights, activity details, and contest participation steps — particularly in a time-sensitive, on-site setting.
The combination of strong visual design and clear calls-to-action supported both exploration and engagement, encouraging visitors to interact with the exhibition beyond the physical space through the social media contest.
Reflection
This project highlighted the importance of working through ambiguity and taking initiative to define structure when requirements are not fully established.
With limited initial direction and incomplete exhibition materials, I had to proactively clarify scope, align on content priorities, and shape the information architecture early to move the project forward.
It also reinforced the need to design with context in mind — in this case, creating a mobile-friendly, highly scannable experience for users accessing the site during the exhibition.
Future Opportunities
If revisiting the project, I would strengthen the UX foundation through lightweight validation and clearer content strategy:
User Insight Gathering
Conduct quick, informal interviews to understand visitor expectations for event microsites
Align with on-ground staff to identify common questions and information gaps
Discovery & Access Strategy
Plan how users discover the site (e.g. QR codes, signage, social media)
Optimise content for mobile-first, bite-sized consumption in an on-site context
User Flow Definition
Define simple user flows early (e.g. explore exhibition, join contest, revisit content)
Use these flows to guide content hierarchy and page transitions
These refinements would help strengthen clarity, improve navigation, and better connect the digital experience with the physical exhibition.
