Strawberry's Page

Digital media student exploring design, code and interactive experiments.

Introduction

I am Strawberry, and I am from China. I previously studied medicine, but I found that creative work makes me feel more comfortable and engaged, which led me to pursue design. I am more confident in using Figma and Illustrator. In my first semester, I created a small FPS-style project with some coding, where I explored controlling cars at a fixed speed and adjusting that speed.

GitHub

My GitHub profile is github

In-class Experiments

01 Feedback Design Experiment 02 Information Design Experiment 03 Mapping Design Experiment

Project Speculation

Introduction

This project looks at how interaction, sound, and visual elements can be used to explore ideas related to conflict and war. Instead of directly showing war, the focus is on how users can experience changes in a system through their own actions. The project aims to create a simple interactive environment where small actions can lead to noticeable changes in both sound and visuals. This makes the user more aware of how their input affects the system. By focusing on interaction rather than representation, the project explores how digital experiences can communicate ideas in a more indirect but still meaningful way.

Experiments

The three experiments helped me understand different ways interaction can affect user experience. In the first experiment, I focused on changing the feedback of the press-and-hold interaction. Instead of only showing the button being stretched, I made the color become darker while the button was being held. This made the interaction feel clearer and more responsive, and it also showed how visual feedback can strengthen the connection between action and sound.

While developing the keyboard experiment, I focused more on the visual side. I adjusted the color palette to make it more consistent and easier to look at, and replaced the instant color change with a gradual transition. This small change made the interaction feel smoother and more connected and showed how visual feedback can shape the overall experience.

For the circle generator, the focus was on randomness. Each click produced a different result, which made the system feel less predictable. This suggested that even simple interactions can lead to complex outcomes depending on how the system is designed.

Looking across all three experiments, it became clear that interaction is not just about control, but also about how systems respond and change over time. This became an important starting point for thinking about how user actions can influence both visual and sound outcomes in the project.

References

Some of the provided examples also influenced how I think about interaction. In Concrete Nest, dragging and clicking the mouse creates flickering visual effects that respond immediately to user input. This made me realize how simple gestures can produce strong visual feedback and create a sense of instability through continuous interaction.

Flippory

Concrete Nest - Rianna Suen & Struan Fraser

Another example, Flippory, allows users to place given words into a canvas while a background of white noise plays. The experience feels calm and controlled, as users can arrange elements freely. This made me think about how input, such as words or selections, can be used to build a system over time, and how interaction can shape both the visual layout and the overall atmosphere.

Concrete Nest

Flippory - Mark Stramaglia

The SBS interactive projectThe Boat offers a different approach to interaction by presenting a narrative through scrolling and layered visuals. Rather than relying on direct actions such as clicking or dragging, the experience is shaped by moving through the page. This highlights how interaction can be built into the structure of a website itself, where pacing and transitions guide the user’s experience over time and create a more immersive atmosphere.

The Boat – SBS Interactive

Looking at these examples together, I started to think about how interaction can move beyond simple control and become something that gradually changes a system. These ideas helped shape my thinking about using user input, whether through gestures or selections, to influence both visual and sound elements in a more dynamic way.

Tools

This project will draw on a range of creative tools that support both sound and visual interaction. Tone.js will be used to explore how sound can respond to user input in real time, while Konva will be used to generate and control visual elements within a canvas environment. These tools will allow user actions to directly influence both audio and visual changes, helping to build a more responsive and interactive system.

In addition to these tools, the project will also explore simple 3D environments using Blender and Three.js. Blender will be used to create visual elements such as fragmented or broken forms, which can then be imported into a web environment using Three.js. This approach will make it possible to extend interaction into a spatial context, where changes are not only seen and heard, but also experienced within a 3D scene.

Design Thinking

This project is informed by basic interaction design ideas such as cause and effect, where user actions lead to visible and audible changes in a system. Rather than treating interaction as a simple input-output process, the project considers how repeated actions can gradually change the state of a system over time. This way of thinking shifts the focus from single interactions to ongoing processes.

The project is also influenced by recent conflicts in the Middle East, as well as a personal interest in becoming a volunteer doctor in humanitarian contexts. These ideas led to a focus on how interactive systems can be used to reflect the impact of conflict in a more experiential way. Instead of presenting information directly, the project aims to create a situation where users can engage with changes in the system and become more aware of discomfort, instability, and disruption.

The value of this approach lies in how interaction can be used to communicate ideas without relying on direct representation. By allowing users to influence changes in sound, visuals, and potentially space, the project creates an experience where meaning is formed through participation rather than observation. This makes the interaction more personal and reflective.

In terms of framing, the project focuses on building a system where gesture, input, and movement can affect multiple layers, including sound, 2D visuals, and 3D elements. Instead of a fixed interface, the system is designed to change over time, responding to user behavior in a more dynamic and evolving way.

Speculation

These explorations suggest that interaction can be used to shape experiences over time rather than deliver fixed outcomes. Instead of focusing on clear messages or direct representation, the project opens a space where meaning is not given but formed through the user’s engagement with change.

This direction allows the project to remain open-ended, where different users may experience and interpret the system differently. It also suggests that interaction design can move beyond function and become a way of exploring more complex and personal responses.

Reference List

Acknowledgement

I would like to acknowledge ChatGPT for supporting my learning process during this project. It helped me understand programming language concepts, fix and revise error code, and develop the overall structure of my writing.