Re:Design Blog

The Lenoir-Rhyne University Web Redesign Project

Website Style Guide

Two LR students talking at table in Shaw Plaza

We are excited to launch our new Lenoir-Rhyne University website style guide.

An essential part of any successful project is documentation. In building out a modular, component-driven website, documenting all the various design elements, components and page templates is important to making sure we are all working from the same playbook.

Working with our partner, BarkleyREI, a style guide has been created to provide guidelines for usage, documentation and raw code for all of LR website’s patterns, components and templates. All of this is provided to assist us and our campus partners in creating, designing and developing robust and accessible digital experiences across all Lenoir-Rhyne web properties.

In the style guide, we are provided with flexible resources and tools that any person or team can learn and use as they contribute to Lenoir-Rhyne’s diverse and substantial digital infrastructure.

Style Guide Library

The style guide’s menu helps guide users to find the resources needed to continue building and maintaining our new website. Throughout this library a few terms will be referenced that you should be familiar with:

  • Elements: Elements are the foundational building blocks of a system. They are things like brand colors, iconography, typography, and more. They are necessary to ensure whatever you create looks cohesive and is on brand.
  • Patterns: Patterns are repeatable configurations of the aforementioned elements that perform specific functions through user interactions. They are things like buttons, inputs, drop-downs, and more. They are integral to ensuring your users are able to accomplish their goals.
  • Components: Components convey meaning by combining patterns to support specific content types. They are things like page headings, carousels, menus, cards, accordions, and more. They combine patterns to make them user-friendly and to clearly convey purpose.
  • Templates: Templates create context by strategically combining and arranging components to support the overall page purpose. They are things like Program Details, Faculty Profiles, News Articles, and more.

As changes are made to our website, they will be immediately reflected in the new style guide. This will ensure that we are always working from site documentation that is current and accurate.

You might be interested in …

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.