Reinventing the language acquisition method through IMMERSION.

REFOLD

CASE STUDY // JUL - SEP 2023

ROLE

App Redesign
UX Researcher
UI Designer

OVERVIEW

Refold is a new language acquisition method that educates and helps first-time learners reach their language fluency goals by promoting “immersion Learning”, the act of consuming native content in conjunction with SRS learning, a modernised approach that strays away from your typical textbook learning.

PROBLEM

As someone who recently took on the challenge of learning a new language, I experienced the inconveniences that came with searching for the ‘best’ approach to language acquisition. With numerous different methods of learning available, I wanted something that was not only fun and engaging, but it needed to flexibly cater to my daily schedule, and most importantly, work.

I ultimately adopted the Refold methodology, however, it required a combination of multiple tools and apps to be used in unison together. This got me thinking; what if all these tools were combined into one centralised app, making learning that much easier for beginners.

OBJECTIVE

The objective was to understand the frustrations of users beginning their language-learning journey and utilise findings from research to create a fully functional app that embodied the ideologies of Refold.

This was a case study conducted under the Academy Xi program where I learned the fundamental theories and skills in User research, User Interface design and practically applied them to create the Refold app over 2 months.

PATH TO UNDERSTANDING

APPROACH
Background research on language learning was conducted initially in order to broaden my knowledge before attempting to ideate and solve the problem.

I first created a scoping framework overviewing my initial thoughts with approaching the problem. This would be subject to reiterations as I progressed with my research.
INTERVIEWS AND SURVEYS
Understanding the user's approach to language learning and their wants/needs was done through online quantitative surveys and in-person qualitative interviews. This helped reframe the perspective of the underlying issue from the users eyes, whilst competitor analysis allowed me to observe the market for any notable success/pain points and ultimately see what methods worked well.
Using Survey Monkey to retrieve quantitative data, the online survey with 25 respondents revealed an overwhelming interest in learning a new language. Surprisingly, they chose to learn through immersion/visiting the country instead of the traditional grammar textbooks.

Interviews consisted of 2 experienced learners and 2 unexperienced learners. All participants pushed the idea of learning through daily listening of the target language, whilst textbooks be used as a supplementary source of learning.
COMPETITOR ANALYSIS
Competitor analysis on the current language learning market revealed strengths/weaknesses in each of the competitor's apps, allowing for consideration of what worked well and how it could be integrated into the Refold app.

Among the competitor's, I downloaded and used Duolingo, Falou, Babbel and Memrise to explore what each app did best and reveal what was lacking.
DUOLINGO
FALOU
BABBEL
MEMRISE
Duolingo - "Game-ify" the learning experience
  • Simplistic UI with complementary graphics
  • "Game-ified" journey map like Mario, streak system promotes daily repetition and goals
  • Native pronunciation
  • Side bar with specific learning modes to choose from
Babbel - Live class learning
  • Introduction page with choice of languages
  • User expectations/goals and time commitment
  • Optional methods of study: Self-study or Live classes
Falou - Learn by Practice
  • Introductory video showcases Falou's alternative learning method
  • Simple homepage and straightforward options of learning
  • Goals/achievements system
  • Native audio and voice-graded audio
Memrise - Alternative learning options
  • Introductory video
  • Immersion videos with native audio to increase exposure to language
  • Speech input for native accent pronunciation
  • Daily goals tab for users to determine studying style

DEFINING THE PROBLEM SPACE

AFFINITY MAP
The information gathered through the interviews, surveys and user research was then condensed into defined categories to organise the information structure;

Experiences/ Observations, Wants/Needs and Issues.
EMPATHY MAP
Empathy mapping was the next step in the process to further synthesise my research from a human centred perspective.

The active thinking of the 5 senses proved useful in reaching a state of empathy for the users.
INSIGHTS
This iteration process came to reveal crucial insights along the research journey of users in a language learning problem space. Within the middle of my Affinity Map, the issues that surfaced became the main focus of my design.

I turned these into the following quotes that represented the thoughts of struggling language learners looking for the perfect app to support their learning journey.
“I have attempted to learn a language before, but want something that’s less study-like”
“Ideally a mix between learning vocab/grammar and immersion learning”
“Something that can flexibly cater to fluctuations in schedules, moods, motivations”
“Something that can flexibly cater to fluctuations in schedules, moods, motivations”
PERSONA
From this understanding, I created three distinct personas that aimed to highlight and offer insights into their wants and limitations of the user experience. After careful consideration, I decided Lillian would be the main persona as her frustrations fit more in line with the direction I wanted Refold to head in.

IDEATING A SOLUTION

With a clear persona and research insights to base my ideation solutions off, I began to ask myself questions on what users would need and how I would go about creating that experience within the app. How Might We statements were perfect to bring the ideation stage to the next step of the Refold App.
HOW MIGHT WE
A frame of innovative thinking was provoked through How Might We statements. The goal was to give focus to the thought that a solution was possible and bring to light the variety of ways and perspectives the problem could be approached from.
  • Dedicated services home page to differentiate between offerings and outcomes
  • Consolidated pages
  • More intuitive navigation for better content discovery
  • Information phrased appropriately to appeal to both the individual and group services
How Might We facilitate a language learning app that flexibly caters to a users daily schedule/mood/ motivations?
How Might We create a
user-friendly UI that lessens distraction and increases focus and motivation on learning the language?
How Might We create a language learning app that gives users a sense of progressions through their journey?
OTHER IDEATING METHODS
Different ideation methods were used to develop solutions in a large quantitative mass. How Might We statements were done first to place focus on a possible solution. Other ideation methods were produced to visualise the many solutions that came to mind and then sorted through them in importance, ease and relevance. Storyboarding and Crazy 8's fueled the context of the app in the user's perspective.
INFORMATION ARCHITECTURE
Finally, utilising my primary persona, I mapped out the list of actions users would conduct throughout the app’s experience, from first launching the app to multiple options accessible from the main screen. It was also important to note two separate actions for both ‘First-time’ and ‘Experienced’ user journeys. I heavily referred to this IA, making adjustments whilst I was creating my low-fidelity wireframes.

DEVELOPING THE PRODUCT

With the research and ideation consolidated, it was important to set up a design system that reflected Refold’s brand. Fortunately, Refold has an existing website where they advertise their language-acquisition services, so I chose to closely reference their visual style and assets to set up my style guide.
LOW-FIDELITY WIREFRAMING PROCESS
Lillian’s primary user flow was developed whilst also constructing the LO-FI Wireframe iteration of the app. I designed with the intent of a smooth process for users of the app, from first launching, log-in process, to the selection of available languages to learn and preferred study goals, and ultimately a first look at the SRS learning process and user interface, subject to later alterations in the HI-FI mockup.
After being happy with how the wireframes turned out, I proceeded to build interactions and graphic designs of all actionable journeys, from SRS learning, searching for Language Coaches, Extra Learning and User profile for a working prototype
I found it important to utilise library components to not only speed up the development process, but to increase consistency across the entire app’s visual language, allowing for smooth continuity along the learning experience.

BRINGING REFOLD TO LIFE

INTRODUCTION
Utilising the graphic theme Refold originally has, I wanted users to be greeted by the origami logo, followed by the login page. Simple and straightforward, I wanted seamless transitioning between each screen, making the journey to choosing the desired language to learn and the daily goal simple and easy.

The last screen to finalise the introduction would be a video introducing Refold and their method of language learning.
LEARNING EXPERIENCE
Users will be able to choose from a list of introductory SRS (spaced-repetition-system) vocabulary decks to learn from. On the right, a number will indicate how many new words will be learnt (gold) and how many words to be reviewed from past days (green). An option to add a new deck is also available as a button.

The following screens show the process that users will experience whilst learning a new language. Pass or fail buttons simplify the process of deciding whether the word is learnt or not. Users will need to pass a card two times to clear the card.

In the case of a language using more than one script (Japanese uses 3 different scripts; Hiragana, Katakana and Kanji), the cards can provide an alternate script above the word after clicking the "eye" button. An example sentence provides context, as well as a drop-down showing the translation. The volume button provides a native voiceover of corresponding vocabulary words/sentences.

Once the deck is complete, a streak will commence/continue, revealing the number of days in a row the user has completed their daily goal.  
OTHER LEARNING OPPORTUNITIES
With a bottom navigation bar, the Refold app provides alternative learning opportunities for users to explore.

One page navigates to an in-built community of teachers specifically catering to the language the user has chosen to learn. The option to book and communicate through the app is a feature within the app.

An extra learning page provides more chances for users to further their learning of either grammar, accent and general knowledge vocabulary. In this case, users learning Japanese are able to learn about the different scripts used in the language (Hiragana, Katakana)

Finally, users will be able to track their progress via their profile. Here they are able to see their daily reviews, hourly breakdown and other progress related statistics.

THE REFOLD APP - FINAL PROTOTYPE

For this prototype, please select Japanese to proceed :)

TAKEAWAYS

Conducting this case-study was a great learning experience and taught me a lot, from ideologies, theories, techniques and the importance of framing the perspective from the user. It taught me to really trust the research process, and that the double diamond was a tried and tested technique that drastically improves designers abilities to truely pin point the problem in projects and come up with compelling solutions that really work in real life.

It made me realise that I subconsciously applied these techniques during my time working as an interior designer creating interior fit-outs/exhibition stands for clients. Conducting research and drawing inspiration from competitor's, communicating with the client, creating sketches and mapping out what worked were transferable techniques that brought a sense of familiarity when making the switch to UX/UI design.