UX@MSM

As a designer and the UX lead at the Manhattan School of Music (MSM), I've had the opportunity to work on the complete overhaul of the School's website, including a reorganization of content pertaining to all aspects of the school from prospective students through donors. This project has touched every department and administrative office in the school, and I've been able to work with many different stakeholders with many different desires to help create an incredible new website.

Working inside of the communications and design department, under the supervision of the Director of Digital Strategy, I managed three graduate students to restructure and build over 900 website pages over the course of 5 months. 

 

My contributions:

  • Conduct usability testing for the new site on desktop and mobile
  • Present findings to stakeholders
  • Restructure Information Architecture
  • Manage a team of 3 graduate students on the build out of over 900 pages
Screen Shot 2017-08-15 at 4.09.20 PM.png

Goals

  1. Increase quantity of applications to the School (without diminishing quality of those applications)
  2. Raise the profile and improve the image of the School
  3. Improve usability for students and donors
Screen Shot 2017-10-03 at 5.53.11 PM.png

Journey Map

From shopping for schools all the way through donating as an alumni, the School's website is an important part of every step of the student's (and their family's) journey.

 

Usability Testing

An ongoing part of our process was usability testing, which served as an opportunity to quickly gauge whether our information architecture was truly intuitive for students. Working on campus served us well, as students were easy to access and eager to help. 

Usability testing allowed us to:

  • Quickly identify structural issues
  • Finesse navigation to suit students' needs
  • Maximize relevance of the site for students based on their feedback
“It could be helpful to see a list of competitions that will give you reward money that you can use to pay your tuition.”
— Voice Major
“One thing I had a problem with when I was applying was that I couldn’t find the Orchestral Performance trumpet repertoire, I kept getting sent to the Classical trumpet repertoire. So I showed up to the audition with the wrong repertoire. I guess it all worked out because I’m a student now, but this [new site] is great because now it’s super easy and clear. I found it right away.”
— Orchestral Performance Trupet Master's Candidate
 

Information Architecture for Financial Affairs

On the old version of the website, financial information for students was housed in three different areas: Student Accounts, which housed information about how to pay student bills; Scholarships & Financial Aid, which housed information about types of aid and tuition, as well as instructions for how to apply for aid; and Housing and Residential Life, which contained the cost of housing a meal plans (which apply to all student whether or not they live on campus). This scattering of information created a tricky situation for students, especially international and non-native english speakers who often have complicated financial and visa situations when entering the school. 

My goal was to make financing an education at the Manhattan School of Music as straightforward and clear as possible. 

 

Step 1: House all financial information under one roof

IMG_8963.JPG

Choosing to put all financial information together under the umbrella of "Financial Affairs" required buy-in from the Financial Aid Office, Admissions Office, and Business Office.

 

Step 2: Redesign of "Types of Aid" page

Screen Shot 2017-10-05 at 2.38.23 PM.png
Screen Shot 2017-10-05 at 3.18.57 PM.png

(Page before redesign on left, after redesign on right)

Exploring types of available aid is the first step in applying for aid for all students. A key complicator in this step is what types of aid each student is qualified for. 

My goals during this step were to:

  • Clearly indicate who is eligible as quickly as possible
  • Clean up the design to decrease visual stress
  • Make sure international student info is visible at a high level (53% of student body is international students)

 

Step 3: Conduct Usability Testing & Respond to Findings

Incorporating usability testing throughout the redesign process has uncovered useful, actionable insights for this section such as:

  • Change "Institutional Aid" to "MSM Scholarships," most of the users didn’t understand "Institutional Aid" in testing
  • Add instrument names to all applicable program pages
  • Possibly add a list of competitions whose reward money could be used toward tuition
  • Add a "Housing" link on Accepted Students page

These findings were first presented to stakeholders and once approved, they were implemented in the design.

 

 

NetCommunity Redesign

MSM uses a dedicated platform to manage donations, donor information, and outreach. This platform needed to be redesigned and updated so that it could reflect the new site design.

As the lead on this project, I was responsible for:

  • Auditing the old site with the Alumni Department
  • Creating a new information architecture for the donor facing pages
  • Managing the development of a new skin to match the new site design

Above is the new skin developed by the NetCommunity team to match our new website design. I managed this aspect of the project.