New Design System

Posted on

More than a site design or even a theme, our design team is developing an updated TCU design system for our web network. But what is a design system?

“A unified design system is essential to building better and faster; better because a cohesive experience is more easily understood by our users, and faster because it gives us a common language to work with.”

A design system is a collection of reusable elements, like colors, fonts and spacing, and rules that govern their implementation.

Lots of projects begin with mood boards and sketches to map out a feel for a design. From mood boards, a style guide will emerge. For a single site, a style guide is usually perfectly sufficient. When planning for a family of sites, though, the collection of elements expands and the need for guidelines and rules expands along with it. Visual continuity is critical to our brand; interface continuity is critical to the user journey. As a user bounces from one TCU site to another, you don’t want to force them to relearn our naming conventions and menu systems over and over again.

Wireframes & Prototyping

Collage of low-fidelity wireframes

We began our visual exploration with low-fidelity (lo-fi) wireframes. These visually-simplistic diagrams allow designers to quickly explore layout mechanics and content relationships without getting bogged down with colors, photography and fine visual details.

Several menu and page layout ideas were considered and refined. Content hierarchy was also adjusted to align with our content strategy.

Now that we have two solid sets of lo-fi wireframes in hand, our design team is moving on to high-fidelity (hi-fi) comps. This is when the two design options really start to take shape. We will work through several rounds of internal revisions before turning these comps into clickable prototypes. Once we have the prototypes ready, we will begin user testing and collecting feedback.

Recent Posts

  • Searching for Answers

    A key component to the overall TCU web experience is search. We are continuously tweaking and adjusting our search index to try to connect our visitors to the TCU content they are looking for as seamlessly as possible. Our Connected Campus microsite is a convenient place to go for the latest updates and information related…

  • Goodbye, Phase 1

    First of all, let me express my gratitude to all of the folks within the TCU community who contributed so much to the success of the new website! From the Web Redesign Committee to Chancellor’s Cabinet to the academic program page pilot and everything in between, your contributions made the new site possible. If you…

  • Soft Launch Meetings

    We are about to open up access for the campus community to preview the new www.tcu.edu website. This core site, the digital front door to TCU, is nearing completion. We are still putting the final touches on our pages and finalizing content with our content partners across campus. Please join us at one of our…