---
# System prepended metadata

title: Staging Interaction

---

# Staging Interaction

\*\***Crystal/yongshan chong**\*\*

In the original stage production of Peter Pan, Tinker Bell was represented by a darting light created by a small handheld mirror off-stage, reflecting a little circle of light from a powerful lamp. Tinkerbell communicates her presence through this light to the other characters. See more info [here](https://en.wikipedia.org/wiki/Tinker_Bell). 

There is no actor that plays Tinkerbell--her existence in the play comes from the interactions that the other characters have with her.

For lab this week, we draw on this and other inspirations from theatre to stage interactions with a device where the main mode of display/output for the interactive device you are designing is lighting. You will plot the interaction with a storyboard, and use your computer and a smartphone to experiment with what the interactions will look and feel like. 

_Make sure you read all the instructions and understand the whole of the laboratory activity before starting!_



## Prep

### To start the semester, you will need:
1. Read about Git [here](https://git-scm.com/book/en/v2/Getting-Started-What-is-Git%3F).
2. Set up your own Github "Lab Hub" repository to keep all you work in record by [following these instructions](https://github.com/FAR-Lab/Developing-and-Designing-Interactive-Devices/blob/2021Fall/readings/Submitting%20Labs.md).
3. Set up the README.md for your Hub repository (for instance, so that it has your name and points to your own Lab 1) and [learn how to](https://guides.github.com/features/mastering-markdown/) organize and post links to your submissions on your README.md so we can find them easily.


### For this lab, you will need:
1. Paper
2. Markers/ Pens
3. Scissors
4. Smart Phone -- The main required feature is that the phone needs to have a browser and display a webpage.
5. Computer -- We will use your computer to host a webpage which also features controls.
6. Found objects and materials -- You will have to costume your phone so that it looks like some other devices. These materials can include doll clothes, a paper lantern, a bottle, human clothes, a pillow case, etc. Be creative!

### Deliverables for this lab are: 
1. 7 Storyboards
1. 3 Sketches/photos of costumed devices
1. Any reflections you have on the process
1. Video sketch of 3 prototyped interactions
1. Submit the items above in the lab1 folder of your class [Github page], either as links or uploaded files. Each group member should post their own copy of the work to their own Lab Hub, even if some of the work is the same from each person in the group.

### The Report
This README.md page in your own repository should be edited to include the work you have done (the deliverables mentioned above). Following the format below, you can delete everything but the headers and the sections between the **stars**. Write the answers to the questions under the starred sentences. Include any material that explains what you did in this lab hub folder, and link it in your README.md for the lab.

## Lab Overview
For this assignment, you are going to:

A) [Plan](#part-a-plan) 

B) [Act out the interaction](#part-b-act-out-the-interaction) 

C) [Prototype the device](#part-c-prototype-the-device)

D) [Wizard the device](#part-d-wizard-the-device) 

E) [Costume the device](#part-e-costume-the-device)

F) [Record the interaction](#part-f-record)

Labs are due on Mondays. Make sure this page is linked to on your main class hub page.

## Part A. Plan 

# Introducing the Pet Companion Device: Your Furry Friend's Perfect Pal

Welcome to a groundbreaking addition for every household – the **Pet Companion Device**. Engineered to seamlessly fit into bustling city apartments or tranquil countryside abodes, this revolutionary device is always on standby, day or night. A loyal companion that remains by your pet's side, even when you're away.

![](https://hackmd.io/_uploads/B1ifz1iph.jpg)


\*\***Describe your setting, players, activity and goals here.**\*\*

### Tailored for Every Member of the Family

Catering to pet owners, children, and their cherished animal companions, this device offers an array of dynamic interactions. Picture your pet cat engrossed in playful engagement with the device, igniting its screen with a symphony of vibrant colors that mirror its every move:

- When your cat emits a soft meow, witness the screen morph into a soothing Blue hue.
- A gentle lick from your furry companion douses the screen in a playful Purple glow.
- Inquisitive paws dancing across the device conjure a cheerful Purple and Black radiance.
- Energetic punches and swats paint the screen in gleaming Black and White brilliance.
- When your pet cat finds repose on the device, the screen softly transitions to a tranquil Green, reflecting its serene moment of rest.
- As you draw near home, the screen emanates a warm Yellow, indicating your approach.
- Should unfamiliar faces approach, the screen bathes the surroundings in a calming Red and angry aura.

### Bridging the Gap for Pet Owners

For pet owners, the primary objective revolves around nurturing an unbreakable bond and soothing their pets' solitude. Through the Pet Companion Device, they seamlessly provide unending entertainment and companionship, alleviating their pets' loneliness and ensuring their well-being, regardless of their physical absence.

### A World of Interaction for Pets

Conversely, the device opens up a world of interaction for pets, satisfying their innate curiosity and thirst for engagement. With playful barks, licks, taps, or swipes, pets set off captivating color changes and delightful sounds, bestowing a wellspring of amusement and a semblance of interaction – akin to spending quality time with their human caregivers.

\*\***Include pictures of your storyboards here**\*\*

![](https://hackmd.io/_uploads/B14mz1jTn.jpg)
![](https://hackmd.io/_uploads/Bk2QM1jTh.jpg)
![](https://hackmd.io/_uploads/rJcDHko62.jpg)
![](https://hackmd.io/_uploads/H107Hyo62.jpg)
![](https://hackmd.io/_uploads/SkMrr1ian.jpg)
![](https://hackmd.io/_uploads/SJ9IH1o6h.jpg)




\*\***Summarize feedback you got here.**\*\*


## Part B. Act out the Interaction

Initially, we envisioned our device as a camera-like toy positioned atop the feeding machine, assuming it would effectively capture pet behavior. However, we came to recognize that this approach might limit the device's capabilities and hinder its ability to comprehensively gather the wide spectrum of information pets convey. 

This is especially crucial given that pets predominantly interact with the feeding machine when they're hungry. Our goal is to ensure our bot can gather a diverse array of data to truly grasp and cater to our lonely pets' needs.

\*\***Are there new ideas that occur to you or your collaborators that come up from the acting?**\*\*

During the implementation phase, a novel concept emerged in response to emergency scenarios, such as break-ins, fires, or floods. We considered the possibility of the device seamlessly transitioning between red and white colors while emitting a warning noise, effectively alerting both occupants and pets within the household to potential dangers.

This innovative addition would significantly enhance the device's utility, expanding its role from a pet companion to a vital safety feature in the home.

## Part C. Prototype the device

\*\***Give us feedback on Tinkerbelle.**\*\*

There were some issue connecting the device with a public wifi. But was definitly a great tool, we were also able to utilize the sound input box function. Thank you for designing this!!!

## Part D. Wizard the device

\*\***Include your first attempts at recording the set-up video here.**\*\*

https://youtube.com/shorts/9iTrWCWAa60?si=6_9f6S8R_mHE0Dvx

Now, hange the goal within the same setting, and update the interaction with the paper prototype. 

\*\***Show the follow-up work here.**\*\*


## Part E. Costume the device

\*\***Include sketches of what your devices might look like here.**\*\*

Minimalist design:

For a device that seamlessly blends into modern interiors, envision a sleek, compact form resembling a polished stone. Its smooth, rounded edges and matte finish would not only be visually appealing but also practical, preventing overheating concerns.

![](https://hackmd.io/_uploads/B192-kjp2.jpg)


Sporty Design:

resembles a resilient rubber ball. This design would be resilient to accidental drops and impacts, and it could incorporate a water-resistant seal to safeguard against potential spills.
![](https://hackmd.io/_uploads/SJS_Q1jTh.jpg)


Pet-Friendly Companion Buddy Design:

we craft the device to resemble a small, plush animal friend, akin to a soft toy. The exterior could be covered in a gentle, pet-friendly fabric that's comfortable to touch and cuddle. Incorporate embroidered features like eyes, a nose, and a smiling mouth to give the device a friendly expression. The overall size should be compact and lightweight for easy handling by your pet.


![](https://hackmd.io/_uploads/B1oRkJs62.jpg)



\*\***What concerns or opportunitities are influencing the way you've designed the device to look?**\*\*

Circular Form: The circular shape not only carries a symbolism of continuity and balance but also aligns with our safety considerations. By avoiding sharp corners, we're actively mitigating potential risks associated with accidental collisions involving pets or children. This approach serves to create a safe and understated presence in your home.

Materials: To adhere to the safety guidelines around pets and kids, we'll carefully select materials that are both pet-friendly and child-safe. We'll prioritize non-toxic options that are also durable and easy to clean, given the device's proximity to these important members of your household.

Thoughtful Interactions: We'll discreetly design touch-sensitive areas on the device's surface. These areas will respond to interactions from pets and children, triggering delicate reactions such as subtle vibrations or faint chimes. This approach fosters curiosity and engagement without causing any discomfort.

In this design, our focus is on seamlessly incorporating the circular shape and employing unobtrusive design elements. 

## Part F. Record

\*\***Take a video of your prototyped interaction.**\*\*

https://youtube.com/shorts/9iTrWCWAa60?si=6_9f6S8R_mHE0Dvx

\*\***Please indicate anyone you collaborated with on this Lab.**\*\*
We were inspired by the 



# Staging Interaction, Part 2 

This describes the second week's work for this lab activity.


## Prep (to be done before Lab on Wednesday)

You will be assigned three partners from another group. Go to their github pages, view their videos, and provide them with reactions, suggestions & feedback: explain to them what you saw happening in their video. Guess the scene and the goals of the character. Ask them about anything that wasn’t clear. 

\*\***Summarize feedback from your partners here.**\*\*

## Make it your own

Do last week’s assignment again, but this time: 
1) It doesn’t have to (just) use light, 
2) You can use any modality (e.g., vibration, sound) to prototype the behaviors! Again, be creative! Feel free to fork and modify the tinkerbell code! 
3) We will be grading with an emphasis on creativity. 

\*\***Document everything here. (Particularly, we would like to see the storyboard and video, although photos of the prototype are also great.)**\*\*

Assisted by GPT for wording and grammar refinement.
