top of page

Industry Design Project - Nomie

Loneliness is a common experience among many students. Nomie is a website designed to help students connect with each other.

Process

This is a 5-week internship program, we are using Figma as the tool for all the redesign.

1. Introduction

1.1 The problem

Since the website was recently launched, they (referring to the developers) have received feedback from many students and teachers who are users of the website, expressing that some aspects of the website's onboarding design and layout are a bit confusing, and so on.

1.2 The solution 

So, the founding team of Nomie contacted my school, and as a result, two other UX designers(KL and KM )and I were tasked with redesigning the onboarding process, Profile and classrooms page for the Nomie website. This involved various steps, including research, usability testing, and a complete overhaul of the entire onboarding process.

1.3 My role 

I, along with two other UX designers, divided the work among ourselves. Some tasks were completed individually, while others were collaborative efforts. This included tasks such as research, ideation, user testing, prototype development, and more.

The orange-highlighted sections marked in the following image are the areas I am responsible for or have been involved in.

2. Research

2.1 Competitive Analysis

I have chosen to conduct a Competitive Analysis using the following three websites that are commonly used for interaction among teachers, students, and parents, both inside and outside the classroom in the United States.

Screen Shot 2023-11-12 at 4.31.01 PM.png

I conducted tests on the three websites separately for the following three sections. here is the summary of the evaluations for each of them:

01

Match between the system and the real world

Some websites present information in a clear and straightforward manner, using simple language and easily understandable formatting, eliminating the need to look up technical terms. In contrast, on certain other websites, I found the explanations for specific sections to be confusing. Even after reading them, it remained unclear what they meant.

02

User control and freedom

Usually, I can easily go back to the previous step or the homepage by clicking the 'home page options' or using the back button. However, on certain pages, despite trying various methods, I couldn't find a way back; the only option was to close the webpage and reopen it from the very beginning.

03

Help and documentation

Two websites have well-organized help resources, offering easy access to contact details, Q&A, and neatly categorized content. However, on one site, It only has two contact options—submitting a form or chatting with a chatbot. With no phone number, Q&A section, or guide videos, I have very few ways to quickly get answers.

2.2 Heuristic Evaluation 

Some background information

Initially, we planned to involve website users for testing, but code issues on the Nomie site delayed us for almost a week. Due to time constraints and a unanimous decision by the other two UX designers and their mentor, we decided to have only the three of us UX designers evaluate the current Nomie website. Despite not being the ideal solution, I had to compromise and proceed with this approach.

Problem Statement

How might we optimize the user portal to be user-friendly for teachers and have engaging, smooth onboarding for students?

Summary

Summary of heuristic issues found by the team following world leaders in research-based user experience, Nielsen Norman Group: We found a few categories of issues consistently appearing, including unclear language, unclear status, and heavy cognitive load. Subsequently, we categorized all the data into their corresponding 10 different categories.

3.Solution

3.1 Crazy 8 and Sketches

We three individually created Crazy 8 sketches for the onboarding setup screens and profile screens. Additionally, we simultaneously sketched the entire onboarding process based on the current Nomie website and all the research we conducted earlier.

Below is one of the sketches I did from the Crazy 8 and Sketches.

After a collaborative Zoom meeting, the three of us shared and discussed our design sketches. Following the meeting, KM and I documented the strengths and areas for improvement in each other's designs. This process aimed to assist KL in consolidating our ideas and making informed decisions for designing the low-fi screens.

3.2 Wireframe Onboarding Flow

Some background information

KL developed the initial LoFi Onboarding Flow 1.0, following her own approach. Despite repeated emphasis from me and the other two UX designers on Nomie's founder's preference for one question per page, the other UX designers insisted on consolidating questions. In later client meetings, the clients advocated for individual pages based on positive user feedback. However, the two designers persisted in supporting the consolidation of questions, even interrupting Nomie's founder multiple times during discussions.

Below is one of the interfaces from the Onboarding Flow 1.0 version.

Screen Shot 2023-11-12 at 9.47.27 PM.png
Screen Shot 2023-11-12 at 9.47.27 PM.png

During that time, the other two UX designers mentioned they lacked time to modify the 1.0 version due to the timeline. They concluded that, at the end of the day, the client could either take it or leave it. They planned to address any necessary changes during the high-fi phase after starting usability testing the next day. Despite this, both the client and I believed conducting a usability test with this version would be meaningless.

 

Following our Zoom meeting, I contacted the client for a one-on-one discussion to address her concerns. Afterward, we found a solution through further discussions, considering essential requirements, resulting in a 2.0 version that satisfies both the client and the other two designers.

 

Below is one of the interfaces from the Onboarding Flow 2.0 version.

Screen Shot 2023-11-12 at 9.47.27 PM.png
Screen Shot 2023-11-12 at 9.53.07 PM.png
3.3 Testing of the wireframe

As three designers, we individually reached out to two participants within the 18-22 age range, the target users of the Nomie website. I created a Research Plan and Test Script, and after collaborative discussion, we made adjustments. Prior to the formal testing, we conducted a pilot test to uncover any additional considerations for the upcoming comprehensive version.

After completing the user testing, we gathered all the ideas and suggestions from the users, compiled them into the Notes List, and then organized the content while prioritizing them.

Below is one of the pages from the final list after it has been organized. 

Screen Shot 2023-11-12 at 10.06.27 PM.png
3.4 Moodboard and style guide

Initially, the two other UX designers didn't see the need for a Moodboard and style guide. However, I thought it was essential to align our work, given the collaborative nature of our design team. After gathering input from all team members,I created the Moodboard and style guide based on feedback from clients and users.

 

Below is the Mood Board and style guide.

3.5 High-fidelity Screens

After multiple meetings and considering user and client feedback, along with our knowledge in UX design, we have finalized the redesigned version.

 

Here are several pages from the High-fi screen

Afterthoughts

I'm grateful for the teamwork experience and the opportunity to contribute to Nomie's growth with its kind-hearted founders.We successfully created a design that the client favored over other UX teams, and the client expressed a genuine intention to use our design for the website redesign. This achievement makes me feel incredibly proud.

 

Due to time constraints, I couldn't conduct high-fidelity usability testing. The design process could have been more collaborative, but I had to balance the needs of the other two designers and the client, rather than fully leveraging my knowledge to meet both the client's and users' needs. This experience underscored the importance of being part of an experienced designer team.

 

In summary, this has been an incredible learning journey that has highlighted my strengths and areas for improvement. I view it as just the beginning and eagerly anticipate my exciting UX design journey ahead.

bottom of page