Glassblowing Experience

Interaction Design

Collaboration: Partner Project
Roles: Rive Production, Audio, Animation, Vector Illustration
Duration: 6 weeks
Tools: Rive, Adobe Illustrator

Created with the talented Annelise Wall

Getting Started

To select a fundamental principle and explain it using an interactive project created in Rive that encourages users to think and learn about the principle in non-linear ways. To break away from traditional, linear explanations and design.
The Prompt
The Project
We chose to dive into the principles of glassblowing for its unique hands-on process and colorful results. Our project explores the principles of glassblowing through interacting with glass and exploring the elements of heating, molding, blowing, and adding color. The user is able to control a piece of melted glass and explore the different steps of glassblowing, ending the experience with a custom-made glass "vase" based on their unique interactions.

Pinterest Mood Board

Storyboard

The Big Obstacle

Annelise created a storyboard for our initial iteration, and we discussed how we would transition from each step and what interactions would be included. However, this storyboard does not match our final result.

Below are our initial scenes for our project: getting glass from the furnace, rolling the glass into a cylinder, adding color, and a timer scene. These were nearly complete interactive scenes.
Iteration 1
The Problem
After feedback, we realized that we strayed away from the project’s goal to be non-linear. We were being too literal in our project, guiding the user through each step, without really playing around with “what-ifs.” While we figured out how to implement no text for instruction, the whole visual layout had to be reconstructed. Most assets were kept, but some became no longer needed. Our biggest question: How do we let the user interact with the steps in any order they would like, but still restrict them to have a final result?

Back on Track

We went with a centered scene, with connecting scenes for each unique step that cannot be done on a table. The user could now choose what step to activate first, and see what happens to the glass. The user can switch between each scene whenever by hovering over the arrows. I had originally done multiple tests with bones controlling the glass ellipse until I was able to control the glass's shape in four directions. We both then tested further and found using a joystick to change the bones’ positions was the most effective for achieving the glass morphing interaction we were looking for.
Iteration 2

Final Layout

All assets are now finalized and all interactions are implemented. The only repeatable actions are heating, morphing, and blowing. Adding each color and adding an opening are one time actions. Multiple tests were made to ensure that the glass did not go back to its original state and all scenes were functional. Audio was added to the interactions to simulate the sounds you could hear when glassblowing in real life.
Iteration 3
Center: The main play area, where the glass molding and color adding occur.
Top: The furnace, where heating the glass occurs.
Left: The area where the glass is blown into a larger size.
Right: The main play area again after the glass has been morphed and colored.
Bottom: The podium, where the user presents their final vase.

In Action

The Rive runs on two major parts: the combined scenes, and the glass itself. While there are multiple interactions and animations included, the vast majority of them are held within a nested artboard that controls the glass interactions. These are activated by numerous inputs and listeners in the main artboard where the full project is held.
The File
The project is accessible through Rive's community files for anyone to access and interact with.
Watch the video below, or interact with the project through Rive!
The Interaction

Takeaways

As someone who may prefer working alone over with a group, I had a positive experience working collaboratively on this project. Annelise and I each had certain skills that we knew the other could do (digital painting vs vector illustration), and we each understood different parts of the Rive software better than others (state machines vs bones). We trusted each other to do the work we promised to do, and to play around with the software to understand it better.

We communicated often and updated each other on what we were doing. If either of us had life getting in the way, we discussed how to catch up. I found our progress to be more fulfilling in person, since we could easily try to solve any Rive issues together and work on different parts without interfering the other. When separate, it was difficult to communicate any problems in the moment, and sometimes editing the same object would cause issues. Overall, I now value collaboration more than before and am learning to ask for help and feedback more to improve my work.
The Lesson