Language learning app for children with Dyslexia

App's mockup

About the application

The first Dyslexia (a specific learning difficulty) remedial therapy in the Urdu language, for primary school-going children, delivered through an engaging gaming experience.

To comply with my non-disclosure agreement, I have omitted confidential information in this case study.

MY ROLE

  • Team Lead
  • UX Researcher
  • UI/UX Designer

TIMELINE

4 months

MY PROCESS

  1. Problem Identification
  2. Desk Research
  3. User Research
  4. Information Synthesis
  5. Ideation
  6. Game Architecture Design
  7. Wireframing & Concept Testing
  8. Branding
  9. Prototyping / UI Design
  10. Project Management
  11. Usability & Efficacy Testing

01. Problem Identification

Dyslexia has been under-studied in Urdu and no standardized remedial plans exist for children with Dyslexia in the language.

Why Dyslexia?

Dyslexia is a common specific learning difficulty which affects one’s ability to read, with an estimate of 10% individuals with the condition around the globe. That’s ~ 790,000,000 people.

Why Urdu?

There is little to no research conducted on how Dyslexia manifests itself in Urdu, a language spoken by 60 to 80 million people in the world. Unsurprisingly, no standardized Dyslexia remedial therapies exist in Urdu either.

Why for Primary school-going children?

According to research, early intervention of Dyslexia is known to be effective for most individuals. That is, after diagnosis, the earlier the therapy is provided, the faster the child can improve their reading skills.

How might we..

design the world’s first Urdu learning application specifically for children with Dyslexia?

02. Desk Research

I wanted to learn about Dyslexia and about the Urdu language. Before jumping into desk research, I created an outline to structure my process:

Desk Research Notes

Research Outline

I studied:

  • Research papers
  • Books on Dyslexia
  • Remedial apps in other languages (Graphogame, Lexercise, Nessy, Starfall)

I created a basic knowledge map to serve as a reference throughout the research phase.

Knowledge Map

Knowledge Map

I realized at this point that there wasn’t enough information about Dyslexia in Urdu in literature.
Hence, I decided to reach out to 3 user groups:

  1. Clinical Psychologists
  2. Urdu Language Experts
  3. Educationalists

03. User Research

User group 1: Psychologists

I interviewed a clinical psychologist and a Dyslexia remedial therapist.

Study type: contextual inquiry
Interview type: semi-structured
Interview duration: 50 minutes

Major findings from the study included:

Research with Psychologists - Findings

Major findings from interviews with Psychologists

User group 2: Urdu Language Experts

I interviewed 2 Urdu professors who teach Urdu as a first and a second language.

Study type: contextual inquiry
Interview type: semi-structured
Interview duration: 30 minutes each

Major findings from the study included:

Research with Linguists - Findings

Major findings from interviews with Linguists

User group 3: Educationalists

I interviewed 2 Educationalist MPhil professors who focused on accessible educational tools for individuals with disabilities.

Study type: focused group
Interview type: semi-structured
Interview duration: 20 minutes

Major findings from the study included:

Research with Educationalists - Findings

Major findings from interviews with Educationalists

04. Information Synthesis

I combined findings from literature, video interviews and user research to create Proto Personas to empathize with my end-users and stay anchored on user needs.

Persona of a child

Proto Persona 1

Persona of a mother

Proto Persona 2

  • I realized how parents’ and teachers’ attitude towards a child’s academic struggles directly affects the child’s self esteem and motivation to study.
  • Most struggling students are filtered out as “too distracted”, “doesn’t try hard enough” and “is ill-mannered”.
  • Parents, especially in low-literacy areas, get offended when informed of the possibility of their child having different needs.
Reflection Map

I visualized insights I had gained from user research

I then designed an Affinity map to organize interview findings into themes and referred to it throughout my ideation process.

Affinity Map

Affinity mapping of interview findings

05. Ideation

Based on research, I started an ideation session. At this point, even the craziest ideas were jotted down on sticky notes.

Ideation

Ideation for a solution and features

Following this, my team and I grouped the ideas into themes and voted on using Mural’s dot-voting system.

Ideation Grouping
Ideation Dot Voting

Grouping ideas into themes and conducting a dot-voting session

My proposal was to design:

an adaptive, multisensory and engaging mobile game for children with dyslexia, aiming to help them learn how to read, spell, comprehend and become fluent in the Urdu language.

  • The answer options will dynamically change depending upon the child’s level and performance in previous questions. For example, for a higher level, the options that appear can be similar in shape or sound to the correct option - hence, making it harder for the child.
  • When the child incorrectly attempts a question, they will be scaffolded towards the correct answer via appropriate hints depending upon the incorrect selection.
Scaffolding demonstration

Demonstration: Scaffolding the child towards the right answer after an incorrect attempt

By employing Orton Gillingham principles, the game will include multisensory activities which involves children using a touch interface (smartphones or tablets) to look at the letters and trace them as their sound is simultaneously produced while prompting the child to say it out loud.

Tracing

Demonstration: Multisensory - the letter is displayed (sight) and its audio is played (voice) while the child traces the letter (touch) and is prompted to say its name out loud (speech)

  • By designing an engaging 2D game with gamification features: coins gained, character animation, mini adventure games.
  • By keeping activities bite-sized and focused on specific learning outcomes.
Gamification Demonstration

Demonstration: Use of gamification elements: companion, adventure game, coins etc.

06. Game Architecture Design

I designed a multi-tiered framework for the mobile game, description of which is confidential and hence, I have intentionally omitted it.

Game Architecture Diagram

A multi-tiered framework for the application

I created lists of Urdu words and letters which are known to cause confusion, which would later be used in increasing the difficulty of some activities. These lists included:

  • Letters that sound similar
  • Letters that look similar
  • Homophones (words that sound the same)
  • Homographs (words that are spelt the same way)

I designed a total of 10 lessons which target common skills individuals with Dyslexia struggle with:

  • Phonics
  • Phonemic Awareness
  • Phonological Awareness
  • Spelling
  • Reading
  • Comprehension
  • Fluency
  • Vocabulary
Lessons

Selective lesson cards displaying (a) learning objectives, (b) activities within each lesson, (c) target skills

Activities within each lesson were divided according to:

  • Increasing level of difficulty by:
    • Increasing the number of letters in the words presented
    • Introducing “tricky words” i.e. homographs or homophones
  • Different modality of questions - i.e. text, image, audio
Modality: Text
Modality: Images

Demonstration: Use of 2 types of modality to reinforce learning: (a) text, (b) images

I acknowledged that the dashboard served a significant part of a Dyslexic child’s journey to learn a language, hence I challenged myself to design a dashboard that not only displays results but also provides guardians with insights. I focused on 3 sections:

  • Progress: displaying overall progress of the child in terms of the number of letters, words, sentences and skills learnt
  • Performance: a list of words and sentences the child has mastered and the ones they need more practice in
  • A Deeper Analysis: a deep dive into each activity’s performance which displays a printable list of words and sentences the child attempted correctly and incorrectly
Dashboard: Progress
Dashboard: Performance
Dashboard: A Deeper Analysis

Demonstration: Dashboard screens

Not only does this microscopic monitoring aim to be extremely beneficial for psychologists and teachers, it can also be useful in identifying patterns of mistakes children with Dyslexia make in Urdu, a research avenue explored for the first time.

I have intentionally omitted confidential information here.

07. Wireframing & Concept Testing

I sketched out a sample lesson plan to test with user groups for feedback.

Lesson plan - 1
Lesson plan -2
Lesson plan - 3
Lesson plan -4

Selective activities from the lesson plan

Wireframes

Wireframes

I returned to the previously interviewed psychologists and language experts.

Major findings included:

  1. “To avoid rote learning, it’s important to repeat concepts using different modalities.”
  2. “To teach a complex language, it’s best to follow a sequential approach. Start with smaller units and then gradually move to larger (units).”

An insight I drew from these findings included:

  • Since multiple modalities were already being used, to avoid rote learning further, we could add multiple images corresponding to the same object to ensure children don’t associate an object with one image only.
Image 1 of the same object
Image 2 of the same object

Different representations of Pomegranate

I revisited the proposed solution:

an adaptive, multisensory, engaging and sequential mobile game for children with dyslexia, aiming to help them learn how to read, spell, comprehend and become fluent in the Urdu language.

  • Lessons gradually move from sounds - letters - smaller words - larger words - sentences.
  • Letter groups are introduced in a pre-defined unique order*.
  • New words are introduced consisting of only letters which are previously known for a particular letter group.

*Instead of introducing the Urdu alphabet in the correct order, I decided to follow a sequence of introducing Urdu letters, as designed by a renowned Urdu language professor, in an order that highlights aspects of the Urdu script that are most likely to cause confusion in terms of appearance or sound - suitable for individuals with Dyslexia.

08. Branding

It was time to focus on the engagement and gamification part of the solution. I created a moodboard on Milanote for the application to explore different illustration styles and find inspiration.

Moodboard

Moodboard

To stay focused on designing for children with Dyslexia, I closely followed the official style guide, prepared by British Dyslexia Association.

I worked with a graphic designer and an animator who designed a unique character for our adventure game. We chose a Markhor, the national animal of Pakistan to be the primary companion of the player.

Character

Character Design

I had learnt from literature that children with Dyslexia are highly demotivated and experience negative emotions when reminded of school. Hence, I actively wanted to avoid designing anything even remotely related to education/schools.
After discussing my ideas with colleagues, I decided to go with an “outdoor adventure” theme - something that excites most children.

Theme: Cricket
Theme: Skating
Theme: Underwater
Theme: Road

A glimpse of the outdoor adventure theme

I wanted the look and feel of the application to be warm, cozy and exciting. Hence, my design decisions included:

  • Using a warm color palette
  • Using components with a large corner radius - buttons, dialogs, text fields etc.
  • Using playful sounds effects and background music
Branding - UI Components and Color Scheme

Selective UI components and Color Scheme

09 Prototyping / UI Design

I translated wireframes into high-fidelity interactive prototypes using Adobe XD.

Rawaaan UI Design Banner

Main Menu & Profile Creation

Main Menu - Isometric Land 1
Main Menu - Isometric Land 1

Main Menu: Isometric lands with 10 lesson paths

Profile Creation - Screen 1
Profile Creation - Screen 2
Profile Creation - Screen 3

Profile Creation Screens

Selective Activities

Roller Coaster Game Demo

Blending letters to form words

Platform Game Demo

Sound-Symbol Association

Football Game Demo

Spelling and Segmentation of words into letters

Skating Game Demo

Sentence Completion with Comprehension

10. Project Management

I took lead and managed the project by coordinating with:

CONTENT CREATORS

who collected an extensive list of 3000+ words and sentences from Urdu coursebooks

GRAPHIC DESIGNERS

who designed the game character and images for words

GAME DEVELOPERS

who developed the game in Unity 3D

PROFESSIONAL VOICE ARTISTS

who recorded letter sounds, letters, words, sentences and instructions.*

DATABASE DESIGNERS

who ensured data structures are flexible enough to support multiple languages

*I ensured that recordings all the way to phonics are clear and accurate - given how important this is for our target audience.

Final Product's Demo

Rawaan's demo video

11. Usability / Efficacy Testing

The next phase is to conduct a long-term study by testing the mobile game with users, i.e. primary school-going children with Dyslexia to determine the efficacy of the solution. Due to the ongoing global pandemic (COVID-19), this phase was delayed.

Retrospective

I’m deeply passionate about this project and have always wanted to do something for children with Dyslexia, especially after watching the Bollywood hit “Taare Zameen Par”.

I learnt a great deal since I wore multiple hats throughout the course of this project. I not only followed a full design cycle, but also supervised the product as it was getting ready for commercial-use.

One thing I wish I had done differently was involving end-users (children with Dyslexia in Urdu) since the start and perhaps, co-designing with them might have presented unanticipated UX challenges that I would have dealt with during the initial phases. Due to COVID-19, we were not able to conduct testing with children but we plan to do that in the future.

More Projects