Go-Through and Review of A Real iPad App for Kids

* Side Notes: All pictures in this post were shrunk to fit the width of the blog. Click to view full-size image.

The iPad app "The Heart and the Bottle" (more info)

As mentioned in an earlier post, we downloaded a storybook app on iPad for analysis purpose. This afternoon we had a meeting and did a go-through of the app. Here is some comments we had, combined with relative screenshots.

* Side Notes: All pictures in this post were shrunk to fit the width of the blog. Click to view full-size image.

So the story begins..

"The Heart and The Bottle" is a interactive storybook app for iPad. It only has three buttons: Menu, Hint, and Read Aloud (the button with a speaker icon). There is also a folded corner for page flipping. As shown in the above screenshot, the grey dotted line is the hint shown when we click the Hint–button. It hints the reader to tap the book in grandpa's hand and drag the screen horizontally.

Everytime a new page is shown the readers may explore the picture to find out were the interactive parts are (in other words, some parts are NOT interactive). This is good for curious young readers to explore the wonderland inside the book, but also confusing because sometimes the interaction is well hidden, either too deep or at wired places. The hint button is very useful if the kids get tired of figuring out were the interactive parts are, they can tap the button and follow the instruction.

This is a example of the books creative interactive design: tap the sea to make ripples.

Then, we came to a page where the little girl and her grandpa are watching stars. Readers may connect the stars to create some simple shapes, and the little girl will tell what does it look like (for example, the shape in the screenshot above looks like a ribbon). It has a good learning purpose and teach the children how to interact and use tablets. However, for the naive user (which most kids are) it's a bit hard to figure out that it is actually requiring one-stroke drawing and that the user is supposed to imitate the shape from the small black figure. The small blue balloon (above the girl) will keep showing a big cross, which is a bit annoying and perhaps frustrating for children to understand.

Our alternative suggestion which we think is more adapted to children is to show a demo, perhaps by the girl, how to draw the shape between the stars (during when no tapping is accepted) at the beginning of this page. Not for every page, because it will therefore decrease the fun part of exploring the book but for all interaction that is more difficult to understand what to do and how to interact. That way it will be easier for children to mimic the required movement, interact themselves and without the help from elderly persons.

This is the second biggest usability problem with the book, it requires children to either have the ability to read the instructions (or Hint–button) themselves or to have someone helping them. It is difficult for small children without reading capabilities to understand/read the book themselves. It is our intention to create an interactive tool suitable for all children, with or without reading capabilities.

This is also a good one: drawing on the sea shore. It is very easy to understand for all children.

Another drawing session. It's intuitive to understand how to choose a color and how to draw, even erasing is easily understod. The problem with this slide is how to continue the story when you are done drawing. If the user want to continue as before, slide the lower right corner of the page, a HUD is displayed with options (textual information). This is probably again, frustrating for kids without reading abilities. To continue to the next slide/page of the story, the user must choose the third alternative "I'm done". This is not optional for children–interaction.

This is an example when the multi–touch function is used poorly. From the beginning the page has a white background but when swiped, another background is evolved. This is very fun, allowing the user to use the multi–touch function on a large space and frequently (very suitable for inpatient kids). The problem occurs when the user tries to swipe the lower right corner of the page, close to the folded corner. If a user swipes this corner the next page is displayed, perhaps before the entire page has been swiped to a different background. Instead the corner should be locked for one purpose only and that is to change page. That would offer better continuity, making it easier to understand and to use.

This was the most confusing page. Readers need to tap on something to let it disappear. This normally doesn't happen, because as a feedback of an action, adding stuff/changing shape is more obvious than letting things disappear. It took us long to figure out how does this page work, before when we kept thinking tapping on this page does nothing at all！

This is an example of an interactive task. The user is supposed to help, evolve the storyline by making the small girl grow. The user is supposed to drag the girl upwards to let her grow, and let the story continue with a big girl.

Here, the user is supposed to help the girl get the heart out of the bottle by shaking the iPad, which in turns makes the heart skip out of the bottle.

The girl is trying all kinds to break the glass bottle. Here readers can tap on different tools on the table to help the girl break the glass bottle.

The end of story, readers tap and drag to return the little girl (now grown up) her heart. This is another example of the Hint–function.