Stamp Plate 2.0
“Make Mealtime Fun and Meaningful” — The Stamp Plate Project
UX & UI Design
Digital & Physical Prototype
Wizard of Oz testing
Concept Development Visual Design
In one of my previous research projects Stamp Plate 1.0, we designed an interactive plate that “playfully tracks and visualizes the food placed on top of it and later eaten off of it in the form of the stamp”. The 1.0 version was designed to explore the role playful technology plays in children’s early learning experiences. Using the Stamp Plate 1.0 as a technology probe, we conducted a field study with 14 families and 19 children in their homes. With the chance of getting stamps, we wondered whether or no the kids would eat more food and became more engaged during mealtime. We found that children ate more and became more engaged during and after mealtime. And at the same time, parents guided their children to explore ideas of data concepts and teach early numeracy skills while using the plate. If you are interested, please check this paper:
1.0 ☞ 2.0
Seeing the kids showed unexpected creativity and artistic interest while playing and dragging the stamps, I wonder how about adding more drawing-related features and interactions and turn the plate into a more functional drawing canvas? So, with the 2.0 version, I added a couple more new features and made some changes based on the curiosity that I have left from the previous version. To test out this idea, I initiated the Stamp Plate 2.0 project.
The design goal hasn’t changed, which is to continue exploring the role playful technology plays in children’s early learning experience under an informal learning setting, which in this case, it is after the family mealtime. Adding new features and interactions, I want to know whether these changes will help to expand kids' artistic interest and imagination or distract their attention from eating, which is the biggest concern of using this playful technology. So first, I plan to
Interface & Interaction Design
[Fig 1] Sketch for the interface design
Stamp Plate 2.0 has two main components, a tablet container, and a utensils container. The tablet will be sealed tightly within the container, serving its function as a dinner plate. And the utensils container keeps the utensils clean and in place when kids want to play with the stamps created after eating.
The UI & UX Design
UI: Compared with the 1.0 version of the food stamps design, which is simple and abstract, I added more detail to the fruit stamps for the 2.0. The purpose of making the stamps more real because I want to see whether or not having a fixed shape will limit kids’ imaginations.
*Trick: I applied the Patchwork effect from Illustrator’s Gallery Effect to simulate the grain texture of a real stamp.
UX: There are two key interactions for this plate: 1. Displaying the stamps while kids are eating, and 2. kids later can play with stamps. To achieve these two goals, I designed three different screens:
*Interactions were designed via Protopie and the prototype would be displayed on a tablet (iPad 6). The tablet is, of course, hidden in a laser-cut cardboard box.
[Fig 2] I used Protopie to design interactions
[Fig 3a] The Interactive Screen (the ‘Plate’)
Onboarding screen (the ‘Plate’): The first screen of the plate. It is also the screen that kids see when they eat and where they place the food. This screen will later display all the food stamps that children have created during the eating process.
Interaction dissection: Placing the fruits on the plate → Picking up the fruits → Stamps appear at the same place where the fruits are picked up → Switching to the 'Canvas' after eating → Organizing the stamps by using the organizing button
[Fig 3b] The Interactive Screen (the ‘Canvas’)
Interactive screen (the ‘Canvas’): This is an interactive screen that allows kids to rearrange, drag, orient, and zoom in/out the food stamps. The toolbar provides two functions: 1. the Stamps panel for displaying the number and the type of the collected stamps and 2. the Color panel provides color components such as square and oval for kids to play with it. (*the colors on the panel match with the food stamps.)
[Fig 3c] The Display Screen (the ‘Gallery’)
Display screen (the ‘Gallery’): This screen displays the pictures that children created by using the food stamps and the shape components.
Implementation: The Physical Enclosure
[Fig 4] I laser-cut a card box to hide the tablet and painted the dots with acrylic and markers. Since it is made for kids, I want the enclosure to also look fun :)
[Fig 5] I painted the physical enclosure with acrylic paint.
[Fig 6a] Assembled Stamp Plate 2.0
[Fig 6b] Assembled Stamp Plate 2.0
WoZ Testing & Analysis
Initially, I planned to evaluate this prototype with a family that has kids from 2 — 6. However, the reality is cruel and I wasn’t able to find the kids from that range. All my friends' siblings are older than the expected age range. Unfortunately, I wasn’t able to get feedback from kids, but at least I got some feedback from the adults by letting them play with this prototype. Referring back to the primary goals, I wanted to evaluate, in this case, adults’ desirability to use the plate, the usability of the plate itself, and the feasibility of the newly added features and interactions.
Based on the feedback, I realized there are definitely some improvements that are required to make for this prototype because most participants showed confusion when they performed key interactions.
[Fig 7] I printed out the stamps and using them to represent the actual food that would be placed on the screen.
What needed improvements:
What worked well:
It is nice to continue on the project that I have done before and it was such a pleasant experience to do something that I truly love it. When I laser-cut the perfect box for the tablet, I was reminded of the time when I made the enclosure for the 1.0 stamp plate, which was such a painful experience. At that time, I bought the boxes from the store and used a knife to disassemble and rearrange the box to the size we wanted. The enclosure made by hand-cut was rough and cannot be compared with the box that was cut by a laser-cutter. I see the benefits of learning different prototyping techniques.
* Initially, if based on the sketch, the toolbar provides a paintbrush feature by having the color panel matched with the stamps. However, due to the technology limitation, I wasn’t able to prototype this interaction without coding. So I gave up on this feature and replaced it with adding shape components.