Connecting Chinese International Students to the Local Community

Team

Emily O’Neill: Co-Head Interviewer and Writer

Abdi Hassan: Co-Head Interviewer and Writer

Ivy Zhou: Head Note-taker, Designer and Writer

Mino Nakura: Co-founder and lead designer

Problem Overview

International students make up about 16.5% of the University of Washington student body. For many of these international students, the decision to leave their home country and study abroad is a huge leap of faith. While the education system in America may be very appealing, students that come here face a plethora of uncertainties and fears. Faced with an unfamiliar environment, students must learn to live independently from their families, study in a new language, and assimilate to a new culture. Having a strong sense of community is important for these students as they live abroad away from friends and family. Yet, many students struggle to make friends and connect with the community around them due to cultural differences.

Solution

A strong social circle can alleviate some of these worries and help propel international students to a more stable quality of life in the United States. To foster such an environment, we are proposing Potluck Finder, a mobile application to help international students connect with like-minded peers and join their scheduled events, while sharing their cultural dishes. A potluck is not only a venue to enjoy an assortment of delicious foods; it is also a social bonding tool to build a community and make friends. To use our Potluck Finder app, students need to first create an account. After creating an account, they would be able to create and find potluck events to attend based on themes, date, time, and city. Students would be able to view their events and the events that their friends are attending.

Paper Prototype, Testing Process, and Results:

Overview of Paper Prototype

Once we had completed our low-fidelity paper prototype, we conducted usability testing with two international college students, and a domestic college student. Our test protocol involved giving a brief introduction of our application and its purpose, then asking each participant to test out the main functionalities by completing the following two tasks:

1) Searching and registering for a potluck event.

2) Creating your own potluck event.

Conducting these tests allowed us to efficiently uncover issues and collect feedback on aspects of our design before implementing our digital mockup. Although many of our test participants found it straightforward to create their accounts and search for events, there was slight confusion along the way. We found that there were some inconsistencies in the placements of the profile and home buttons throughout each page of our app, and in the language we were using (e.g., interchangeably using the phrases ‘dietary restrictions’ and ‘allergen restrictions’ caused our participants to question whether they referred to the same thing). There were also some concerns regarding safety, and whether users should have to verify their identity when creating an account, and if sensitive user profile information should be displayed publicly.

We addressed these findings by first implementing consistent language and using standard conventions throughout our app, ensuring that profile and home buttons appeared in the same spot on each page. Next, to make our app more secure, we added a required field to the create profile page where users could input their school email in order to verify themselves as students. Furthermore, to give users the ability to hide certain private information from other users, we added checkboxes to the create profile page under the label ‘Public,’ as well as an additional box at the end which says ‘display user activity.’ These additions make it more clear to the user that they could select specific components of their profile to share with other users.

Digital Mockup https://www.figma.com/file/ZyywXy1fe5AaL3MWkrRC4U/HCI-2?node-id=0%3A1

After finalizing our paper prototype, we moved onto designing an interactive digital mockup. To begin, in Figma, we created simulated iPhone screens for each page of our paper prototype. We then experimented with different color schemes, eventually settling on a light pink for our main color, and pastel blue, gold and green as accents. For our font, we initially tried out a bold face font, but after realizing that it seemed a little bulky, we settled on a thinner font called “Outfit.”

Next, we fleshed out each screen so that it contained the necessary content. Since our digital mockup needed to feel as close as possible to a real app, we added in some functionalities that were not available in the paper prototype. Below, we will walk through our two primary tasks, and discuss the changes made from the preliminary to the final mockup.

(a) Upon opening the app, the user is shown the following landing page, which prompts them to either register or login. This screen is much more inviting and visually appealing than our original landing page design.

(b) Next, the user will either register or login, depending on the action chosen.

(c) If the user is registering for the first time, they will be prompted to create their profile. The only required fields are name and email. On the left of each input, a user can identify whether they would like the information to be publicly displayed on their profile. Based on feedback from our user testing, we added the option to specify pronouns.

(d) Once created, the profile appears as follows. In this version, we made minor alterations to the layout of the profile page so there was less excess whitespace next to the user’s profile picture. We moved some information, such as name, pronouns, and contact information next to the photo, and this makes better use of the page as it fits more information onto the screen at a time.

(e) Navigating to the home page, the user can now begin to accomplish the task at hand. The buttons on the homepage are large and clearly understandable.

(f) After clicking on “Find Events,” the user will be shown the following screen. On this page, we added a ‘Search Event theme’ bar at the top to let the user find the events they want to attend based on the themes. We changed the filter to be a pop up instead of a page. We added a functionality ‘Filter out full events’ where the user can filter out the full events. We removed the ‘Distance’ functionality to a city location since it makes it easy to list out the options. We added a drop down menu next to location so the user can view and select their options. Lastly, we added a ‘Reset’ and ‘Close’ buttons for ‘emergency exit’ reasons.

(g) The user can click on any events they find enticing. Each event has an information page that contains more details about the event.

(h) Upon clicking “Attend,” the user will be shown the following screen, where they can specify what food they will be bringing and whether or not they have any allergies. Initially, this page had an “Attend” button that allowed users to register. We got feedback asking whether anyone was allowed to attend any event, and realized that it would be more preferable if users requested the host to attend the event. This stops unwanted attendees from registering for events if they are unwelcome.

(i) If the user is approved to attend, they will be able to see the event on their “My Events” page. With this, the task is completed.

2. Creating your own potluck event.

(a) For this task walkthrough, we will assume the user is starting from the Home Page.

(b) After clicking “Create Event,” the user will be shown the following page. When you create an event, you have to specify things like location, time, theme, and what dishes to bring, as well as any co-hosts you want. In this version of the mockup, instead of cramming all of the content on the “Create Event” page into one frame like before, we separated the content into two frames, connected by a scroll bar.

(c) Upon filling in the necessary information, the event will be created, completing the task.

Summary

Through our user research, we discovered that many international students struggle to find a sense of connection to the local community. To help these students assimilate and make lasting bonds, we built an app that enables users to find and attend nearby potluck events and socialize with other users. Potluck events serve as an easy starting point to make new friends as it enables attendees to share their favorite dishes and cultural backgrounds. We envision our application to be a staple social platform for international students coming to the United States. We hope students gain the confidence, comfort and support needed to become successful in their endeavors in the United States.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
CSE 440 Staff

University of Washington Computer Science, Intro to Human Computer Interaction