After selecting a new CMS, I lead the effort to create a Baseline Design System for the pilot site release.
This effort included synthesizing the 2 existing Design Systems, update modules to be more contemporary to strengthen the brand and prepare for an upcoming refinement and unification of brand, and clarify standards. I lead this effort with contributions from 4 team members and 3 contractors (IA and Visual Design).
ROLE
Director of Information Architecture – Proposed, led, and completed activities described. Directed contractors (IAs and VisDs) and mentored/directed Editorial staff in supporting the design work (that also completed).
THE CHALLENGE
Establish the Design System – Concepts, standards and frameworks to empower the technical team to establish a CMS that will fully support the Design System and empower users to work successfully as they manage content; and ensure the usability and brand compliance of GW’s Digital Properties.
THE APPROACH
Establish a design system and foster ownership and buy-in to its existence by working collaboratively with stakeholders through sharing throughout the process and acknowledging historical feedback, identifying and sharing contemporary heuristics and design patterns, and presenting it all in the context of the stakeholders’ world.
Analyzed existing design systems to identify existing functionality.
Performed gap analysis of existing features, functionality, contemporary features and functionality as well as business and user needs pulling from CMS User and Business Research.
Worked with internal Visual Design team and Brand Managers to understand the brand and inform the final visual design, logo, imagery, and voice standards and assets.
Established the needed Design Patterns – Visual Design, Interaction Design, and Navigation; and defined Site Types, Page Types, Page Layouts, and Page Regions and their relationships to Display Options and permissions. Guidelines for CMS Modules/Display Options implementation, Visual Design Direction and standards consistent with the established GW Brand and their logic were established to create logic for the CMS to support.
Validated Page Types, Layouts and Display Options with paper prototype design activities conducted with stakeholders.
Conducted biweekly reviews with stakeholders to report progress and gain feedback.
Directed part-time team on both collaborating to define and create components and oversaw production including IAs, Visual Designers, and Editors in creating the Design System.
Gap Analysis of the two design system modules and functionality
Conducted “paper prototyping” with representatives for different organizations throughout the organization to test the new modules. Reps recreated an existing page using either prefab design patterns InDesign Library or print-outs of modules. It was a success! It fostered buy-in while testing the usefulness and usability of the design patterns.
THE RESULTS
A baseline Design System was established to support the existing content and interactions and latent organizational needs were addressed with new, contemporary interactions. Contemporary design patterns were introduced to improve the User Experience across the organization.
Guidelines and Standards established to ensure supporting CMS Foundation and empower stakeholders to work with the new design to meet their leadership’s goals and expectation while remaining consistent with the University standards and supporting an overall usable experience of the GW properties.
A single Visual Design direction was established based on a full-grid to establish a more contemporary Visual Design with the flexibility to allow the Display Options to work cohesively together regardless of their combinations.
Design System elements generated requirements for CMS.
Digital Properties, Site Types, Page Types, Page Layouts, Display Options and traditional Style Guide Elements and specifications were defined and designed in a single document to be a Wiki in the future.
Selecting the newer, more positive looking Visual Design patterns, I moved them to a full grid design to make the the modules "plug and play" and tighten up the design, while empowering non-designers to update their sites with professionally presented content.
DELIVERABLES
GW Design System BASELINE 2.0