Wonder Playhouse
: An innovative public play space designed for children aged 4-12. We want to explore ways to encourage kids to go outside and play, with a combination of physical and digital play.
Helped my colleague @Jeff_Sun to iterate and polish the design.
Role: Interaction Designer / Gamification Specialist / UX Design / Iteration
Team: Connor Zhang / Jeff Sun
Duration: February - Present (The period that I am working on the project)
Tool Used: Figma / Rendering Tools
Jeff invited me to review this project and join the creative design team. Together, we revised the gameplay side and features of Wonder Playhouse, making the entire experience more cohesive and targeted.
Design Principle
Design 4 Children's Rights is an evolving guide that aims to establish a new standard for both design and business, directing the development of products and services towards ethical considerations and the best interests of children.
Player Journey
Every day after school, Josh plays at a park where his favorite place is a playground with an interactive playhouse.
The Playhouse is a very novel experience for Josh. He is very willing to play in the Playhouse because he can have an enjoyable experience, whether he is alone or with friends.
Josh carries some moveable cubes from aside and stack on the playhouse. When these moveable cubes touch the playhouse's main frame, they become part of it. He really enjoys creating his ideal play space!
He can also light up the individual cubes that connected to the playhouse by taping cubes on the main frame. Each tap could turn the cube into another color. By this, he can make a colorful play space as he wished.
The interactive digital screen lists many mini-games that provide many play options.
When his friends arrive, he finds some games on the "window", a transparent screen. The games for the playhouse are based on building and are very fun to play with others. He is now thinking of playing a game called "Red vs Blue" — a game that pits two teams against each other and the goal is to convert more cubes to their team's color by touching them.
Look, Josh and his teammate are lighting up red cubes and attacking the blue team area to extinguish the blue cubes. They also need to defend their area to win.
The Wonder Playhouse offers Josh and his friends a variety of ways to play, allowing him and his companions to feel connected and enjoy happiness.
Design for Kids
Understand kids’ play behavior and design for specific cognitive levels. Provide a social space where children can connect with each other.
Design Philosophy
Physical & Digital Experience
Combine traditional physical play with technology to create s novel experience
Play Innovation
Envisioning the possibilities for future outdoor playgrounds and explore the futuristic play patterns.
The Main Frame
Playhouse Design
The Cubes
The Digital Screen
The Playhouse consists of 3 parts
The Main Frame
The main frame looks like a larger cube, made up with 35 fixed cubes that cannot be moved but can be lighted up. There is a transparent oled screen on one side. This frame is grounded and built tight and safe for kids.
Compared to kids' body sizes are different in ages, its 50 x 50 x 50 inch dimensions are ideal for children aged 4-12, accommodating both standing and sitting postures.
The Jelly Cubes
The sensor detects the input signal, causing the color of the internal light bulbs to change. Users can switch colors with each tap. (Note: Video loading time may vary.)
Materials:
Outer layer: Transparent silica gel;
Inner components: PVC cube equipped with light bulbs, sensors, and a microchip.
The Digital Screen
The Digital Screen is operated by finger touch. For instance, children can swipe up with their fingers to browse through all the Mini-Games.
The picture displays one of the mini-games related to drawing. In this game, the screen serves as a canvas where children can use digital brushes, stickers, and shapes, unleashing their creativity to draw and decorate.
The screen also allows children to visualize their custom playground: if a cube is placed or lit it will simultaneously appear on the screen.
My Design Highlights
Feature Redesign
In the initial design, the stacking feature of the Wonder Playhouse and the functionality of the Digital Screen feel very disjointed, giving the impression of two separate experiences.
The Digital Screen only has the drawing function, which is completely unrelated to the Wonder Playhouse's own Stacking Feature. I believe that Stacking and Building are very solid methods of play, so I don't want to make many changes. Instead, I aim to highlight this feature and modify the usage of the Digital Screen based on it to make them more harmonious.
Now, depending on the mini-games chosen by the children, the Digital Screen will offer more interesting interactions and clearer feedback in different ways.
For Example
As a scoring Tool
Become part of the scene or objects that kids build, and give more interesting interactive visual feedback.
As a drawing board
As tutorial board
etc
Gamification
I designed a variety of mini-games for the Wonder Playhouse.
In the process of designing these mini-games, I paid special attention to the needs and cognitive abilities of children of different ages, creating games that everyone can enjoy.
At the same time, considering that children sometimes play in groups of varying sizes, I designed games suitable for various group sizes. Of course, there are also games designed for individual play, ensuring that even when a child is alone, they can still find joy.
During the game design process, I spent a lot of time focusing on equality and safety in the design. Additionally, the mini-games should encourage children to try different things, to create and learn during play, and to learn how to collaborate and share tasks with others. For me, the educational and entertainment value of play should be the top priorities.
Player Interaction
In the process of harmonizing the digital screen with Jelly Cube Stacking, Jeff and I attempted to design various Play Patterns for the Wonder Playhouse.
My initial idea was to allow the Digital Screen to serve as a link between the virtual and real worlds, making the entire play more immersive. For instance, the digital screen would display levels in different environments, and children would need to cooperate based on the tutorial to build objects that might exist in these scenarios. For example, in an ocean scene, children might be instructed to build fish or starfish.
However, considering the number of available Cubes, technological limitations, and the clarity of player interaction and replayability, I ultimately rejected this idea.
Jeff had considered introducing a character with personality on the digital screen, which would guide, instruct, and teach the children how to play or what tasks to complete next. However, I rejected this idea because I believe in creating a free-to-play environment for the children, rather than having a "teacher" telling them how to play after school.
Our discussion about how to iterate this Wonder Playhouse went back and forth, but we finally both agreed with our final prompt.
Mockup for the Mission Screen