Close

Cornell classes and clubs pages redesign

Cornell’s Alumni Affairs and Development was getting ready to switch to a new platform for their alumni directory, event management, email marketing, and classes/club pages.

I was brought in as the UX and web lead to work on the new giving flow, to wireframe new email templates, and to redesign the Cornell classes and clubs pages.

Cornell University, photo by Gen Kanai (CC BY-SA 2.0)

Strong affinities, many generations

Cornell classes and clubs are rich networks with strong affinities. Alumni Affairs and Development offers some tools and resources to help these networks thrive.

The old classes and clubs sites were dated, non-responsive, and offered no easy way to showcase social activity or other kind of media.

The goal of this redesign was to create a platform that would appeal to different generations of Cornellians: younger classes are active on Facebook, while classes of the 1970s-80s prefer WordPress blogs, for example.

The timeline was aggressive: 6-8 weeks to complete a redesign and migrate tens of classes and clubs.

The redesign was also an opportunity to group classes in a way they had never been before—by decade.

Process and approach

Understanding the audience

I was fairly new in my position at Cornell when I was asked to work on this project as the web and UX lead. I had mostly worked on the Sesquicentennial campaign and I needed to learn more about the volunteer community.

Because the timeline was so aggressive, I couldn’t do any user research and resorted to talking to colleagues in program areas that worked directly with volunteers and volunteer leaders.


Knowing the limitations

The next step was to talk to the vendor to understand what their platform could and couldn’t do.

Time and budget were limited and I needed to understand the limitations that would be imposed on the design.

An early wireframe for the class page.
Ideation and wireframing

Armed with some knowledge of my audience, and what the platform could offer, I started sketching some tasks and built the supporting wireframes.

Iterating on the design

That’s probably one of my favorite aspects of a project like this: The creative push-and-pull with a vendor’s design team. Some things need to be tweaked, removed, added, etc.

We focused on navigation and calls to action, usability of the image slider, and a CSS blur transition in the header.