AggieLife Redesign – Helping Students Find Community

Project Overview

Background

Current Organization and Individual Club Pages

Problem Statement

Meet the Team

The AggieLife Redesign Team

Timeline

Timeline for AggieLife

User Research

Survey

Interviews

Persona

Ideation and Synthesis

AggieLife Team Affinity Mapping
  • How might we create a more direct and engaging homepage?
  • How might we make it easier for students to find organizations that meet their needs?

Design Process

Wireframe Sketches

Initial Wireframe Sketches

Mid Fidelity

Design System

Design System and Components

User Testing

Summary of User Testing Feedback
  1. Log in to AggieLife and complete the onboarding process
  2. Find the club ‘Include’ and save it to your favorites.
  • Tag system is easy to read and clear in relation to the club
  • Clean interface, liked the design of the cards
  • Too much whitespace causing confusion about ability to scroll for more information
  • Too much focus on the calendar visual compared to event information presented with it
  • Missed opportunities for personalization(favoriting a club?, RSVP to an event?)
  • Elements feel to big on screen which causes unnecessary scrolling
  • Missing links between pages and need for better micro-interactions

Hi Fi / Final prototype

Login and Onboarding

  1. The home page provides a look into what AggieLife has to offer as well a shortcut to view a few featured clubs and events. Click ‘Sign In’ to personalize the experience.
  2. After completing the UC Davis kerberos login, the onboarding process begins in which the user is prompted to add their interest in the forms of pre-made tags. These are used to better understand their interests and make suggestions accordingly.
  3. Next, the user can add a short bio about themselves in order to make their profile stand out when applying to clubs.
  4. Suggested clubs are introduced that the user can favorite in order to begin adding to their personalized profile page. This process repeats for events.
  5. Finally, the user has completed onboarding and it is taken to their personalized profile page. A calendar displaying the meetings for the clubs chosen in onboarding appears and its visibility can be adjusted. Below the calendar there are four sections: ‘My Clubs’, ‘My Events’, ‘Clubs for You’, and ‘Events for You’.

Filtering and Joining clubs

  1. Clicking the ‘Organizations’ tab navigates to a page to explore all the organizations on the website.
  2. There are four filters available for students to find what they are looking for. Within the ‘Majors’ filter, a drop down menu with all majors offered at UC Davis appears with the ability to select as many as wanted. Click ‘Apply’ view the results in a randomized order to be exposed to new clubs with every search.
  3. Click the card of a club to navigate to their internal page that gives a brief summary, an overview of the club, meeting times, and ways to contact them through social media. The ‘Upcoming Events’ section defaults to an interactive calendar format in which clicking on a date brings up a brief overview of the event the club has that day. This view can be changed to a list view for a more focused view. Both have the option to sync the events with an external calendar of the user’s choice.
  4. The photo gallery is from uploaded images as well as social media posts to show what the club looks like and their previous events.
  5. Click ‘Apply’ to apply to the club. A notice appears in which a club can provide any extra information regarding applications and the request will be sent.
  6. If approved, the club is added to the personalized home page in the calendar and the ‘My Clubs’ section for easy access.

RSVP to an Event

  1. Click on any event card and there will be a pop up with a brief description of the event.
  2. “View Details” leads to a page with a longer description of the event, other events hosted by the club, and recommended events.
  3. Click RSVP to confirm attendance and then it will be added to the student’s personalized profile page.

Reflections and Next Steps

Challenges

  • Identifying the most important features: AggieLife is an extremely complex website and was often described by students as overwhelming due to its many pages and features (clubs, events, news, forms, profile pages, etc.). Our main challenge was to identify what the most important features were to focus on in our redesign. From our user research, we found that most students use AggieLife for discovering clubs that suit their personal and professional needs. Therefore, we focused on features and user flows related to club discovery.
  • Displaying information clearly and concisely: Since each club had a large amount of logistical information (meeting time, description, logo, etc.), one of the challenges we had was organizing that information to be clear and concise. We created our card component system to solve this issue.

Lessons

  • Focus on the larger picture rather than the minute details: When constructing frameworks, it is really easy to get caught up with the really specific elements of the site. For example, there were moments where we might’ve spent more time than necessary on the color of some component, the size of a button, or the color of whatever interface for example. While the design of these elements are certainly something to consider, it is more important to ensure that the overall design is solving the main problem.

Next Steps

  • Our research found that students associated AggieLife with clubs the most so that is where we placed a majority of our attention due to the tie constraint. After having explored so much of this website and the club section within it, we would like to work on the events pages and even create a more personalized homepage in order to further work on making AggieLife a go-to option when it comes to clubs and events.
  • Through our design process we found how valuable personalization can be in making a website cater to one’s needs. It would be interesting to explore how AggieLife could be turned into a mobile app. This would allow for a personalized experience that could be just a touch away, which is especially valuable in the busy, on-the-go lifestyle of a college student.

--

--

We’re a student-run design consultancy @ UC Davis!

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