Discovering Events and Enhancing the Orientation Week Experience
User Experience Design, Visual Design
I was challenged to design an experience for students to discover orientation events and craft a visual system to accommodate different types of events: sports, music, visual arts, social groups, and volunteering events.
The experience is divided into two parts: pre-orientation experience and on-campus experience. The digital experience will change when it moves from pre-orientation week to optimize for the best on-campus (during o-week) experience.
SCENARIO 1 (PRE-ORIENTATION)
Smart onboarding and personalization process
After receiving an email from the Administration Office, students are instructed to download the O-week app and set up their accounts. The onboarding experience is easy with pre-set accounts. Students just need to type in their student and all the information is set up for them automatically. Then they can rank the event types based on their personal interest. This part will affect their discovery feed and suggestions.
SCENARIO 2 (PRE-ORIENTATION)
Discover events based on personalized information
The most helpful part is Discover before students arrive on campus. There are different ways to discover the events, with the suggestion algorithm and a detailed filter system. Students can also see what events are popular in their major. The search function not only support searching for the event names but also specific criteria on an event.
SCENARIO 3 (DURING ORIENTATION)
Live updates on events
The Discover tab changes during the Orientation week, now with the next upcoming events on the top to encourage students to attend more events if they happen to have free time. In each event page, student may also see the current status on attendance.
SCENARIO 4 (DURING ORIENTATION)
Linking the digital experience to the environment
Because the new students are walking around campus all the time during orientation week, they may discover new events on the posters hanging on the walls or on student tabling. With the Scan function on the app, it is easier to get detailed information on the events and add them to their own schedules.
For orientation events, I need to consider both what people usually look for in an event and the orientation week context. For the convenience of my situation, I chose to focus on Carnegie Mellon University’s orientation program. I thought about the stakeholders in the system and questions I need to ask for each stakeholder to help me understand the current state of orientation better. Then I did some comparative analysis on the event systems in the market. Then I identified possible environmental, analogue, and digital touch points in the current system.
The Current System
The current system is consist of an analog orientation schedule brochure and a website. However, the information on the website is not very specific and only gives a general idea of what the theme of each day is. Students have to carry the orientation booklet around all day in order to keep track of the schedule.
I quickly contacted people around campus and interviewed 3 new students, 2 orientation counselors (student leaders), and 2 people from the Office of Student Affairs. Listed on the right are the main challenges each stakeholder is facing from the interviews. Based on their different positions in the system, they provided very different opinions on the problems we have right now.
Ideation + Evaluation
Initial Brainstorming + Feedback
My first instinct was to use a web-page format because considering that since the orientation only takes a week, a lot of students may be reluctant to download an app for a short period of time. Therefore, I quickly sketched out some ideas of features based on the interview results I got, and took them back to the stakeholders to get some feedback. The features I have are:
Customize interest and profile to rearrange order
See live updates on current events during the week
Event cards that could be shared to group chats.
Why I switched from Web to App
After getting feedback for my storyboards, I realized that app is actually a much better choice from the backend standpoint. It is much easier to track user data and the student didn’t seem to be completely reluctant to download an app if it would save them more time while using it. What’s more, the Student Affairs told me that they are already trying to develop an app for next year’s orientation experience.
The information architecture was planned to have three main parts: Discover, Calendar (later worded as Schedule), and Profile. Because the prompt was to design to discover events, I mainly focused on the Discover section. The other two was designed to suffice user needs for the orientation week.
Then I took a closer look to each category of events and how the display information needs would be different, and identified common information points across event types.
Visual Style Development
Because orientation events are facing new coming students, I wanted to use some bright, vibrant color to convey a feeling of excitement into the new environment. I also chose Rubik as the font for this experience for its roundish qualities and legibility .
I have tested the color palette through a CV simulator, and made sure it is accessible to all users.
To distinguish different types of events, i chose to color code the event types. Each color is consistent through all medium, including event pages, reward stamps, and analog posters.
Click to view the interactive prototype。
Instead of the typical Sign Up / Login options, the first screen only provides one option to type in the school ID, which eliminates other users who are not relevant to the orientation week contents. Once the accout is linked to the users’ school IDs, the app is able to pull up their specific information and the user just need to confirm it. This screen reinsures the credibility of this app.
The customization screen is quite simple, just a simple ranking task that the users are able to drag and drop the orders, which is implied by the handles on the right. Then there is a loading screen showing the progress bar of personalization process to make users believe that the algorithm is actually doing the work.
For the information structure of the event pages, I looked through each categories and sorted out necessary information for each specific category. Although the structure of each category is the same, the wording is different to fit in the different scenarios.
For events that has special requirements or benefits (free food, RSVP, etc.), the button will indicate “RSVP“ instead of “Add to Schedule“, and with “RSVP“ the users will be acknowledged that their information will be recorded, so the event organizers can get a sense.
There are two different ways of representing events in the Discover tab: under “Coming Up Next“, the events are displayed in a horizontal format, highlighting the time over other information. This is because time is usually the most important piece of information if users want to squeeze the event in their schedule. The rest of sections contains horizontal scrolls.
The “Coming Up Next“ section is followed by “Discover by Type of Event“, which is a short section, with color-coded boxes. The order of appearance is based on the user preference. Once they click into the pages, the discover page of that specific category is displayed in a similar architecture: Coming Up Next section and event cards.
“Suggested For You“ section and “Popular in Your Major“ are both displayed by event cards. The cards put an emphasis on the imagery and title over time. In a regular browsing session, visuals and imageries are usually more effective to attract the user’s attention.
Filter and Search
There are 5 types of options offered in the filters page: Although event type is also displayed on the discover page, but the selector hear allows for multiple selections. The users could also specify the size of the event, which is an aspect that came up when interviewing students about the things they consider when exploring events. Then the date is also a multiple choice. The tick options on the bottom corresponds to the “info“ section on the event pages.
The search screen is quite straight forward. However, in addition to just searching the event name, there is also an option to search for specific criteria for the event type, such as “Events with Free Food“, etc.
I brought the prototype back to the students that I interviewed in the first round and did Think-Alouds with the users. Here are some feedbacks that I gained from the testing:
Discover page is ordered in the way that corresponds to their interests
Some explanations on the rewarding system during the onboarding process would be helpful
“Scanning” feature a little hard to find on the app
Takeaways and Next Steps
The biggest challenge I encountered during the process was a big decision change in the medium. Although it left me less time to develop on one set of ideas, it made me understand the importance of user feedback on the evaluative stage and that the UX design process is usually sinuous. Because the prompt asked for both an experience and a visual system, I had a little trouble distributing time for the two at first, but I managed to complete both in the end, which helped me improve my time management skills.
If I were given more time on this project, I would:
Conduct user testing during the actual orientation week and see if it works with high-fidelity live dataset
Explore more on the analog touch points (print assets)
Further develop Schedule and Profile section and the reward system.