Learning the LinGO!: Designing a Mobile App to Help Immigrants Learn English Slang
Designing a Mobile App to Help Immigrants Learn English Slang
Team: Catherine Guevara, Corinne Herzog, Kevin Yang
👋 What’s up?
Slang and informal English language are an important part of our social lives and in self-expression. English language learners, such as immigrants to the United States and people who speak English as a second language, often have trouble learning and using slang and informal English in their everyday lives. Due to the ever-changing nature of slang and how ESL students tend to learn more formal English in the classroom, they do not get as much exposure to slang and informal English and thus have more trouble learning and using it. Learning slang and informal language helps people make connections with others better and integrate into their communities much easier. After our research in surveying and interviewing ESL speakers and teachers, we decided to design a mobile application that allows ESL speakers to meet up and converse with native English speakers. We wanted to design a more immersive mobile application rather than a simple dictionary, word search engine, or vocabulary-learning app, as we found people have learned slang the best through talking with native speakers and going out to regularly practice speaking informal English.
💭 A Way to LinGO! About This Problem
We’re introducing LinGO!, a mobile application that lets people meet up and chat with native English speakers online and in person. People are also able to join interest groups and RSVP to events to meet up with more people, learn English together, and make new friends. LinGO! also allows people to find others with similar interests you can talk with. Alongside this, the app contains several scenario videos to show people how to navigate through certain social situations, with native language translations to aid in the learning process. In order to encourage people to use the app and actually meet up with those they meet on the app, we added a quests feature that suggests to the user things to do (eg RSVP to a group event) which can be completed for points. The points could potentially be used to customize an avatar or for discounts at participating businesses, this is a feature that still needs to be ironed out.
📋 Paper Prototype, Testing Process, and Results
After we conducted our user research, we sketched multiple designs before eventually incorporating aspects of all three designs into our paper prototype for LinGo! We identified tasks that users would perform using our app.
These include:
- Accepting a quest to join a group, and successfully finding a group to join and RSVPing for an event
- Finding an individual to chat with through the “Find People” feature
- Watching scenario videos that would walk them through potentially tricky social situations
We chose tasks one and two as our two main tasks to focus our user testing of our paper prototype in.
Here is an overview of our paper prototype:
Task 1: A Creative Conundrum: Joining a Club
Task 2: Meeting a new friend and chatting with them
User Testing
We conducted user testing of our paper prototype with three of Catherine’s friends. We independently had each user try to work their way through each of the two tasks. One of us acted as the computer to hand them various pieces of paper as they moved between frames. One of us took notes, and one of us acted as the facilitator to inquire about their thoughts on the usability of our interface.
We did run into a number of critical incidents where users were unable to determine between buttons and static text and thus couldn’t figure out how to move on to the next frame and complete the tasks. This led us to change our prototype to more clearly differentiate buttons from text through shading and stronger outlines around buttons. Users also seemed confused about the tasks so we added more information to each task description. Users also told us that they would prefer for clubs on the map to be sorted by distance. In our digital prototype, we incorporated all of these changes and feedback as we’ll show below.
📱 Digital Mockup
Decisions made from paper to digital
Visual Design
As a mobile application that encourages people to go out and interact and meet native English speakers to help them learn, we wanted to convey that sense of adventure and action with the visuals and color scheme. Orange and yellow are used for energetic and enthusiastic themes, so we chose those as the main colors. We stuck to these four base colors (orange, yellow, brown, and white), along with variants of different opacity, to keep a cohesive design.
The font used for titles and the logo itself is Luckiest Guy which we used for its playful, bold look to further emphasize our adventurous and energetic theme. To complement a bold, sans serif font, we went with the font Questrial (we wanted to use the highly visible Atkinson Hyperlegible but it was unfortunately not available on Figma to use) for the body text and sub-headings. Since Questrial did not have a bolded style, we used Quicksand, a font that looks similar to Questrial, for bolded headings and other things that needed to be bolded. Overall, we wanted to stick to one or two main fonts to keep the design simple and to not overwhelm the user with too many fonts going on.
We rounded the corners for buttons, panels, and most UI elements to give a sense of friendliness in the app, since it’s supposed to be a welcoming application, and kept buttons and UI elements flat with the use of a slight drop shadow to emphasize that something is a button.
User Interface Changes
In transitioning the design from paper to digital, we found that visual design choices that were harder to communicate on paper became easier in a digital format. One example of this was the buttons. In making the paper prototype, we’d often be forced to signify that something was a button and in-focus by drawing borders around it or trying to darken it, whereas for the digital prototype we used color a lot to draw emphasis towards certain visual elements. Rounded corners and shading also helped us indicate that something is a button. Since the digital prototype is higher-fidelity, more visual detail was added in the form of back/forward buttons, scroll bars, profile pictures, more detail to the pop-up windows, and a more consistent visual style.
We also decided to make some user experience improvements as well, as well as flesh out the process of logging in and creating the user profile. As such, we added a homepage from which a user can log in and/or create an account, as well as a new account creation set of frames that allows the user to create a username and password, select their native language, and select some of their interests in order for recommendations to work when finding people. We also added more detailed descriptions to each quest because during our user tests users said that quests were confusing. Finally, we added event previews to the “Groups near you” page to make it easier at a glance to see what happens at a particular location or club.
You can find our final digital mockup at this link: ✨ Figma mockup
Task 1: Joining a Club (meeting with a group/for an event)
First, the user can enter the app and log in. Then, they navigate to the quests page where they see that they have a quest to join a group. They can click on the quest to see more information.
In order to join a group, the user navigates to the “find groups” page in the toolbar. From there, they click on the “Page Turner Bookstore” group highlighted (as an example) as being near them and matching their interests. This navigates them to the group information page for this group, which showcases group events, location, and lets the user chat with group members. The user decides to click on the “Chat Casual” group event. This takes the user to the page for that event, which shows when it is and who is attending. The user decides to click the “Join” button, which changes to green to alert the user that they have successfully RSVPed to the event.
Now, if the user navigates back to the quests page using the toolbar, they will get a popup that their quest is complete and be rewarded accordingly.
Task 2: Business Meeting (meeting/chatting with a single person)
For this task, we will give an example of a new user creating an account and finding a single person to chat with.
The user opens the application and clicks the sign-up button since they are a new user. From there, they are directed to enter their information, select their native language, and pick at least 3 interests. This will create their profile and help the application suggest people/groups for them. Since the user wants to learn more about her coworker’s interests, she can fill out her profile accordingly.
Once the user creates a profile, they navigate to the “Find People” page which shows a list of recommended people for them to meet based on their profile. They can click on one of these people to go to that person’s profile. This shows them the interests of that person as well as the groups that they are a member of. If the user is interested in chatting with this person, they can click on the chat button which takes them to a messaging conversation with this person. If the user taps on the “click to type” button on the bottom of the screen, a keyboard pops up.
If at any point the user exits the app and desires to continue their conversation with someone, they can simply re-enter the app and click on the “messages” portion of the toolbar, which will take them to this page. This page shows all of the active conversations a user has, and a user can simply click on the name of the person or the group to return to the messages with that person or group.
Now the user has successfully found a person to chat and/or meet up with that has similar interests to the ones the user wants to learn!
😊 The Cool Way to Learn Slang
In short, LinGO! offers a way for English Language Learners (ELL) to meet up with native speakers and have an effective way to learn informal English. Having the platform be specialized towards language learning while still being about common interests means that there will be an incentive for both native speakers and ELLs to join. For native speakers, finding those with common interests, learning from those speaking a foreign language, or just helping others out with English offer good reasons to join our platform. For ELLs, they get to enter a more inclusive environment whose specialization around informal English learning means that there’s less fear of saying the wrong thing or freezing up in an unfamiliar situation while offering them the opportunity to immerse themselves more within the local culture and learn informal English. In terms of future developments, there is an opportunity to flesh out the points system more fully as well as work on issues of safety to mitigate some of the ethical risks that come with creating an app that involves meeting up with strangers in person.
