Redesigning the campus website and the custom content management system behind the homepage/2015
- Client University of Illinois
- Role Lead designer & front-end developer
- Research User interviews, competitor analysis, usability testing
- UX Content strategy, information architecture, wireframes, prototypes (paper, html)
- UI Art direction, modular design system, responsive design
- Front-end HTML/SCSS/jQuery
Case study—Reflecting the campus experience on the website
The University of Illinois launched its campus website redesign in the spring of 2015. The process began in 2013, five years after the most recent redesign. Like previous versions, this was completed in-house. I was both the lead designer and the front-end developer.
Creating an experience
Surveys and interviews with users and stakeholders revealed that the website should focus on being an experience in addition to serving as an information gateway—something it had never prioritized. The design should support users who know what they’re looking for and allow them to accomplish tasks within an Illinois-branded environment. It should also introduce the chance of discovering something that users didn’t know would interest them.
Throughout the process, proposed website features like a new navigation system and more prominent search bar went through many rounds of usability testing at all levels of fidelity—paper prototypes, wireframes, and a live website.
- Use storytelling to demonstrate impact: showing examples of impact is more effective than listing strategic goals
- Start conversations: interact with the campus’s strong social media presence
- Be device agnostic: no more need for a separate mobile-only version
- Set the standard for design on campus: it’s important to lead by example on a decentralized campus
- Be dynamic: give people more reasons to come back
Designing an information pipeline
One way the new homepage demonstrates the many opportunities for research, culture, and engagement on campus is by featuring a lot of campus news. Because the new design greatly increased the capacity for displaying articles, the design process involved planning ways to collect enough stories to keep content fresh.
Establishing a new mechanism to gather stories required making big changes to the university’s custom content platform, a suite of digital communications tools. This effort was a close collaboration with campus news writers and communicators, homepage content administrators, software programmers and designers, and the homepage designer/front-end developer (me). The new system, which was built with the university’s custom blogging platform, also supported an internal initiative to build a repository of campus stories for marketing communications.
Story gathering benefits
- Creates a pool of content ready to distribute to various communication efforts (speeches, social media, campaigns)
- Lowers the barrier for contributing to the content pool (empowering campus communicators)
- Streamlining the process for collecting content (efficient for content curators)
A future-friendly design system
Creating a modular design system not only improves the presentation of content, but it also allows the university to iterate on this design more easily when requirements change rather than having to begin another traditional, lengthy redesign process.