Shaghayegh

screen shot of the main app

About the Project

Our project, Poppy Field Memorial, is an interactive 3D memorial environment where each poppy flower represents one victim killed in Iran. Instead of showing the victims as numbers in a dataset, we wanted to create a space where users could walk through a field, approach the flowers, and discover individual names, ages, and cities.

Inspiration

The idea was inspired by the symbolism of poppies and the landscapes around Damavand mountain. Poppies are often connected with remembrance, grief, and lives lost. We wanted to turn that symbolism into an interactive experience: a quiet field where every flower stands for a real person.

Our main goal was to tell a story through space. At first, the user sees a large field of flowers. But as they move closer, the field becomes personal. The numbers become names.

What We Built

We built a 3D memorial field using React and Three.js. The environment includes a cloudy sky, textured grass terrain, a distant mountain inspired by Damavand/Fuji, ambient music, and thousands of poppy flowers.

Each flower is generated from victim data stored in a JSON file. The data includes:

UUID
Full name
City
Age

The relationship is simple but meaningful: [

1 \text{ victim} = 1 \text{ poppy}

]

When users move closer to a flower, they can see the person’s information. This turns the dataset into a visual and emotional memorial.

How We Built It

We started by collecting and cleaning victim data from an Excel file. Then we converted the cleaned file into JSON so it could be loaded directly into the web app.

The project uses:

React for the app structure and UI
Three.js for the 3D environment
GLB models for the mountain and flower assets
PBR grass textures for a more natural ground surface
JSON data to generate one flower per victim
Audio for a quiet memorial atmosphere

We also added a cinematic intro sequence before the user enters the field. The intro explains the meaning of the poppies and prepares the user emotionally before they begin walking through the memorial.

What We Learned

We learned a lot about building interactive 3D environments on the web. One of the biggest lessons was that visual storytelling is not just about making something look beautiful. It is also about movement, scale, pacing, and emotional tone.

We also learned how important performance is. Since our project may include thousands of flowers, we had to think carefully about optimization. A realistic flower model can look beautiful, but using thousands of heavy models can slow down or crash the browser. Because of that, we explored lighter rendering strategies and level-of-detail ideas.

Challenges

One major challenge was making the environment feel natural instead of flat or artificial. At first, the field looked like a simple green plane. We improved it by adding terrain height variation, grass textures, fog, and a distant mountain.

Another challenge was scale. The mountain had to look distant and majestic without allowing the user to walk inside it. The flowers also needed to feel proportional to human height, so users would feel like they were walking through a real field.

We also faced challenges with assets. Some 3D models were too large, some were not downloadable, and some formats did not work directly in Three.js. We had to test different file types, including .glb, .exr, .jpg, and texture maps.

Why It Matters

This project is about memory. A massacre can become reduced to numbers, but each number represents a person who had a name, a city, a family, and a life.

By turning data into a field of poppies, we wanted users to experience the difference between seeing a statistic and encountering individual lives.

Shghayegh is our way of telling a story through interaction, remembrance, and presence.