Integrating AR to assist in learning development for children

stori

stori.jpg

Role

Research, Ideation, UI/UX,

Visual design, Prototyping

Problem

Duration

4 weeks

Tools

Adobe XD, Illustrator, 

Photoshop, Cinema 4D

With children today being digital natives, the need for technology-based learning has become increasingly more important. However, even with all its advancements, there is still a limited selection of AR-integrated tools for children that specifically relate to learning and literacy development.

Solution

Stori is an AR integrated storytelling and story-creation application designed for children (4-10) encouraging creativity, critical thinking, language skills, and literacy development. Reading and creating are some of the fundamental ways to effectively nurture a child’s overall development. Integrating AR into the learning process allows for higher engagement, more hands-on learning, and a kickstart into digital literacy. Stori combines the best of both worlds to create the most optimal learning experience for children.

With the application’s storytelling function, a library of stories is provided for children to read in an immersive AR experience; children are also able to incorporate their own imagination to create experiences in AR with the story-creation function.

mockup2.jpg

Competitive Analysis

I began researching competitors with similar products to better understand the current market opportunities Stori could fill. Here are key insights that I found:

  • Most competitors don't offer the age group 4-10

  • Most competitors only offer limited subjects and very specific features to explore (not multifaceted)

  • Some competitors require other technologies in order to function to full capacity

  • Some competitors only offer one platform to access the application

colour – 3@2x.png

Primary Research

To further my research I conducted user interviews with children ages 5 - 9 and their parents. I wanted to find out if kids would be interested in something like Stori, and if they thought it would benefit them. I also wanted to know if parents had any frustrations when it came to assisting in their child's learning development, as well as if they were willing to invest in a product that could help. Here's what I found:

Kids are interested in/want to improve their literacy skills

Kids believe that technology-based learning would help them with the process

Parents sometimes find it challenging to keep their child interested in learning certain skills

Parents are willing to invest in a product that assists with the process 

Personas

To summarize my research and findings, I created a PACT analysis and 2 user personas which I would base on when creating my user scenarios.

1 – 1@2x.jpg

* images taken from Unsplash

Ideation

After finalizing my research, I began ideating possible user interfaces and interactions that would deliver the user-friendly experiences I wanted to achieve.

Scannable Document on Jan 19, 2020 at 5_
Scannable Document on Jan 19, 2020 at 5_

User Testing

I got the opportunity to conduct a few user-tests to gain insight and feedback. Through this, I was able to better understand the problem and reiterate my userflows accordingly. Here were my main takeaways:

  • Include parental password protection before a child posts their content on the app.

  • Users should just choose preexisting creation elements instead of drawing their own: avoids unnecessary frustration and challenges.

  • Include a section for stories chosen for the user based on interest. This section should be updated weekly or so to keep engagement.

  • Sort stories into a few major categories to provide easier navigation.

Information Architecture

After revising the initial userflows with the feedback given, I developed the final IA for my scenarios:

untitled@2x.png

Wireframing

Taking the IA, I started building mid-high fidelity wireframes to map out the user interactions and overall layout.

process binder 2.png

Visual System

When developing the visual system, I wanted to ensure that it appealed to the target audience. This is why I chose bright colors and a more playful typeface to communicate a friendly, familiar, and welcoming tone. I also created a few illustrations to tie in the overall visual design of the application. I wanted to ensure that all aspects of the app were cohesive and fitting to the brand.

type@2x.png

Illustrations & 3D renders

ok-09.png
ok-08.png
ok-02.png
ok-01.png
sun.png
uh.png
1 copy.png
5 (1).png
3 copy.png
2 copy.png
4 (1).png
 
type – 1@2x.png

Onboarding

Easy & friendly user experience for first-time users when creating an account and navigating the app

ok copy.png

Reading a Story

Straightforward navigation system to find a story of interest and read it in AR

ok copy.png

Creating a Story

Helpful walkthroughs to make the story creation process as easy as possible for first-time users

ok copy.png

View interactive prototype here

Reflection

This was my first time designing an app along with its interactions, so it was definitely a huge learning experience from research to execution. I learned the value of modifying my design through various iterations in order to better suit my target audience’s needs; I learned to design every element with a purpose and function rather than just for aesthetic value; most importantly, I learned to thorough my research prior to designing to gain more clarity in the vision for the app. ​

 

Of course, there are still areas I want to improve on, like learning to further deepen my research and explore more possibilities in 3D rendering. However, given the time frame and original objective, I am satisfied with what was achieved.

Future thoughts:

  • Continue to conduct user tests and reiterate accordingly

  • Explore AR software to try and develop parts of the protoype

  • Explore more possibilities in 3D rendering

Check out my other projects ↘

>