
User experience design (UX) standards and guidelines
For the web, user experience encompasses design, accessibility, usability, navigation, information architecture, content and SEO and development — each of these individually and collectively can contribute to a positive or negative experience for visitors to asu.edu.
User experience design focuses on the design of the user interface (UI) of a website to improve the usability of a site by enabling the user to easily navigate a page or site and find the information they’re seeking.
Data shows that visitors see asu.edu as one website versus a collection of websites based on the structure of our enterprise. 95.23 percent of all users visit more than one ASU.edu subdomain. To create an optimal user experience, it’s critical that the experience is consistent as users traverse asu.edu. Unity, the design system for asu.edu, is optimized for a positive experience and focuses on the creative articulation of the ASU brand across asu.edu.
Learn more about building a website on asu.edu, whether using ASU’s Drupal CMS, Webspark or the platform-agnostic component library for non-Webspark sites.
The Unity Design System applies to all asu.edu pages and subdomains, regardless of the backend development system.
As of August 2020, the initial release of the new design system for asu.edu, a result of the community-driven Web Standards 2.0 project, has been shared with the community.
Getting started
Please note: You'll find designs and use notes for all new components in the asu.edu UI kit.
- Request access to the Unity Design System Adobe XD template (blank template that is preset with the UDS grid) with your ASUrite@asu.edu email account.
- Follow the asu.edu Adobe Creative Cloud XD component library using your ASU Company or School account (not your personal Adobe account)
- Learn how to add the library assets to your copy of the asu.edu Adobe XD template (skip to 2:00 in this video to see how to activate the UDS library in Adobe XD).
For reference, see a gallery of page mockups using various components.
Unity Design System will continue to evolve over time through community feedback and contributions.
Have ideas for additional components? Do you have a need that might benefit the larger community? Not seeing something you need? Join the Unity Design System Slack channel to help advance the system.
Standards included in the UI Kit
Be sure to read the standards specifications to the right of each artboard linked below.
Design
Components
Navigation
- Global header
- Primary navigation
- Global footer
- Sidebar menu
- Anchor menu
- Pagination
- Breadcrumbs
- Back to top
Content
- Accordions
- Alerts and banners
- Blockquotes
- Buttons and links
- Calendars
- Cards
- Carousels
- Charts and graphs
- Form fields
- Heroes
- Images and videos
- Lists
- Modals
- Quotes and testimonials
- Rules and dividers
- Tabbed panels
- Tables
- Tooltips
Content blocks
Page templates
Navigation structure
Animation and micro interactions
Quick links
You may also be interested in
Additional standards that apply to asu.edu