SLNG

About:

SLNG aims to bridge the gap between immigrant parents to America and their born-and-raised American children. This app was designed with ease of use in mind, allowing anyone of any age to use it without going through a lengthy learning process.

My Role: UI Design, User Research

Timeline: January 2024 - May 2024

Scope of Work: Web App

Out of 28 Projects, SLNG won "Best Use of Artificial Intelligence."

Our Design Goals

How can we create an application that is intuitive for our target audience (immigrant parents)?

How can we implement AI to streamline the process for users who aren't as advanced in tech?

Our Plan

Interview our original target audience with basic questions about their tech usage and understanding of American slang words.

Questions we had

How often do you not understand your kids when you speak to them?

Has there ever been a situation where you asked your child for an explanation?

How much slang do you hear outside of direct conversations with your kids (e.g. your kid’s conversation with their friends, a YouTube video, other people talking on the street)?

If there was an app that let you screenshot a text conversation and explain what is being said in context, would you use it?

Our Findings

Most immigrant parents have trouble understanding what their kids are saying

They utilize platforms like Google and ChatGPT and search up anything they don't understand or just ask their children directly

Target audience was split on the idea of using a separate application just to translate what their kids are saying.

Task Analysis:

I created low-fidelity prototypes on Figma and the team conducted task analysis interviews.

Submission through Typing

Submission through Voice Dictation

Submission through Screenshots

History Function

What we found:

Users found our prototype to flow smoothly and as expected. Notable issues being the lack of clarity for some buttons, i.e. the "camera" seems like it would open your camera but its to open a screenshot from the photo library. Our new iteration would shit from a mobile design to a web design due to the scope of this project.

Video Showcasing Final Project

Critical Incidents

Positives:

Found the descriptions to be helpful & “cool”
The user experience was very easily navigated and the users found the iMessage-like design to be familiar & easy to use.
The speech and image features worked fairly intuitively without issue

Negatives:

Text submission does not work with enter button
Could not clearly see the text on the screen, had to lean in & get reading glasses
Could not see the title text as well in dark mode
Response sometimes takes time to load and requires multiple submissions.

Revisions + Moving Forward

Moving forward, we would need to make changes to better gear towards our audience. First, we would implement the chat feature to accept the enter button (both mobile & desktop) as the text entry submission. This would allow users to utilize our chat function much easier and better streamline the user experience. Second, to better cater to the older generations (our intended audience), we would make a control for text size, as they may have different vision capabilities. Lastly, we would make a lot of adjustments and improvements in the interface by making it look more cohesive by adding more whitespace to help navigate users better and adding animations to make the UI more aesthetically pleasing.

The following is a list of potential additions for a smoother user experience:

Adding a one-time simple tutorial for the 4 buttons (image, speech recognition, send, dark/light toggle)
Making it so pressing the Enter key also send a message
Whitespace between buttons and the text entry field for easier interaction
Proper flexboxing for a portrait layout, particularly on the input bar
Options for increased font size
Smooth animations for sending and receiving messages
The use of more advanced AI models (particularly for speech recognition)
Consistent coloration for dark/light mode