Reid Scarboro Profile picture
Feb 26, 2023 β€’ 20 tweets β€’ 7 min read β€’ Read on X
Using Unity to make an interactive art thing for an elementary school STEAM (science, tech, engineering, arts, math) event - progress thread! πŸ‘‡
Context: My wife is a K-5 art teacher, I ocassionally help out with events to show kids how games and art overlap. For the STEAM event, she asked me to run a "tech" booth. Usually the booths are some sort of craft/interactive thing, and I have a big screen to work with!
Project requirements: Create a cool *thing* that showcases technology. Any input/activity needs to be simple enough for a 5 year old. We're expecting a few hundred kids to come through the booth over 3 hours. I have a big screen and a lot of table space.
The idea: "Put a Fish in the Aquarium" - we'll have worksheets with fish outlines that kids can color in, then I'll scan them onto laptop running a Unity game on the big screen. Unity game hot-loads images and puts them into an aquarium scene.
I did a similar booth a few years ago, with bugs instead of fish - the kids had a great time seeing their art jumping around on the screen, hoping to replicate and elevate that experience!
Loading images: Wrote some code that would keep track of all the png files in a directory. When it finds a new image, delete the background to isolate the fish using a flood-fill algorithm and Texture2D.GetPixel/SetPixel. Image
Once the fish graphic is isolated, I create a new Fish that's essentially just a square mesh with the new texture on it. I found "Flock Box DOTS" by Cloud Fine on the Asset Store to make the fish swim around - super easy to work with!
To give the fish a swimming animation, I used Shader Graph (for the first time, very cool!) to do some vertex deforming.
(Here's the Shader Graph) Image
Putting it together, feeling good so far!
Some Asset Store models (using the same vertex deform shader), terrain, fog, lighting/shadows
Stress test, and a decal to emulate light caustics from water ripples
Success in turning physical fish drawing into digital fish!
Was having some blur issues, but this Logitech c270 has a manually adjustable focus if you open it up πŸ‘ Image
The capture setup Image
Spawn bubbles! Because it looks cool, and to help the kids identify their fish as it spawns
Various fish for the kids to color - traced these outlines from the 3d models in our fishing game Tides ImageImageImageImage
Final setup at school, kids are here in 30 Image
Overall a success! Kids loved it - ended with about 260 fish. Everyone seemed to really enjoy seeing their fish swim around with the others, though it did get kinda crowded towards the end😁
And a final recording of all the fish!

#gamedev #madewithunity #unity3d

β€’ β€’ β€’

Missing some Tweet in this thread? You can try to force a refresh
γ€€

Keep Current with Reid Scarboro

Reid Scarboro Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

PDF

Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

Did Thread Reader help you today?

Support us! We are indie developers!


This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Don't want to be a Premium member but still want to support us?

Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal

Or Donate anonymously using crypto!

Ethereum

0xfe58350B80634f60Fa6Dc149a72b4DFbc17D341E copy

Bitcoin

3ATGMxNzCUFzxpMCHL5sWSt4DVtS8UqXpi copy

Thank you for your support!

Follow Us!

:(