GOALingo: A Language App for the Casual Traveler, aka, My First Experience in Rapid Paper Prototyping as a UX Design Student

Cat Anderson
11 min readMay 30, 2017

--

This is a case study write-up of a rapid paper prototyping exercise. My approach to this project was to stick to simple, low-fidelity artifacts in order to focus more of my attention on design thinking and the key concepts of UX design methodologies.

The assignment: Work with a partner to identify an everyday problem they have, then design a rough interactive paper prototype for an app that will help address their problem.

Methods and skills: User interviews, affinity mapping, sketching, user flow, storyboarding, wire framing, paper prototyping, usability testing.

The Research Process

User Interviews

The first step was meeting with my partner to find out what kind of an app would be helpful to her in her everyday life. We quickly began to discuss her passion for and experiences with international travel, and a few pain points that she has experienced as a traveler. As a frequent traveler myself, I could really relate to her problems, and we began to hone in on one of the most vexing obstacles to pleasant travel: language barriers….

The initial, exploratory user interview.

…specifically, the lack of good resources for people who want to learn some of the most basic words and phrases in another language, without starting from the ground up and learning a lot of vocabulary that is unlikely to be useful to tourists or casual travelers during a short stay (as one would in using an app like DuoLingo, for example, which is great for overall language acquisition, but not focused on travel-related themes or phrases).

My partner told me about two different instances where her (or someone else’s) inability to properly pronounce words in a foreign language led to a moment of embarrassment and anxiety, and this was the central insight that I took away from the user interview: a traveler who wants to familiarize themselves with a foreign language they will encounter before they travel does so to alleviate one of the biggest anxieties about foreign travel, which is not being able to communicate effectively, or sounding ignorant or uneducated in their exchanges with foreigners.

With the general concept for the app in mind, I went on to interview four more people with international travel experience, using open-ended questions focused on their pain points, their current ways of mitigating language barriers, and their travel habits, in order to glean further insights and ideas on how to approach an app-based solution. Questions included:

  • What are the biggest obstacles you face when traveling in foreign countries?
  • What strategies or technologies have you used when you’ve encountered a language barrier?
  • Have you ever attempted to learn a language before you’ve traveled to the country or region it is spoken? Why or why not? How did you approach learning the language?
  • Have you ever attempted to speak a foreign language while traveling? How did it go?
  • What types or categories of things would be helpful for a tourist or traveler to know in a foreign language?
  • What types of travel apps do you or have you used? Do you find them helpful?
  • Do you usually carry a smartphone with you when you’re traveling?
  • How do you organize your apps on your phone?
Conducting a user interview.

Affinity Mapping

From my user interviews I began to notice some patterns in how people approach language barriers as casual travelers, but an affinity map was the best way to help me organize these thoughts and insights.

I pulled quotes and insights from my interview notes and wrote them on Post-Its.

I then grouped the Post-Its by topic, revealing three major categories: Thoughts on Pronunciation; Thoughts on Content; and Thoughts on Travel Habits + Tech.

The three major insights that I deduced from the interviews and affinity map were that 1) people pretty much always have their phones on them when they travel; 2) they have remarkably unified thoughts about what language categories are most useful to casual travelers; and, most importantly, 3) knowing vocabulary or phrases in a foreign language is all but useless without also knowing how to pronounce them.

The Problem Statement

With the above insights in mind, I developed the core problem statement for the project:

International travelers need a way to learn and practice core travel-related vocabulary in foreign languages so that they can communicate effectively and not sound like fools when they are abroad.

and…

The Solution Statement

GOALingo is an app that provides casual travelers with a simple, targeted tool for learning core travel-related vocabulary and phrases in numerous languages.

Developing the App

Sketching

I began to envision how to approach the problem of learning traveler-focused vocabulary and phrases, focusing on integrating ways for users to get that crucial pronunciation part. My earliest sketches were literally just shapes and words in pencil, trying to get down the most basic components of how the app would look and function.

I’m not a naturally visually-oriented person so I found that writing things out as steps helped me develop my ideas, too. It was during this phase of the process that I came up with the name for the app, GOALingo. (“Go” is a word related to travel, but “goal” suggests focus and also contains the word “go,” and then “lingo” suggests language and ALSO contains the word “go”, so the idea is that “GOALingo” — with the emphasis on “goal”- communicates travel, focus, and language.)

User Flow

The biggest help to me in organizing my thoughts was creating a user flow, or a visual map of how I envisioned a user going about using my app to accomplish a task.

I went through a few iterations of user flow before settling on one that I felt was the simplest and most intuitive way for a user to accomplish a task in the app.

The user begins by downloading the app. This takes them to the home page, where they are asked to select what language they want to practice with. Selecting a language takes them to that language’s home page, where they can then choose from several topic categories. From there, they can either select from a list of words and phrases presented to them, or they can search for one. If they choose from the list, they will go to the page for that word, which will give them a written phonetic breakdown of how the word is pronounced, as well as the option to either hear the word being spoken (by a native speaker) or hear and see the word being spoken on a brief video; after they have heard or watched the word being pronounced, they have the option of repeating it. If they instead conduct a search for a word, and the word is not found, they will be taken back to the previous page and be asked to either select from the list or search again. Once the user is through with a word, they can navigate using navigation buttons back to the language or the main home page. (Note that the app provide three different ways for the user to get practice with pronunciation: phonetic spelling, audio, and audiovisual; this multimodality is a direct result of the importance interviewees placed on proper pronunciation.)

Based on the emotional foundation of my project — namely, alleviating stress and anxiety caused by language barriers — I knew that the app would have to be something that people would want to use both before and during their travel period. I gave some thought as to whether or not I would need to differentiate those two modes of use, but in the end I decided that it was unnecessary, and of better service to the user to keep things as simple and straightforward as possible, hence the single user flow.

Storyboarding

This next part was super fun! Creating a storyboard helps a designer envision how their app will be used in real life situations, and by whom. It is meant to be a simple yet engaging, visual way to communicate a user experience story to stakeholders or potential users, and it is a great way to validate your ideas, both to yourself and others.

Based on my user interviews and all the research and design work I had done up to this point, I came up with a hypothetical user and scenario: please meet Iris, who is planning a trip to Rome!

Please forgive my horrifying 3rd grade-level drawings.

The storyboard reveals both the practical and emotional reasons why Iris is interested in using GOALingo, and it also demonstrates the dual modalities of using the app both before and during travel, as well as the ongoing uses the app can serve after the trip.

Prototyping

Wire Framing and Paper Prototyping

Time to build out a prototype! My approach to this was to simply go through my own user flow, screen by screen, creating visual representations of what information and options each screen should contain, and how each one should (roughly) be formatted.

As I mentioned before, I had already gone though a few different ideas of how the app should be arranged as I was working through my user flow and storyboard, so by this point I had a fairly solid idea of how I wanted it to be. And my user interviews showed that people were in remarkable agreement about what content should be included, in terms of categories and specific phrases and words, making those decisions easy for me.

I had the loading page, the home screen, the Italian language home screen, the screen for the “Greetings & Etiquette” category, the screen for the Italian word for “thank you” (“grazie”), and the screens for hearing and seeing/hearing the word being spoken.

And now, for the moment of truth…

User Testing

To me, this was one of the most critical steps in the entire process. Everything can be perfect inside your own mind, according to your own logic, but only when other people are asked to use what you’ve created can you see how right or wrong your assumptions have been.

The paper prototype above is what I brought to my first round of user testing. I tested with four users (including the person for whom I had developed the app), asking them to imagine that they were preparing themselves, like Iris, for a trip to Rome.

A user interacting with my first paper prototype.

Interestingly, all four of my testers indicated a desire for a “favorites” feature, enabling them to save particular words or screens in one place, making navigating to those screens faster and easier. One user also suggested adding a “recents” function.

Other insights from this round of user testing included ways to simplify and streamline navigation, such as having both drop-down menu and smart search capabilities on the home page, adding the ability to search by country as well as by language on the home page, and ideas for additional features, such as lighting up a word karaoke-style as it is being pronounced, and adding a “language overview” component that gives users general information about a language, such as where it is spoken, how many speakers it has worldwide, etc.

Iterations

For my second round of user testing, I made changes to my prototype based on the ideas generated by the first round.

The most significant change was to the home page. From only being able to search for a language from a drop-down menu, I added the ability to search by country, a favorites icon (leading to a favorites screen), and a recently-visited running tab at the bottom of the screen, giving the user much more functionality from the get-go.

Iterated home page screen. New and improved!

I made changes to the Italian language home screen:

On the left, the original. Iterated screen, center. Added language overview screen, right.

…simplifying the page and adding the language overview function.

And I made significant changes to the “grazie”/word screen:

The two frames on the left are the originals, and the frame on the right is the new and simplified version.

… by integrating the hearing and hearing/seeing functions into the single page, thus simplifying things by cutting down on navigation. I also added the karaoke-style feature (the little dots underneath the word will light up as the audio speaks it), and the favorites button so that users can save the word to their favorites and find it more quickly and easily next time.

I was fortunate to have enough time to conduct another round of user testing…

No dogs were harmed in the making of this prototype.

…which revealed the fact that I had not given enough thought to errors, such as if a user search fails.

I decided that if a user search fails, they should be given the opportunity to report the failure, like so:

Search fail, pop-up #1.
Search fail, pop-up #2.
Search fail, pop-up #3.

All of the above are ideas and insights I would not have had if I had not conducted iterated user testing. USER TESTING IS CRUCIAL.

The Final Product

The final prototype.

The end result was an extremely simple but focused app prototype that demonstrates how a traveler might learn and practice a few basic words and phrases to help them navigate the language barrier in a foreign country. Not too bad for three days’ work!

Next Steps

  • I would like to enhance the visual appeal of the app with graphics or animation.
  • Research to see if a more extensive conversational video library would help users in their quest to master the basic words and phrases of travel.
  • Explore new technologies for an audio feedback feature, wherein users could pronounce a word or phrase into their phone and get instant feedback from the app about how well they are pronouncing it (red light/green light, e.g.). Interestingly, several users independently brought this idea up, but most said that they did not trust current voice recognition technologies to be accurate enough, rendering the feature useless.

Final Thoughts

Though this project was a whirlwind, I felt as though the building blocks for great UX design were all there. I’m glad that I did not stress myself out trying to use new-to-me programs to make things look pretty, and I am grateful that my partner had such an interesting, contained (!) problem to solve. In the future I will try to do a better job of documenting my process, both with notes and photos. I will attempt to manage time a bit better, and focus on details more. Onward!

--

--

Cat Anderson

UX designer. Anthropology nerd. Restaurant veteran. Venetian by nature, Mainer by nurture, Cantabrigian for love.