Unlocking the Power of Gamified Learning for Driving Education

In 2014, I embarked on a unique and challenging journey: designing the user experience for the first-ever mobile-first driver's education app for a fresh startup. At this point in time, the field of UX was still young, brimming with potential but lacking established practices. As a complete novice, I stepped into uncharted territory. My background in gaming caught the attention of the CEO. He saw in me the potential to translate the engaging and motivating elements of gaming into a platform designed to educate and empower teenagers. With no formal UX training, I relished the chance to dramatically change the way teenagers learn this important fundamental skill.

Role

• Lead UX/UI Designer

Team

  • CEO

  • Project Manager

  • 3 Content Writers

  • Animator

  • Engineer

  • Concept Artist

Industry

Edtech

Tools

  • Adobe Creative Suite

  • Sketch

  • Invision

Duration

  • 3 months

Challenge

Design an MVP for Aceable’s mobile-first driver's education approach with gamified elements. The objectives included:

  • Positive User Engagement: Make the app fun and interactive to keep users coming back

  • Design a state certified curriculum: Understand the state of Texas’ rigorous DPS approval process to obtain an important value for users, certification for a permit license.

Results

Clean and intuitive interface: The new interface is clean, uncluttered, and responsive making it easy to find the information you need on any mobile device.

Engaging content approved and certified by Texas DPS: This certified app includes interactive elements and multimedia content in a story driven environment with a mascot “Ace,” to keep users engaged.

Gamification: The app includes gamification elements, such as badges and rewards, to motivate users to learn.

3mo

of agile development for MVP

25K

Seed funding from MVP

#1 app

native app for Driver's Ed

“ACE, Aceable’s friendly animated robot protagonist, was Kai's brainchild. Kai, like ACE, has an affinity-catalyzing personality that infused both the product content and the product team with energy, fun and light. Her perseverance and flexibility through a lean, high-velocity first development cycle were key to the program’s ability to ship as fast as it did.”

Eric Bear

Capital Factory Investor & Mentor for Aceable

Gamification is a powerful tool for boosting learning outcomes

Based on a study by the Federation of American Scientists, gamified learning can lead to a 90% retention rate, compared to just 20% for passive learning methods.

Another study in 2014 found that when using a gamified course with levels, badges, and a feedback system, homework completion rate increased by 300%.

It’s abundantly clear that adding gaming features to make driver's education more engaging will result in better retention and safer drivers.

Competitive Analysis: The Open Road of Mobile Drivers' Education

In 2014, the mobile app landscape for driver's education was dismal. While some of the apps mentioned in the competitive research had mobile game elements, they were primarily web-based platforms with limited mobile functionality in 2014.

Potential Areas of Differentiation:

  • Personalized learning: Adapting content and learning paths to individual needs and learning styles.

  • Gamification: Implementing engaging game mechanics and rewards to motivate users.

  • Social learning: Creating a community of learners for peer support and competition.

Guerilla Research

During this fast-paced sprint, I didn’t have a great deal of time for user research, but I did conduct some guerilla interviewing of a handful of people at Capital Factory, the startup incubator in Austin, Texas which we worked out of.

Here are some sample questions:

  • What do you find enjoyable/frustrating about existing driver's education methods?

  • How do you typically use your phone for learning/entertainment purposes?

  • What are some rewards you would find motivating in a driver's education app?

  • Do you prefer learning through text, videos, interactive elements, or a combination?

What I learned from this process:

  • Most people found their drivers education boring

  • Most people wanted variety to diversified learning content, including text, video, and interactive elements

  • Most people believed that competition would motivate teenagers

From here, I created a user persona for the team to align around: Sarah, the Tech-Savvy Teenager.


“Kathy (Kai) joined Aceable as the first full-time team member. Her enthusiasm, work ethic, and creativity were paramount in building the foundation of Aceable. Her professionalism and competence were conveyed through her ability to synthesize data and multiple work streams into easy to understand internal and external communications and process guides. Her creative skills created our design aesthetic that she was able to apply through the identification and editing over 1,000 images for our topic specific education course.”

Blake Garett

Capital Factory Investor & Mentor for Aceable

Jessica, the Tech-Savvy Teen

By talking to parents of teenagers and asking people to recall their experiences with drivers education, I started to put together an empathy map and I produced a persona for the team to align around.

Laying out a Map for Success

In order for me to design an app that would pass regulation standards, I needed to understand the entire journey of the drivers ed permit process. I studied the DMV’s website and necessary documents and produced a user flow.

From here, I essentially created a site map of the mobile app and basic game mechanics, along with achievements that would motivate the student driver to complete the course.

Figuring out the content's tone

Now it was time to infuse the engaging content within the world, but I first wanted to get a sense of the Aceable’s brand direction. We decided to do an A/B test with online ads under the guise of driversed.com. One ad was more generic of existing ads for online courses and the other ad had more of a low brow humor angle. We found the latter ad to be more successful. This gave me a sense of what the content's tone need to be to appeal to our target users.

The Story Unfolds with the Birth of Ace…

I facilitated a brainstorming workshop with the team. I aligned the content writers on the roadmap for putting together the content.

We left the meeting with two contenders on the mascot. I did some more guerilla a/b testing in the office and we decided to move forward with: Ace, the friendly robot who had a tragic car accident on earth, and must redeem himself by teaching the users to drive.

After speaking to a state curriculum expert, I started putting a master list of the learning modules and the knowledge that would be assessed in each module. The content writers were tasked to flesh out the story, work on the script dialogue and put together quiz questions

I created a mood board and worked with a concept artist to create many variations of Ace’s moods to fit the various plot points of our story. These were very helpful for the animator to import into a cinematic editor to rapidly create multimedia clips for the course.

Lofi Screens

After having a framework of the Texas state certified curriculum and the story/world, I was able to merge the educational content with the gaming goals we set out. I started putting together lo-fidelity screens as the writers continued putting together the scripts. Here are select few of those screens.

Content Madness

The curriculum consisted of 16 chapters and over 1000 images – in various mobile sizes. I knew we needed to start acquiring the images while I kept iterating the designs. While I had the task of editing all these images, I enlisted the content writers to help with sourcing the images, so I made a course content “style guide” to assist them in both finding the images and writing goals which referred to benchmark knowledge that driving students needed achieve.

Ideating on the designs

With a good grasp of the information architecture of the app, and the game mechanics, I started ideating on the new wireframes. I wanted the visual style to be more playful and fun.

Final Results: Steering on the Side of Minimalism

Having just transitioned from the games industry, I had high hopes to incorporate the buzzy and viral Zynga aesthetics of that time, but ultimately taking a minimalistic approach worked best to reach a broad audience, appeal to parents and make producing for multiple mobile dimensions more efficient.

The final result was a gamified learning experience that not only engaged teenagers but also delivered impactful results. This was further validated by the impressive seed funding secured in June 2014, just 3 months after I laid the foundation for their MVP. Aceable's success stands as a testament to the power of user-centric design and the potential of technology to transform the learning landscape.

3mo

of agile development for MVP

25K

Seed funding from MVP

#1 app

native app for Driver's Ed

“Kathy (Kai) joined Aceable as the first full-time team member. Her enthusiasm, work ethic, and creativity were paramount in building the foundation of Aceable. Her professionalism and competence were conveyed through her ability to synthesize data and multiple work streams into easy to understand internal and external communications and process guides. Her creative skills created our design aesthetic that she was able to apply through the identification and editing over 1,000 images for our topic specific education course.”

“Kathy (Kai) joined Aceable as the first full-time team member. Her enthusiasm, work ethic, and creativity were paramount in building the foundation of Aceable. Her professionalism and competence were conveyed through her ability to synthesize data and multiple work streams into easy to understand internal and external communications and process guides. Her creative skills created our design aesthetic that she was able to apply through the identification and editing over 1,000 images for our topic specific education course.”

Blake Garett

CEO of Aceable

Reflection: Picking Up Design Foundations from the Road Less Traveled

Having put together this case study many years after the project's completion, I realized that this experience has not only shaped my professional journey but also instilled in me a deep belief in the power of design to empower and inspire.

Two lessons I wished I had imparted on my younger self:

• Document everything

In a startup setting, it's enticing to keep pummeling forward, but it's hard to track and dissect your design decisions. Is it grounded in data? Was it just intuition? What worked and didn't work, and why? These are questions that are left unanswered as I review this work.

• Empower your team to become researchers

Getting access to the insights of teenagers was difficult. Although I had done quite a bit of guerilla interviewing, my reach could've been extended had I asked for help from my team. This also would've supported the writers in their own responsibilities.

My Role

• Lead UX/UI Designer

Team

  • CEO

  • Project Manager

  • 3 Content Writers

  • Animator

  • Engineer

  • Concept Artist

Tools

• Adobe Creative Suite
• Sketch
• Invision

Duration

3 months

🖖 Live long and prosper

uxdesignerkaitran (at) gmail.com

🖖 Live long and prosper

uxdesignerkaitran (at) gmail.com

Kai Tran © 2024