How might we nudge youth form a learning habit in a digital age?

In Summer 2018, I worked as a researcher and UX designer intern in a team of two at LRNG, an online learning community (NGO), aiming to help young people (12-18 years old), especially those from underserved communities, to learn tangible skills that they can apply in the future academic and career settings.

With no particular problem to solve, my client wanted us to kick-start a project that would enhance the overall user experience. Considering the time span of the project which was 10 week, we mainly focused on re-designing the onboarding process and one conceptual dashboard experience by applying a few theory learned from Persuasive Interaction Design.

The goal of our project was to communicate the value of the onboarding process as a missing opportunity for LRNG, and its potential possibility to help solve some uncovered problem they had. On the other hand, we hoped our design solution can nudge youth organically engage with the learning platform and start to form a habit as a lifetime learner.

PHASE 1: PROCESS OVERVIEW

Within 8 weeks, worked as a researcher and UX designer intern with another design intern, we were able to deliver a high-fidelity prototype and conduct two rounds of user testing.

PHASE 2: BUILDING AND UNDERSTANDING THE CONTEXT

Deconstructed layers to understand LRNG's first-time user experience, information architecture, and design language.

What is organization's POV?

To better and quicker immersed ourselves in the organization, we initiated internal interviews with LRNG staffs as one of the research approaches to 1. understand the organization's mission & value 2. understand their strategy & goal 3. find individual challenges relate to youth engaging experience that keeps them off the night. After a few interviews, we identified three key learnings.

LRNG's richness is underappreciated

The current data shows that most of the current users come to LRNG because of the external rewards. Once the rewards are not appealing, the page view turns down rapidly.

LRNG's language takes time to explain

LRNG contains "playlist, badge, project, XPs, LXPs, and portfolio", they're all connected in a certain way. Users learned how to negative from their teacher in the class or through word of mouth from their peers. (Staff complained have to explain the rule by self for the most of the time.)

LRNG is connected yet independent

LRNG has a network is composed of big cities, like D.C., Chicago, Detroit, etc, different networks have different learning materials & rewards which are un-sharable to the user outside the network.

What is user's POV?

LRNG has a specific user group which is mainly young people ranged from12-18 years old. To understand this group, we planned a workshop session and convened a few interviewees from YA (youth ambassador) to join in. Three activities were planned and the main one was "create mood board"- get to know how they feel about current LRNG & their ideal version.

Our takeaways from the workshop were

Less about school
More vibrant color
Delivering the sense of being in a group is good
Need positive energy
Some of the icons do not work well, the connection takes times to explain
Familiarity for credibility

YA WORKSHOP REPORT_SESSION 1

PHASE 3: PROBLEM DEFINED

Based on the stakeholders' interviews and YA workshop session, we generated four key learnings, there were

Youth

can't be explained in a single

sentence

has a limited attention span

Youth

Desire: Learning as experience

Fact: Rich in job-oriented context to prepare youth moving forward

Fact: Learning as being at school

Desire: Looking for entertaining context

Youth

believes in self-motivated and

flexible exploration

don’t know why they are here

before exploration

Youth

find it hard to get them right away

Unique & Structured learning

mechanism

"Using a new platform is like meeting someone for the first time. Your initial interactions could be awkward and confusing or there could be an instant connection.

In both of these settings, first impressions are everything!"

—Tom MacTavish, professor at ID, instructor of Persuasive Interaction Design

How might

reimage the on-boarding process that gets youth’s attention and facilitates discoverability

for the first-time user?

Moving from linear description to interactive story-telling.

Copy of Final Presentation - Google Slid

Original Version

Copy of YA_ Final feedbacks - Google Sli

Conceptual Design_On boarding + LRNG 101

PHASE 4: IDEATION & DESIGN

After presenting the research and confirmed the design challenge with PM, we initiated another YA workshop session-"Survey over web-based interaction". The goal was to inform us about the design language, and we tried to understand user's preference regarding the design of the interface, which included the degree of playfulness in interaction, the amount of information, and reference in trust-building.

Our takeaways from the workshop were

Short video clip can be a good way to communicate the abstract value
Peer to peer conversational interaction was more attractive to plain context
Text-heavy content made youth feel pressure
Current dark background paired with vibrant color easily attracted youth's attention

YA WORKSHOP REPORT_SESSION 2

FIRST ITERATION

What information do we want to communicate?

With limited help from the current website, we did a quick round sketch ideation to generate the key information that we thought worth to communicate based on the interviews and marketing strategies. There were: Form passion to profession; With real-world opportunity; Through badges & portfolio to showcase to the world; Want to be part of the Cool Kids Club?

A low-fid long page prototype was made to verify the message and got feedbacks from the PM.

SECOND ITERATION

As the overall concept was verified by the PM, she also poster another challenge for us. How to leverage the on-boarding process to better prepare users for LRNG's unique learning mechanism? And how to collect more personal data for the late tailoring use?

So we identified our goal was

Communicate Value- Context building
Create Interactive Experience- Bring in energy before exploration
Explain Features- Guidance for exploration
Collect information- Support data-driven service

https___demo.lrng.org_admin_pdf_WS_LRNG-

Second Round Wireframe

FINAL ITERATION

We did a quick user testing with YAs and LRNG staffs based on our second round prototype. With helpful feedback, we added more details and started to polish the final result- on-boarding process & LRNG 101.