UX Project | Columbia Business School
Information Architecture & Content Strategy: Columbia Business School
This week at GA, we were tasked with redesigning a college website. More specifically, a part of the website relevant to certain users. The following is what I proposed to my client, Columbia Business School. The goal was to prioritize content so that a prospective student, named John, can easily navigate and absorb the information he needs about their EMBA program.
Proposal
Home Page
Welcome to Columbia Business School. Underneath a featured photo, we have primary navigation to let users explore the school — things like Faculty, Research, News, and Ideas.
Below that and most prominently is ‘Programs’. Users can browse through, then select a page within that program (e.g. Benefits & Features, Admissions, Academics).
Information Overview Pages
These pages highlight important details at a glance. Highest-level program details are presented up front and/or grouped together. Instead of many clicks and pages, users can consume info, have key actions available at all times (e.g. ‘Attend Info Session’ button), and browse more dynamic content. See examples below, along with structural features developed based on user testing.
Browsability
The ability to browse content keeps a user’s attention and saves him time. Features like the one below from the ‘Academics’ page help minimize the amount of pages (and endless scrolls through text) in our user’s flow. He can click through the Core Curriculum and each course description appears in the dark rectangle.
Over all, users can easily and quickly navigate key sections about CBS programs. They can browse courses, program options and locations, and get at-a-glance overviews of important info. This helps our busy prospectives make an informed decision about continued education without info inundation. The user will know enough info to attend an in-person session or 1:1 with recruiting.
How did we get here?
Rewinding to the beginning of the design process — this project was all about assessing the current information architecture and content strategy at gsb.columbia.edu in order to restructure it in a way that’s usable for a specific persona.
Our persona’s name is John, and he represents a group of site visitors who are thinking about going back to school. He’s a prospective executive MBA student, 38 years old, and he’s very concerned with class schedules and browsing through course descriptions to see if the offering will make him a better professional.
State of the Site
Pre-View: Sitemap ‘Before’ Photo
John’s destinations on the site are scattered and often many clicks away. John will take lots of time exploring each section, finding redundant information, heavy-to-digest information, unneeded information, and otherwise fluff. Digging deeper into John’s specific user flow (he’s exploring: Homepage, EMBA options, course descriptions, tuition info), we see a long path — 14 pages and 14 clicks.
I found that while the school’s site was exhaustive and valuable to many different users, the content was not structured in a way to serve John and to attract the World’s best business leadership (per Columbia Business School’s assumed brand goals). The school is only as strong as the minds it attracts, so we began working to feature its prospective student sections by:
Providing high-level information at a glance (business leaders are attentive to details, but time-constrained and seek broader information first)
Restraining program details to encourage in-person engagement (business leaders network, interact, and transact in person if possible — the best candidates will attend an information session or 1:1 meeting)
5 < 14
Through key info consolidation and more dynamic browsing features, all relevant content is at John’s hands, and he’s free to click through as much as he pleases instead of being forced to (in order to find each piece of info).
John now visits 5 pages instead of 14. The green stacks represent browsable groups of content, enabling him to explore more within each page.
Usability
This redesign was not simply a rearranging of content blocks — each design decision was informed by user insight. For example, card sorting helped us prioritize site sections. Prototyping and testing uncovered navigation issues that were not yet apparent to me.
- An initial content structure
- Early-stage wireframe — started playing with the idea of browsability; users found that filtering to certain program sections is too cumbersome while exploring
- Second-stage wireframe — main navigation from homepage migrates to the left nav, also with a format change — users found this to be confusing from page to page (see medium-fidelity wireframe of this navigation deficiency below)
Subsequent wireframes introduced a more consistent and user-friendly browsing function (see EMBA NY block; user chooses between ‘Friday/Saturday’ and ‘Saturday’):
Prototype
Test-drive the clickable prototype here. As a reminder, you are John exploring Columbia Business School — finding info about EMBA Saturday option, various course descriptions, tuition and sponsorship, and finally decide to attend an information session.
Next Steps
- More usability testing and iteration
- More site sections with same content structure
- Content strategy translation to mobile site
- What portion of site users relate to John?
- How little info is too little on a college site?
Three Weeks in
Contexts, Behaviors, Pains, and Pleasures
The college site redesign was a great experience — we got a real-feel chance to analyze a large site with varying users and goals, then distill it into useful content.
My biggest lesson learned is to focus on cataloging all my information, observations, iterations, and conclusions — many times throughout this project, I acted on user feedback and implemented some structural designs that were not clearly captured in my proposal or this retrospective. Maybe it’s as simple as MORE screen shots (or file saves). Maybe better notes. Maybe more structured feedback/testing channels. But probably ALL of the above.
