top of page

TalkinEnglish

How do students with hearing impairments learn new language - a language that is not even their native? TalkinEnglish is a mobile app to help Indonesian students learn English through lip reading and sign languages.

Role

Experience & Interaction Designer, UX Researcher, Developer

Project Type

Proof of concept, digital product

Recognition

3rd Place of IEEE MadC Mobile Application Contest, 2016

Development

Rapid prototyping, Ionic Framework, HTML5, CSS, AngularJS

Project Timeline

September 21th 2015 - April 28th 2016

Project Link

github.com/vidianindhita/TalkinEnglish

prototype-2.gif
prototype-5.gif
prototype-6.gif

The Challenge

Create a learning system for students with hearing impairments

According to initial observation and interview in SLB-B Cicendo Bandung, one of the schools for disabled students with hearing loss in Indonesia, 74% of the students recognized it was very hard to learn English. However, 84% of them were indeed interested to learn it. They had been understood the importance of learning English because they wanted to communicate with foreigners. The biggest difficulty for them in learning English was the differences between pronunciation and spelling.

research.jpg
research-2.jpg
research-3.jpg

For students with hearing impairments, the biggest challenge to learn English as tertiary language was the differences between pronunciation and spelling.

The Approach

User-centered design for students with hearing impairments

Designing for students with hearing impairments is different from users in general. They are unique because they have some specific characteristics that normal people do not. Therefore, to genuinely bring the solution for their problems in learning English, I had to understand more about them through User-Centered Design (UCD) approach.

process-ucd-1.png

This development started with the user and task analysis, including user characteristics, goal, tasks, and environment. These analysis form a conceptual model. The model then evolves into prototype, consisting of low-fidelity prototype and high-fidelity prototype (prototype with data flow and interface).

The Discovery

Students appreciated English

Students were really interested and excited to learn English because they understood the importance of it. However, the learning tools for them to be able to learn English were limited. They couldn't really use some basic tools that other students could use since total communication was really important for them. They had to incorporate all means of communication: formal signs, natural gestures, lipreading, listening, etc. As a tertiary language, English was not really used in their daily life. That's why they still found it was hard to understand.

Insights.png

Insights from user research

The Objective

A learning media to get students accustomed in English

I did some user researches to know exactly what users needed. Based on qualitative researches directly to real users, below is the insights about what students needed:

  • An educational media to help students with hearing impairments to learn English.

  • It had to acquaint new English vocabulary, grammar, and syntax.

  • The interface should be visually appealing, to improve the visual interest.

  • It had to facilitate students to learn English easier.

 

The proposed user goals and tasks are needed to make the students more enthusiastic in learning English and to get user accustomed in using English.

User goals.png

Design Solution

Designing for specific users

To accomplish the user goals, I had to decide who was I designing for. Creating Persona was really helpful to keep in mind the target user. Based on user research at School for Disabilities SLB-B Cicendo Bandung, I grouped 3 personas. Meanwhile, there was one primary Persona in this project: Tony, a student who was motivated to learn English so that he could compete with normal students and used new technology much easier.

persona-4.png

User personas

Gamification as one of the design solutions

After doing many qualitative user research, I noticed that students loved to play games, physically or digitally. Even though they had hearing problems, but it didn't stop them from using technologies such as smartphones and computers. They needed more time to learn it, but they had fun once they knew how to use it. To make it more playful and engaging, I used gamification as the conceptual model: a Pop Quiz to learn English in a simple form relating to their everyday life.

Gamification.png
user-flow.png

Interaction flow

The Content Page consisted of 3 different levels:

  • Basic

  • Intermediate

  • Advance

 

Each level had 5-10 categories. The difficulty and categories of each level were mapped from students' English curriculum in class. I studied the teaching curriculum specifically in English course for elementary until high school to get the contents that would fit for the users.

information-architecture-talkinenglish.p

Information Architecture

From paper prototype to developed app

The faster the design could be tested, the faster we got feedback from the real users. That said, I created a low-fidelity prototype using papers before investing my time to develop a working prototype. Paper prototyping was really effective and efficient in terms of time and cost. It was an ideal solution to test whether the concept worked or not.

Paper prototype to test the concept

There were 3 iterations in total before I developed the app. I also created a high-fidelity prototype using Principle so that the users knew exactly how to interact with it.

High-fidelity prototype in Principle

Flow_2x.png

User flow: example for Family category in Basic Level

Iteration is really helpful in design process to get more insights. And the faster the design is being tested, the faster we improve the solutions.

Detailed Design

lofi-6.png
IMG_20160321_084540.jpg
lowfi.jpg
usability-testing-2.png
Principle-light.png

The Development

Encouraging students to learn more

The app was developed using Ionic Framework, a complete open- source SDK for hybrid mobile app development. It was built on top of AngularJS and Apache Cordova. The development was using web technologies: HTML5, Sass, and AngularJS. I decided to use web app so that it could be developed in both iOS and Android.

prototype-2.gif

Track progress

Users were able to track their progress on Home (Learn) Page. This would encourage users to learn more, since there was a reward (badge) after they completed a category in each level.

prototype-5.gif

Total communication

Total communication was an effective way for students with hearing impairments to learn new language. In this app, users could learn from lipreading and sign language at the same time.

prototype-6.gif

Friendly interface pop-quiz

The learning concept was an understandable pop-quiz. Pop-quiz was really effective to train users memories. I also had to design it in a playful way to engage users.

The Refinement

Measuring the success

usability-testing-1.png

Usability testing

The success rate was determined by quantitative research after usability testing was done. There were 2 main categories: User Experience and Usability Goal. For User Experience, users were asked if the app was appealing, helpful, motivating, and had a good User Experience. Meanwhile, the Usability Goal was determined if the app was learnable, likable, useful, and effective.

result.png

Usability testing result

After the development phase, I still had to do usability testing to know if the user goals were achieved or not. The usability testing was moderated-in-person, with 1 user and 2 testers: a person as an observer and another one gave the instruction, with the scenario:

  • Pre interview: The initial interview was done to perceive information of how users learn English generally.

  • Exploration: Users were given 3 minutes to explore the prototype. It was a stage to familiarize the prototype to users.

  • Tasks completion: After users explored the prototype, they had to complete several tasks to measure the usability goals and user experiences.

  • Post interview: The post interview was done to get direct insights of how users experienced the prototype.

  • Questionnaire: The questionnaire was done to gather quantitative data.

The Impact

Students were motivated to learn English

After I tested TalkinEnglish with students, the result showed that most of the proposed user experiences were accomplished, 3 out of 4 user experiences were achieved. Students considered that it was helpful and they were motivated while using the app. Most of the proposed usability goals also had been accomplished. The result in figure above shown that the prototype was useful, effective, and liked. More than 60% of users rated 4 for each component.

bottom of page