Chloe Xufeng, Emma Zhang, Ian Tarter, David Toledo

WebLingo is a project that aims to help people who are either learning a new language, or are trying to improve their English. The project is still in development, but it aims to provide real world examples of languages being used on the web.

First Iteration

In this first iteration of designing Weblingo, we individually took into account the feedback we recieved from our interviews held. The key aspects are:

• Translation: The translation feature allows users to translate any text they find on the website. This feature would be first thing someone who is using a language chrome extention would expect.
• Pronouciation: Being able to hear the word you are trying to learn would be an extra step of study for anyone learning new vocabulary.
• Quizzes: One of the main parts of the learning aspect of the extention is the quiz function which both of the interviews I conducted agreed would be benificial to have.

Second Iteration

In the second iteration of designing Weblingo, we took into account all of the feedback we recieved from each of our interviews that we held. Having have taken a fictional inquiry aspect towards collecting data, and having provided images to draw on, we used these as inspiration alongside with what was said about what someone would be looking for in order to decide on our own version of Weblingo. Quotes such as "stay up to date in terms of the new words that are formed on the internet so that if I highlight something that's like probably a new trend. It can still understand it..." help us understand what the user would be looking for in a language learning extention.
Looking at everyones transcripts, we analyzed the feedback using an affinity diagram, and create codes that would later shape our requirements. After looking at what everyone came up with, we reached a consensus and created 3 main requirements for the project.

Requirements

Translation: Changes words from one language to another, as Users want to get the meaning of the words directly.
• Interaction Flow: The User can click on the translation button and then hover over different text on the webpage they are on to see the traslation of the word.

Quizzes: The plugin will quiz users with either multiple-choice or free response questions, as Users want to actively participate in the learning process and make sure they actually know the words they are trying to learn.
• Interaction Flow: The User can click on the quiz section from the main page and then proceed to take a quiz with their score being accurately recorded.

Remembering: History of translated words: The plugin will have a history bar where it stores words that the user has previously translated, as Users want to remember words/phrases learned as language learners.
• Interaction Flow: The User can click on the history section from the main page and then be taken to a page which would ideally contain all of the words they have seen throughout their time studying.

The main focus of the second iteration was to create a more user friendly experience for the user. I wanted to make sure that the user could easily see what the expected functionality of the trasnaltion, the quizzes, and the history sections would be, and therefore focused most of my time on creating the functionality of those aspects.

Third Iteration

When preforming my UX Evaluation, I decided to use the sticky note method. I wanted to see how the user would interact with the prototype, and therefore I asked them to think out loud and write down their thoughts as they went through the prototype. The 3 tasks which they managed to do without being promted were:

• Finding the Quiz: 3 Seconds
• Complete the Quiz: 16 Seconds
• Changing Theme: 10 Seconds
• Looking at Settings: 158 Seconds

After looking at the feedback I received from my UX Evaluation, I was that there was many positive feedback regarding the design. A lot of the feedback I received was focused on adding more functionality to the prototype, for example, adding the option to add specific words to the quiz section ("Um, but like Marie said, I would like it if it was a little more customizing, customizable, especially like, or if there was like, like in history, how it shows what words I've learned"), or changing the size of our extention ("I think you could benefit from, like a minimize and a maximize button or maximum or maximize is like this regular size"). Overall, most of the let downs came from not having functionality in the prototype, and therefore I believe that for now my design is successful in terms of the design aspect.

With the feedback I received, I decided to add two things to my concept. The first thing I decided to add was a "add to quiz" button that would allow the user to ideally add a word to their quiz section. Next, I added a "report" button that would allow the user to report a word that they believe is not being translated correctly. These two features were additions suggested by the users I interviewed, and I believe that they would be a great addition to the project. Although my current additions are placeholders, I believe both of these features being fully intergrated would be a great addition to the project.

Test out the lastest version of the prototype!

View the prototype in Figma

Future Work

The next steps for WebLingo would be to add the actual functionality via html text scrapping of a webpage, and making it useable to further conduct more interviews. Although the current prototype is a great start, I believe that in order to obtain better results from interviews, the actual extention would need to work to some capacity. Most of the feedback recieved either involved new features, or wanting things to work such as the pronouciation button ("trying to click on the audio, because I want to hear. Does the audio not working? No, okay."). I believe that the next step would be to create a working prototype that would allow the user to see how the extention would work in real time. This would allow for more accurate feedback instead of asking for them to imagine some aspects to work, and therefore a better product overall. Including the various feedback we received from our interviews would allow us to create a better experience for the user, which is what we are trying to achieve with WebLingo. Helping people learn a new language through real life examples is the core of WebLingo, and making our product function is the next step in achieving that goal.