LGBT movement in Taiwan
LGBT movement in Taiwan
Role
Product Designer & Developer
Focus Areas
Interaction design, typography and color, prototyping, coding
Tools Used
Framer, Miro, Gemini [coding assistant]
Role
Product Designer & Developer
Focus Areas
Interaction design, typography and color, prototyping, coding
Tools Used
Framer, Miro, Gemini [coding assistant]
Project Overview
Project Overview
Context
I created an experimental microsite documenting the LGBT rights movement in Taiwan. I noticed that among my peers, interest in LGBT rights advocacy abroad seems to be declining, perhaps because these rights already exist where we live. I wanted to highlight an inspiring story from outside the Western context. Taiwan became the first country in Asia to legalize same-sex marriage in 2019, sixteen years after hosting its first pride parade in Taipei in 2003.
Context
I created an experimental microsite documenting the LGBT rights movement in Taiwan. I noticed that among my peers, interest in LGBT rights advocacy abroad seems to be declining, perhaps because these rights already exist where we live. I wanted to highlight an inspiring story from outside the Western context. Taiwan became the first country in Asia to legalize same-sex marriage in 2019, sixteen years after hosting its first pride parade in Taipei in 2003.
The Challenge
I needed to present a 16-year historical timeline in an engaging way. The microsite organizes curated links to news articles and videos, with each page containing a title, description, date, credits when applicable, and image that links to external content.
The technical challenge involved implementing custom scroll behavior while maintaining the sites responsive design across all devices, requiring custom code beyond Framer's native capabilities.
The Challenge
I needed to present a 16-year historical timeline in an engaging way. The microsite organizes curated links to news articles and videos, with each page containing a title, description, date, credits when applicable, and image that links to external content.
The technical challenge involved implementing custom scroll behavior while maintaining the sites responsive design across all devices, requiring custom code beyond Framer's native capabilities.
Goals
My primary goal was to create an immersive digital experience that educates users about Taiwan's LGBT rights movement. I wanted users to learn about LGBT history in Taiwan through an engaging format, understand the timeline of progress from 2003-2019, and access curated articles and videos for deeper exploration.
On the design side, I aimed to implement a horizontal scroll experience, use audio to enhance immersion, ensure responsive design across all devices, and maintain readability while experimenting with interactive elements.
Goals
My primary goal was to create an immersive digital experience that educates users about Taiwan's LGBT rights movement. I wanted users to learn about LGBT history in Taiwan through an engaging format, understand the timeline of progress from 2003-2019, and access curated articles and videos for deeper exploration.
On the design side, I aimed to implement a horizontal scroll experience, use audio to enhance immersion, ensure responsive design across all devices, and maintain readability while experimenting with interactive elements.
Reflection
I went through numerous debugging cycles to get the scroll behavior feeling natural. Working with Gemini taught me how to effectively create code with AI tools: being specific about the problem, understanding how the code is performing, and iterating based on results. Experimental interactions needed extra attention during user testing. What felt intuitive to me as the designer required adjustment for users.
If I did it again, I'd explore adding subtle visual cues on first load to help users understand the horizontal navigation while scrolling vertically immediately. I would also experiment with incorporating elements of the Taiwanese flag colors or rainbow pride symbolism to create stronger cultural and thematic connections.
Reflection
I went through numerous debugging cycles to get the scroll behavior feeling natural. Working with Gemini taught me how to effectively create code with AI tools: being specific about the problem, understanding how the code is performing, and iterating based on results. Experimental interactions needed extra attention during user testing. What felt intuitive to me as the designer required adjustment for users.
If I did it again, I'd explore adding subtle visual cues on first load to help users understand the horizontal navigation while scrolling vertically immediately. I would also experiment with incorporating elements of the Taiwanese flag colors or rainbow pride symbolism to create stronger cultural and thematic connections.