Gamified Interative Website

The gamified extension website aims to raise awareness about the hidden costs of conventional cotton production and promote Fair Trade Cotton as a sustainable, ethical alternative. Through interactive games and educational content, users—ranging from school students to expo visitors—can explore the journey of a 100% cotton T-shirt, learning about its environmental and social impact. The platform encourages informed, responsible consumer choices while making learning fun and engaging.

Done as a part of course collaboration with Fair Trade Cotton in Pforzhiem, Germany.
Under the Guidance of Felix Herman and Sebastian

Gamification
•
User Experience
•
User Interaction
•
Fun and Quirky
•

Gamification
•
User Experience
•
User Interaction
•
Fun and Quirky
•

A part of campaign for Fairtrade Cotton, Germany

Fairtrade is the most recognised and trusted sustainability label in the world. Since the introduction of Fairtrade cotton, Fairtrade’s goal has been to also address the unsafe and unfair labour conditions in cotton processing and textile factories. It's mission is to educate and make people aware, pushing the industry to become sustainable.

This project was developed as a part of course in collabortion with Fairtrade.

Unveiling the True Cost Of A 100% Cotton T-Shirt

What does it mean to be 100% Cotton? Being "100% cotton" means fabric made entirely from cotton fibers, but the process involves heavy water use, pesticides, underpaid labor, and harmful chemicals.

Gamifying this complex process simplifies learning, making it fun and engaging. Through Fair Trade expos and school visits, the platform raises awareness of sustainability, encouraging informed, ethical consumer choices.

What does it mean to be 100% Cotton? Being "100% cotton" means fabric made entirely from cotton fibers, but the process involves heavy water use, pesticides, underpaid labor, and harmful chemicals.

Simplyfying the Process of making of a 100% Cotton T-shirt

User Personas

Concept & Gamification

From a simple idea ——— To complex information ——— To easy to understand visuals ——— To a simple prototype

Captain Cottony

Introducing a character that can bind the story and guide the user throughout with instructions and facts.

Using AI tools to generate cohesive visuals

In the process of designing a harmonious and visually striking website, I utilized AI technologies such as DALL·E, Photoshop Generative AI, and Recraft.ai to produce imagery for the high-definition prototype. I offered specific instructions centered on visual semantics and color schemes to guarantee uniformity and effectiveness.

All visuals are generated by Recraft.Ai