top of page
PDFS for PNG-02.png

Speak Out Loud

Zeichenfläche – 1.png

Learn a Language through conversation and Tasks

Content

​

      01 Project Overview

      02 Design Thinking Process

      03 Empathise

      04 Define

      05 Ideate

​

A foreign language is like a frail, delicate muscle.
If you do not use it, it weakens
– Jhumpa Lahiri

 

01 - Project Overview
Anker 1

Overview

Speak Out Loud is a concept project I started during my two weeks Intro to UX Design Course with CareerFoundry. The app gives users the opportunity to learn or improve a language through daily conversations and tasks. I'm native german, lived half year in Asia and did internships in spain and italy. I like to deal with languages and speak three languages myself.

Role

UX Designer

​

Duration

three weeks

​

Main Stakeholder

Careerfoundry

​

Tools

Adobe XD, Balsamiq, Typeform

Problem

Our User doesn‘t have an app, that helps learning or improving a language through daily conversations and interactive learning features.

Goal

Our User needs a way to learn new vocabulary so to travel confident and work in other countries. Our users Life goal is to see as much as possible from the world and to interact with people in different countries. We will know this to be true when we see that our world becomes constantly more connected - through digitalization and Covid19 remote work is rapidly increasing.

02 - Design Thinking Process
designthink2.JPG
Anker 2

Challenge

Contrary to Morii - the market for language learning apps is huge. Firstly this was a bit overwhelming and I thought "what shall I create what's not already there?". But soon as I started the design thinking process- I found out - UX is not about what I am - as a Designer am thinking. It is about - centering the user in all it's aspects and aligning design decisions with business requirements.

​

03 - Empathise

Defining the Competition

I started by conducting a competitive analysis of 3 different language apps, analyzing some of the positive and negative features that could help in the development of the app.

​

Anker 3

As a Language learner myself - I found it easy to emphasize with the needs/ frustrations of Language learnrers. I do speak german and english fluent and I have basic spanish and italian skills which I used and improved during my internships abroad. 

User Research

To understand if my previous assumptions and ideas are valid - I conducted user interviews.

​

Target Audience

I was able to interview three persons - which do have experience with learning a foreign language or are living in a foreign country.

Analysis

The next step was clustering these insights and creating a Proto-Persona for my project Speak Out Loud. Defining Emas user stories helped me in keeping focused on the needs, goals and behaviours of her, while designing the app. 

04 - Define

User Personas

Due to the short amount of time I took the findings and created one main user persona. Displaying her motivation, needs, frustration and key information helped me to visualize the user – we want to attract with the app.

​

With the Creation of my Main Persona Ema- I will center Ema in every future design decision taken. Visualising the User I am creating the app for is fun and makes the project realistic.

Anker 4
PDFS for PNG-02.png

User Stories

To help ideate User Stories were created. By mapping these journeys a deeper understanding of the users emotional state when seeking advice in their beloved field was observed. Using these information was a great asset to identify key features of the application.

PDFS for PNG-03.png
05 - Ideate

Task Flows

With the User Flow in Hand I started thinking about the Tasks Ema wants to accomplish in the App. This helped me to showcase all screens that would be needed to design for the app.

Anker 5
Task Flow 1
Task Flow 2
Information Architecture

Information Architecture

For each Task Flow a basic Information Architecture was created. This helped me to focus on each Step my Persona will undergo during the Task. Here I always asked myself: What would Ema do next?

​

​

06 - Wireframing & Prototyping

Doing my first Wireframe sketches was an exciting moment! With Pen & Paper I started to draft my ideas.

I created Low- Fidelity Wireframes for the Splashscreen, Onboarding, Login and Homescreen. Besides of those basic screens I concentrated to create Wireframes that helps Ema complete her Tasks within the app - Topic Screen, Buddy Meetup Screen. 

​

With all Low Fidelity Wireframes in Hand I created a basic Prototoype in Marvel. I found out that checking app Features in a early design process - is very helpful. Without having any coloured details - errors and unfunctionalities will be seen and clarified at a early stage of the design process. 

Anker 6
PDFS for PNG-09.png
PDFS for PNG-10.png
07 - Testing

Usability Testing

With a Low Fidelity clickable prototype in hand - created in Marvel - my next step was to perform usability tests. Due to the current situation these were remote moderated tests.

Preparing test scripts, finding test persons, moderating the tests and evaluating the test results were a lot I had on my desk. Each of those steps was given a time frame from me. That helped me to focus on every detail and to stay on track. The testing itself was fun even that those testings were more time consuming than I planned. I found out - that participants are quite talkative. But I know that doing Usability Tests will get easier and smoother as more often I do practice them.

​

During the test users were assigned situational tasks and their behaviour was observed. Errors were assessed using the Jakob Nielson scale.

The Goal of the testing was to find major issues of the app features.

​

Results

Through the use of a Usability Test Report I observed my findings. Each critique point got rated after it's severity and for each point I created a recommendation - how to do it better.

Anker 7
PDFS for PNG-11.png

Findings

  1. Homescreen Descriptions deleted and restructured

  2. Home Icon changed, Search Review, Upload Icon Added

  3. Wordings on Buddy Screen misleading

08 - Iteration

Based on the Findings I started to iterate the design. Here I concentrated to iterate the major errors.

Anker 8
PDFS for PNG-18.png
PDFS for PNG-19.png
09 - High Fidelity Wireframes

Happily I had a bit of time to rework on my Speak Out Loud app. After revisiting what I did so far - I focussed to create three High Fidelity Wireframes to showcase - main functions of the app and the idea behind it. Those are screens our persona Ema often goes to - to accomplish a certain Task within the app. They are part of the core functionalities of the app.

Creating High Fidelity Wireframes -  let me get creative and emphasize how I finally visualize the ideas from my research, ideation and test phase. As our Persona Ema is a young, modern and open-minded person this is reflected in the design and the UI.

Anker 9
Zeichenfläche – 1.png

Conclusion

Coming back to Speak Out Loud felt great! In this first project I've applied the design thinking process for the first time. Having only two weeks of time to see all basic steps come together felt often overwhelming. From my Background in Hospitallity I see many simmilarities now. In my prior career I as well focussed on what "guests" do need and want - I loved being the person who created memorable experiences for them - now I can see that this skillset is so valuable for my career in UX Design.

​

​

bottom of page