PRODUCT DESIGN
Helping Explorers Discover and Connect with Interactive Maps
In February 2022, before leaving Ningbo to explore new possibilities, I revisited Moon Lake Park, feeling both nostalgia and reverence. This reflection inspired me to address the challenges of reconnecting with places tied to personal and cultural identity. Focusing on the Lake, I initiated a project to create accessible, immersive experiences, enabling people to explore a place’s cultural and historical essence regardless of location.
In February 2022, before leaving Ningbo to explore new possibilities, I revisited Moon Lake Park, feeling both nostalgia and reverence. This reflection inspired me to address the challenges of reconnecting with places tied to personal and cultural identity. Focusing on the Lake, I initiated a project to create accessible, immersive experiences, enabling people to explore a place’s cultural and historical essence regardless of location.
ROLE
Research
Photography
Icon Design
3D Modelling
UI Design
UX Design
TOOLS
Mapbox
Illustration
Photoshop
Vectary
TIMELINE
Aug 2021, 10 days
01
Understanding
RESEARCH HISTORY • A reflection of pragmatic humanism and urban spirit
RESEARCH HISTORY • A reflection of pragmatic humanism and urban spirit
RESEARCH HISTORY • A reflection of pragmatic humanism and urban spirit
Moon Lake Park, nestled in the heart of Ningbo, embodies profound historical and cultural significance. Originating from the Tang Dynasty as a crucial water source, it transformed into an academic and cultural hub in subsequent dynasties. With diverse architectural treasures and a focus on practicality over embellishments, Moon Lake reflects Ningbo’s ethos of ‘Pragmatic Humanism’. This cultural gem has evolved, shaping the city’s character and preserving ancient traditions.
Moon Lake Park, nestled in the heart of Ningbo, embodies profound historical and cultural significance. Originating from the Tang Dynasty as a crucial water source, it transformed into an academic and cultural hub in subsequent dynasties. With diverse architectural treasures and a focus on practicality over embellishments, Moon Lake reflects Ningbo’s ethos of ‘Pragmatic Humanism’. This cultural gem has evolved, shaping the city’s character and preserving ancient traditions.
PHOTO FORMSTORMING • Low-Key, tranquil and vibrant
PHOTO FORMSTORMING • Low-Key, tranquil and vibrant
PHOTO FORMSTORMING • Low-Key, tranquil and vibrant
I took tons of pictures of Moon Lake Park, combined with some online resources, collecting the visual information, and aiming to capture the atmosphere and essence of it and its surroundings.
I took tons of pictures of Moon Lake Park, combined with some online resources, collecting the visual information, and aiming to capture the atmosphere and essence of it and its surroundings.
02
Mapping the Unseen with Mapbox
COLOR PALETTE • Serene vibrancy with aesthetics and usability
COLOR PALETTE • Serene vibrancy with aesthetics and usability
COLOR PALETTE • Serene vibrancy with aesthetics and usability
Leveraging my photo collection as inspiration, I seek to imbue the interactive map interface with Moon Lake Park’s serene yet lively spirit. Meticulously choosing a colour palette, I aimed for a perfect blend that encapsulated the lake’s beauty, ensuring both visual appeal and practicality.
Leveraging my photo collection as inspiration, I seek to imbue the interactive map interface with Moon Lake Park’s serene yet lively spirit. Meticulously choosing a colour palette, I aimed for a perfect blend that encapsulated the lake’s beauty, ensuring both visual appeal and practicality.
TYPEFACE HARMONY • Resonating the historic and architectural essence
TYPEFACE HARMONY • Resonating the historic and architectural essence
TYPEFACE HARMONY • Resonating the historic and architectural essence
To align with Moon Lake Park’s temperament, I aimed to find a graceful yet energizing typeface to align with. After comparison, IM FELL English and Averia Serif Libre emerged as the perfect typographical expression for this historical and architectural amalgamation.
To align with Moon Lake Park’s temperament, I aimed to find a graceful yet energizing typeface to align with. After comparison, IM FELL English and Averia Serif Libre emerged as the perfect typographical expression for this historical and architectural amalgamation.
ICONIC REPRESENTATIONS • Merging form and function for easy recognition
ICONIC REPRESENTATIONS • Merging form and function for easy recognition
ICONIC REPRESENTATIONS • Merging form and function for easy recognition
Crafting icons for significant park landmarks merges functionality and history for immediate site recognition. Inspired by ancient Chinese inscriptions, the iconography for the whole park embodies Moon Lake’s visual appearance, conveying historical significance with ancient elegance.
Crafting icons for significant park landmarks merges functionality and history for immediate site recognition. Inspired by ancient Chinese inscriptions, the iconography for the whole park embodies Moon Lake’s visual appearance, conveying historical significance with ancient elegance.
INTERACTIVE ELEMENTS CREATION • A multimedia-enriched navigation
INTERACTIVE ELEMENTS CREATION • A multimedia-enriched navigation
INTERACTIVE ELEMENTS CREATION • A multimedia-enriched navigation
Leveraging Mapbox’s capabilities, I integrated location markers and custom layers to create an engaging map. Pop-up windows linked to images and info provided an immersive exploration of Moon Lake.
Leveraging Mapbox’s capabilities, I integrated location markers and custom layers to create an engaging map. Pop-up windows linked to images and info provided an immersive exploration of Moon Lake.
03
Immersion Journey Unveiled
AR & VR INTEGRATION • Crafting immersive experiences
AR & VR INTEGRATION • Crafting immersive experiences
AR & VR INTEGRATION • Crafting immersive experiences
In this phase, I brought Moon Lake’s wonders to life using AR and VR technologies. Through 3D modeling and innovative marker-based interactions, users could step into a virtual world, experiencing the park’s vibrant surroundings and enhancing their interaction with Moon Lake.
In this phase, I brought Moon Lake’s wonders to life using AR and VR technologies. Through 3D modeling and innovative marker-based interactions, users could step into a virtual world, experiencing the park’s vibrant surroundings and enhancing their interaction with Moon Lake.
04
The Design Fusion
DYNAMIC INTERACTIVE MAP • An immersive dive into regions’ culture and history without physical restrictions
DYNAMIC INTERACTIVE MAP • An immersive dive into regions’ culture and history without physical restrictions
DYNAMIC INTERACTIVE MAP • An immersive dive into regions’ culture and history without physical restrictions
Combining the results of all phases, this comprehensive interactive map displays Moon Lake’s architectural grandeur, historical significance, and humanistic atmosphere. As users navigate from an aerial view, the Moon Lake logo appears, revealing different architectural icons upon zooming in continuously. It offers a rich and seamless experience, enabling users to delve into audio descriptions, videos, and AR/VR scenes at specific locations.
Combining the results of all phases, this comprehensive interactive map displays Moon Lake’s architectural grandeur, historical significance, and humanistic atmosphere. As users navigate from an aerial view, the Moon Lake logo appears, revealing different architectural icons upon zooming in continuously. It offers a rich and seamless experience, enabling users to delve into audio descriptions, videos, and AR/VR scenes at specific locations.
05
Reflection
Historical and emotional essence in digital format
When translating a location’s rich, physical, and emotional heritage into a digital format, it should be in a manner that deeply resonates with the audience, making it accessible and compelling.
When translating a location’s rich, physical, and emotional heritage into a digital format, it should be in a manner that deeply resonates with the audience, making it accessible and compelling.
Interactive map as a storytelling medium
Maps are not just narratives; they’re windows into our past, guides for our present, and visions of our future. As technology evolves, I envision a future where maps become even more potent tools, embracing artificial intelligence, inclusiveness, and a discourse for change.
Maps are not just narratives; they’re windows into our past, guides for our present, and visions of our future. As technology evolves, I envision a future where maps become even more potent tools, embracing artificial intelligence, inclusiveness, and a discourse for change.
Prospects for remote exploration and community engagement
The integration of AR and VR technologies opened avenues for remote exploration, enabling people far away to connect with the location effortlessly. It also facilitated community engagement by incorporating local stories and memories, thus preserving and celebrating collective heritage.
The integration of AR and VR technologies opened avenues for remote exploration, enabling people far away to connect with the location effortlessly. It also facilitated community engagement by incorporating local stories and memories, thus preserving and celebrating collective heritage.
Boost to tourism and local economy
This approach highlights how innovative storytelling methods and technology can attract tourists to enhance interest and visitation, benefiting local economies.
This approach highlights how innovative storytelling methods and technology can attract tourists to enhance interest and visitation, benefiting local economies.
Summary
This project represents an exploration into the convergence of historical reverence, technological advancement, and user-centric design. It serves as a testament to the potential of interactive maps in cultural preservation, storytelling, and community engagement, not just illustrating a location but capturing its spirit and essence.
This project represents an exploration into the convergence of historical reverence, technological advancement, and user-centric design. It serves as a testament to the potential of interactive maps in cultural preservation, storytelling, and community engagement, not just illustrating a location but capturing its spirit and essence.
Explore more work
UX-UI WEB DESIGN
Scaling Clarity in B2B Design
UX-UI APP DESIGN
Designing a Seamless Scheduling Experience for LunchME Chat
SERVICE DESIGN
Fostering Immigrant Integration & Service Efficiency
UX-UI MOBILE DESIGN
Enriching Museum Visits for Art Enthusiasts
BRAND DESIGN
Crafting the Melody Box Identity to Drive Purchases for the Brand
Explore more work
UX-UI WEB DESIGN
Scaling Clarity in B2B Design
UX-UI APP DESIGN
Designing a Seamless Scheduling Experience for LunchME Chat
SERVICE DESIGN
Fostering Immigrant Integration & Service Efficiency
UX-UI MOBILE DESIGN
Enriching Museum Visits for Art Enthusiasts
BRAND DESIGN
Crafting the Melody Box Identity to Drive Purchases for the Brand
Explore more work
UX-UI WEB DESIGN
Scaling Clarity in B2B Design
UX-UI APP DESIGN
Designing a Seamless Scheduling Experience for LunchME Chat
SERVICE DESIGN
Fostering Immigrant Integration & Service Efficiency
UX-UI MOBILE DESIGN
Enriching Museum Visits for Art Enthusiasts
BRAND DESIGN
Crafting the Melody Box Identity to Drive Purchases for the Brand
Explore more work
UX-UI WEB DESIGN
Scaling Clarity in B2B Design
UX-UI APP DESIGN
Designing a Seamless Scheduling Experience for LunchME Chat
SERVICE DESIGN
Fostering Immigrant Integration & Service Efficiency
UX-UI MOBILE DESIGN
Enriching Museum Visits for Art Enthusiasts
BRAND DESIGN
Crafting the Melody Box Identity to Drive Purchases for the Brand
Explore more work
UX-UI WEB DESIGN
Scaling Clarity in B2B Design
UX-UI APP DESIGN
Designing a Seamless Scheduling Experience for LunchME Chat
SERVICE DESIGN
Fostering Immigrant Integration & Service Efficiency
UX-UI MOBILE DESIGN
Enriching Museum Visits for Art Enthusiasts
BRAND DESIGN
Crafting the Melody Box Identity to Drive Purchases for the Brand