Story Planet: an English reading app for foreign kids

I. Background

Kassy Shen
7 min readNov 28, 2016

It all began with my four-year old daughter’s acquisition of English as a second language. Since she was a baby, I bought English story books and read for her. But there were cases that I was too busy to read for her. Almost at the same time, I heard of parents of young children looking for English learning organizations. On the one hand, people all knew that learning English is of vital importance for their kids; on the other, they complained that it’s not easy to find a proper organization. What are the problems of most parents in the process of learning a second language? Why is it not easy to pick a learning organization? Why don’t they try the existing learning apps? Is it possible for me to make research and design one or a series of apps to meet most of their needs? With all these questions in mind, I began my project. The goal was not that concrete at the beginning, but it surely would be a big need to dig out a better way of learning English as a second language.

So when we were asked to do a capstone project on Interaction Design course at Coursera given by professor Scott Klemmer from UC San Diego, I decided to make it my project.

II. My final solution

My final solution turned out to be a real simple one after my repeatedly modifying each version and cutting off the redundant parts. That’s because I gradually came to the conclusion that the best way to acquiring a second language is the combination of online and offline, meaning that kids and their parents need a series of easy-to-use apps which match the offline books or other learning tools. And my app here Story Planet will be just one of the series.

You may see the interaction prototype of my app at the bottom.

III. How does the prototype evolute?

The design has generally gone through the following process, during which I gradually adjusted my goal and made it well-targeted.

a. making observations and interview

b. collecting ideas and listing the point of view, gathering inspiration board

c. drawing paperboard and original prototypes

d. making in-person Heuristic Evaluation, modifying prototype based HE

e. drawing Sketch wireframes of the modified version

f. making Invision interactive prototypes for personal test, compiling my results and modifying into another new version

g. conducting online testing, concluding changes to made, redesigning to the final version

A. Observations and Interviews

Without hesitation, I made appointments and went to learning organizations and people’s homes so as to immerse myself into the real situation, observing what young kids and their parents did, and then interviewing them.

I detailedly observed four kids and their parents, and interviewed the parents, spending more than two hours on each pair.

I gained several phenomena mainly as below:

  1. Observe the kids

a. Kids perform better and learn more efficiently when they take part in active interactions.

b. Kids with little language acquisition before ten later turn out to be more afraid of difficulty language tasks.

c. Kids tend to be nervous in speaking in English even they can manage it.

d. Many organizations promise that they can help kids gain high scores at school, but the kids feel frustrated since they actually learn very little.

e. Primary school kids need help and feedback from parents in reading and speaking after class, but the latter in most cases are unable to provide.

2. Interview the parents

a. Most parents have no confidence on their own pronunciation and intonation so that they are unwilling to read to their kids.

b. Patient and excellent teachers are not each to find.

c. Good learning organizations are sometimes too far away, especially to the families living in small towns.

d. The fees are always expensive.

e. Parents are not allowed to enter classroom, which means learning effects are sometimes not easy to measure, particularly to very little kids.

B. Ideation

You may view all the need points I brainstormed below:

Then I conceived my point of view based on this: with encouragement and attractive interaction, kids could feel interested and confident in class, which is a long-time motivation of their learning.

C. Prototype

Having gathered five inspiration boards and concluded their strengths and weaknesses, I began to draw paperboards.

I’ve keep in mind that it’s always great to come up with as many scenarios as possible, so that we may compare and have choice in the tests afterwards. I presented two solutions here. The first is mainly about reading English stories, and the second about speaking English, both as a second language.

D. Heuristic Evaluation

This step should be emphasized, which includes description of problems, heuristics violated and their severity. Because as a designer, I think I need to evaluate my own designs from time to time to keep it clean, functional and up-to-date.

In HE, one of my classmates on coursera evaluated my prototype via Google Hangouts, then I wrote down the evaluation results in a table, reconsidered his suggestions and my own preference, and then picked the solution of reading, and made a change list based on it.

And I made changes on reading page, question-answering page and personal info page, including adding audio instruction before each new operation in case a little kid can not read yet, giving feedback for all the completion and achievements, changing the icons to a more easily-understandable one, connect achievement to the medals, etc.

Here comes the first revised version, and I made it interactive:

E. Personal Testing

Personal testing is also crucial, because a face-to-face test can always bring you the most accurate feedback even with a second’s hesitation in a click or a frown.

Based on the two testers’ feedback, I revised the above prototype by removing the book list choice and the ‘favorite’ feature for each book, and changing the way of answering questions into text form which will be automatically read out instead of just audio.

And here after the personal testing, there are two points that I was not that sure, one was whether there should be text in a story reading page, the other was whether one should read the whole passage again when he/she gave a wrong answer to a question. So I decided to make the prototypes into two new version for online testing.

F. Online Testing and Final Version

I had run a ‘dry run’ online test before a formal one. That means, I first sent the test order of one version to just one person and viewed his result before I went on to conduct the test among more persons, making sure it could run smoothly and accurately, and I could have a chance to modify certain things.

The ‘dry run’ was a good help to me, based on the feedback of which I thought of new ideas and evaluated my two versions, and again made modifications to make them other brand new two versions. I changed the name of the button before reading from ‘Go’ into ‘Start Reading’, removed the instructions on reading page, adjusted the play button on the bottom, changed the award system into a reading calendar. Just imagine, how happy a kid will be if there is a beautiful star on each date number! (The UI elements are to be polished.)

These two versions were ready to be tested online!

I hadn’t have expected that online testing done by only 4 testers would turn out to be so effective. They gave me many useful suggestions, especially those from a mom, with a 5-year old kid and a 7-year old one, who’s been searching for English reading as a second language, which brought me more confidence on keeping modifying and perfecting the product into a more practical one.

Finally, according to the online users’ test, I made my decision by choosing the version with the button ‘Start Reading’ and the ‘Calendar’ view. Then a title ‘Reading Calendar’ was added to the calendar page to make it less confused. Also I changed the scrolling way of reading into left-to-right paging, making it approaching the way a book it presented. And change the statistics.

Here is the final version prototype:

IV. A video show-up

This is my very first video of showing an app’s intention and how it meets the needs of its users, which is really simple. I hope it’s been made clear.

The most important thing of all, thank you very much Professor Scott Klemmer, Professor, Professor Elizabeth Gerber, and Professor Jacob O. Wobbrock for carrying out the program for us. Meanwhile, I’d like to thank my classmates for reviewing my assignments and helping me whenever I came across difficulties during the course.

If you also interested to learn about the program, check out UC San Diego’s Interaction Design specialization on Coursera.

— —

Thank you for your patience of reading. If you have any new ideas on my project, or any other suggestions, just tell me. :)

--

--