Rutgers Douglass Website

role

Web Designer
UX Researcher

team

Lauren Muccilli (supervisor)
Tara Kim
Myself

timeline

June 2020 — January 2023

tools

Figma
Drupal
Notion

overview

I got hired to be a part of the Douglass Website Team in order to redesign and redevelop the website for Rutgers University's Douglass Women's Residential College.

my role

I collaborated with my supervisor, Lauren Muccilli, to remodel and overhaul the website so that students had a better experience.

what is rutgers douglass?

Rutgers Douglass is the Residential Women's College at Rutgers University. Douglass College provides housing, opportunities, resources, and more for 2500+ women and non-binary students at Rutgers:

the design process

The plan began with looking through the website and interviewing students in order to determine what problems the website had.

why are we redesigning?

Rutgers administration felt it was time to redesign the Douglass website to both meet the new design standards of modern websites, and improve the user flow of the site for students. I spoke with a few students and had them go through the website to identify pain points of areas of frustration:

"I can't tell where to start. If I was enrolling or registering to Douglass, it's very unclear where to go or start from."

~ Rithika

"The website looks really old. There are parts of it that look strange, and the colors and design just look dated."

~ Sara

"Navigating the site is a bit challenging. If I want to find out more about a topic, for example the BOLD program, it takes a lot of clicks to get to it."

~ Vanessa

insights from interviews

Rutgers administration felt it was time to redesign the Douglass website to both meet the new design standards of modern websites, and improve the user flow of the site for students. After speaking with a few students and searching the website for pain points, I found three major issues with the website:

1. Repeating Information
Pages contained redundant information, making it difficult for students to navigate the site and determine where to go when looking for something.

2. Too Many Pages
The layout of the website was very complicated and cluttered causing students to become overwhelmed by the overflow of information.

3. Outdated Design
The website design was bulky and dated, and did not follow typical accessibility guidelines. The formatting and colors were also inconsistent.

the information architecture

There were many pages that had repeating information, making it hard for students to navigate the site and find where to go when looking for something.

We first went through all of the pages of the original website and decided what to keep, what to change and what to omit entirely.

new sitemap

After deciding which pages to keep, delete, and edit, I drew up a site map in order to easily see where each page on the site led to. Blue pages would be featured at the top of the Homepage, and the Red pages would be sub-pages within the main navigation menu.

developing the site

With the sitemap planned out, we started developing the website pages using Drupal. Rutgers University has a set of custom elements and features that they use for their websites.

constraints

While I made sure the site would run smoothly for 2500+ students, there were certain constraints and obstacles that I had not thought of:

1. Following Rutgers administration's guidelines
Because I was working on a Rutgers University website, I did not have a lot of creative freedom. I had to make sure I was designing pages with Rutgers' guidelines and rules in mind.

2. Time Management
I had to make sure the progress of the website was up to schedule for the school. I had to account for decisions that would need to be made through administration.

key takeaways

Throughout this journey and huge responsibility, I was able to grow and take initiative in a real-life product environment. I learned about:

1. Balancing user needs and business needs when designing and researching

2. Making sure the decisions I made were justified by proper research and reasoning

that's all folks!

check out some of my other work

UX DESIGN • CASE STUDY • MOBILE

apple music case study.

Making Apple Music a more ideal app for sharing songs and discovering new music.

ILLUSTRATION DESIGN • FUN

my artwork.

Some digital art I made using Adobe Illustrator and Procreate.

Re-designing the Douglass Women's College Website.