A Mobile-Optimized Site for Performers of Every Age

Work

A Mobile-Optimized Site for Performers of Every Age

Colburn School

If you want to study music or dance in the United States, you likely have Colburn at the top of your list.

The Los Angeles school’s college-level conservatory competes with Juilliard, and its music and dance programs for younger students are nationally renowned as well. But the school was stuck with a seven-year-old legacy website that was intended only to be a temporary, stop-gap solution.

internal page mockups mockup on laptop program page mockup mobile mockups video mockup

Design & Content Management Issues

It had been so long since anybody tried to clean it up or build something substantive.” said Vice President of Communications Mark Berry when describing the legacy site. “We built [the former site] in a very haphazard way. And it wasn’t set up like an educational institution’s website.”

The legacy site featured concert events too prominently, giving some users the impression that Colburn was a concert hall offering classes. The site had an outdated design and a clunky content management system. Too many academic units had permission to create and publish their own content, without approval or oversight. Lastly, the site was not mobile-friendly — a big problem considering Colburn’s data showed most users were visiting the site via mobile devices.

Social Media Issues

On the plus side, Colburn has and continues to maintain a very strong presence on social media. The small but mighty communications team regularly posts an impressive amount of new content on Facebook and Instagram. Colburn also enjoys excellent word-of-mouth publicity via the school’s alumni, who actively share their own professional accomplishments and performances online.

However, all of this high-quality social media content linked back to the website, which provided a disappointing and confusing experience for visitors. The school worried it was losing prospective students as a result. The challenge was clear: Colburn needed a website that could perform as brilliantly as its students and alumni.

close up of student with colburn shirt
person dancing
woman with instrument on back

Solutions

Our first goal was to figure out what the school needed. I didn’t want to presuppose or come in and say, ‘This is the kind of website we need.’ That’s why those first months with mStoner were so valuable to us.” — Mark Berry, Vice President, Communications, Colburn School

A Research-Based Strategy

Berry was determined to properly prepare for Colburn’s major web redesign project and begin with a strong strategy. The school decided to enlist the services of mStoner, which included our in-depth discovery, strategy, and planning tools. Berry wanted the site to evolve from user data and audience research instead of hunches.

During the discovery phase:

  • mStoner spent time on campus meeting with Colburn’s stakeholders, conducting focus groups with current and prospective students, and interviewing faculty.
  • We also reviewed all of Colburn’s web properties and analyzed the web presences of the school’s competitors.
  • This research yielded insights as to why some right-fit prospective students weren’t considering Colburn.
  • mStoner also included best practices from other educational organizations’ websites, illuminating specific ways Colburn could increase applications.

These discoveries then shaped the parameters of the new site. Colburn web manager Tuesday Phillips said, “We went from no strategy to a very content-rich strategy. We focused on simple, authentic language that speaks to the Colburn community. That was one of the things that mStoner guided us on: microcontent and message clarity. You can see this too in our calls to action, which are much clearer and strategic.”

Satisfying Multiple Audiences

The school also needed to pay special attention to parents. “When you’re talking beginner or younger students, you’re often talking about the student-parent dyad,” Berry said. “In most cases, the kids don’t have as much agency as a college-aged kid.” In addition, Colburn students study either music or dance, without much crossover. Therefore, the new site had to get visitors to their discipline of interest quickly.

We focused our approach around what Colburn is best known for: preparing professional performers at every age.

mStoner’s site design and information architecture addressed these needs by:

  • Dividing the homepage into two “gateways” for music and dance. This also served to create some brand awareness for Colburn’s dance program; previously its audiences knew only of the school’s music programs.
  • Positioning “Music | Dance” first in the dropdown menu.
  • Designing each discipline’s landing page to look like its own homepage.
  • Broadening the audience navigation to include each main audience group, and then offering age-specific options on each group’s landing page. (e.g., Parents of Community School Students, Parents of Music Academy Students, Parents of Dance Academy Students, etc.)

Storytelling Through Visual Content

The discovery process also revealed that prospective students and their parents are looking closely at faculty. “They want to study under a well-known master,” said mStoner Creative Director Ben Bilow, “so we put a larger emphasis on faculty in the content strategy. This included offering a glimpse into the learning process at Colburn. Visually rich content such as large images and videos show how faculty and students work together in lessons.”

Colburn Creative Director Philip Pirolo already had a strong knack for producing high-quality photography and video. With a page design that provided the right amount of space and priority for this content, the communications team could finally showcase the visual beauty of Colburn’s gifted students and faculty in rehearsal and performance.

Both of the design directions that mStoner presented really catered to our needs. We couldn’t have gone wrong with either,” Phillips said. “mStoner was there with us every step of the way. I feel like we couldn’t have had better partners. They really listened to what we and students and parents and faculty and staff all had to say.”

Achieving Internal Buy-In with User Testing

We chose to do user testing before presenting to the board so that our decision-making was undergirded by data. This allowed us to speak more articulately about why we made certain calls.” — Mark Berry, Vice President, Communications, Colburn School

mStoner and Berry’s team ultimately created a site that was modern and bold. mStoner conducted user testing on the semi-final site before Berry and Phillips presented it to Colburn’s senior leadership and board. This strategy helped allay concerns in an objective manner.

User testing was a really important step,” Phillips said. “It was deeply informative to us in terms of what was and wasn’t working. It also brought our academic units into the process and included them in decision-making. mStoner conducted video meetings with different audiences to test both the mobile and desktop interfaces. They asked, ‘If you looked for this, where would you click?’ It was so interesting to see where people clicked first.”

mStoner also provided additional rationale to support the communications team’s presentation to the leadership. “Stakeholders are frequently concerned, for instance, that some elements are too far down the page,” said Bilow. “This is where we can be helpful as outside experts. We can say, ‘This is the way people browse now. Users are used to scrolling, and research shows this information hierarchy is what users expect.’”

It’s made our lives a lot easier to have a place to properly display our content. And we’ve made it clear now that we are a school for music and dance. With the previous website, we didn’t provide a full answer to parents asking where their child might fit in here.

Mark Berry, Vice President, Communications, Colburn School

Results

Since launch, I’ve consistently seen the new ‘Enroll or Apply’ page rank in the top three most visited pages. We didn’t have a page for that on the old site. These results speak to all of the work that mStoner did with user testing, redesign, and focus groups.” — Tuesday Phillips, Web Manager, Colburn School

Six months after launching, the new site is already influencing enrollment. Prospects are visiting the new “Enroll or Apply” page, clicking on key calls to action, and spending 45 percent more time on the website.

With a new mobile experience, prospects can also access enrollment tools. According to Phillips, the mobile design “is above and beyond what most people in higher ed and performing arts are doing. Facebook historically was in third place for us as a referring site — now it’s moved up to second place. Students were using their phones to look at classes, but not enroll; now they’re able to do that.”

The site has also improved Colburn’s ability to integrate its other digital marketing tools. The site’s responsive design collapses elegantly for any size device, allowing the communications team to link their frequent social media posts back to colburnschool.edu with pride, knowing every user will have the same visually rich, high-quality experience.

Awards

  • 2018 Communicator Awards Distinction

Services

Content and web strategy; discovery interviews and focus groups; responsive redesign; five page design templates; art direction assistance; competitor research; usability testing; information architecture; WordPress implementation; thematic CSS development; programming assistance; quality assurance testing; site governance and sustainability recommendations

 

Visit the Site