sharon dayoung lee
Macbook air mockup2@2x.png

University O-Week Experience

 

O-week Experience
Creating new opportunities to foster connections and participation

Spring 2019
UX/UI, visual design, wireframing

Individual project
2 weeks

google-mockup.jpg
 

Overview

Universities use orientation as a way to expose first-year students to the positive aspects of the campus life. However, the first week of fun and excitement of getting used to the new environment soon diminishes as the semester begins. Friends hang out less and less while the opportunity of making a new connection grows more scarce.

I created a mobile application that integrates student organization, orientation timeline, and orientation activities with a focus on giving freshman students more opportunities to make connections that will last.

 

(I am not sure why the weight of the typefaces are displayed this way — please open in Keynote for optimal experience)

 
 
 

Primary Research

As a freshman, I remember having difficulty finding resources online, which was especially difficult when I was looking at it prior to the orientation. I came into the orientation week without a clear expectation of what I will be doing and what is expected of me. Based on my orientation experience, I formulated a set of questions to ask to freshmen and sophomores.

Interviews
Then I reached out to former orientation counselors, staffs, and resident assistants to get a better understanding of the school’s mission, goals, and attitude. I figured out that schools put a lot of effort into provide students to make new connections, get to know new people through the orientation activities.

The main insights from the interview reflected the lack of consolidation of the overall experience from getting ready to participating in the orientation.

 
 

Painpoints

After the interviews, I looked into school’s first-year experience websites to get a better understanding of how the orientation program is structured. As stated in the interview, the content of the website was linked to a website of a different division of the school, which made it difficult to grasp all the information on a single site.

In addition, the current orientation website is very text-heavy, which can be overwhelming for first-year students navigating through the website.

Lastly, the first-year website lacked an unified visual system that did not make the site feel like a whole, complete system.

 
 
 
 

Goals

Based on the insights, I came up with set of goals I wanted to target through this project:

Deliver information in a concise and unified visual system.

Consolidate orientation information without being overwhelming. 

Provide students with a way to keep track of their favorite events and organizations and a way to manage and discover new connections.

I aimed to create a mobile application as I wanted to take advantage of personalization, notification, and off-line access. This characteristic of a mobile environment is more suitable for features such as scheduling and viewing favorited events and organization.

 
 

Competitive Analysis

Google calendar and iCal display information in blocks. Both feature a current time indicator to visually inform the duration of an event. Looking at these two calendar systems was a way for me to understand the UI conventions.

I also chose to look at Slack’s channel feature. Channels on Slack work as subcategories within the group that focuses on specific topics. I thought this would be a good place to start brainstorming about visualization of different activities.

 
 
 
 

Interface Design Process

As a higher educational institution, it is important to convey professionalism through its visual language. However, it is also important to appear approachable and passionate considering the context of orientation. I chose to work with san-serif as it is commonly considered modern and clean. Combing the san serif with red as a primary color and four other secondary colors as part of the visual system, the app is also able to convey a sense of excitement.

 
styleguide
 

Takeaways

Iteration is key

Although this project was completed within two weeks, going through A/B testing with users helped me to come up with an effective interface design. I learned that sometimes designers would have to go through multiple iterative process and put a lot of effort into each of them, although they need to be changed after receiving feedbacks.

Transferring existing experience to a mobile experience

Even though Carnegie Mellon had websites with first-year orientation information, they relied heavily on printed booklets and flyers to disseminate orientation information to students. Therefore, it was critical to think about how piece the web and the booklet experiences together into a mobile environment.