Designer Guidance
Starter files, patterns, interactions, and workflows on how to succeed using the design resources from HPE Design System and the HPE Brand.
Getting started
We're excited you're using the HPE Design System! Below are a set of resources that will help you get started using the HPE Design System components in your designs. If you don't find what you're looking for, please reach out in the #hpe-design-system channel on Slack.
Setting up your Figma account
If you are new to Figma, the Figma Getting Started page is a good place to start.
Create a Figma account with your HPE email address. Using your HPE email provides immediate access to all HPE Design System files.
If you would prefer to access the HPE Design System library in a desktop app, you can download the Figma Desktop App for MacOS or Windows.
Joining the HPE Design System Figma team
Once you have made a Figma account with your HPE email, you can request to join the HPE Design System team. You can do so by following these steps:
- Log into Figma and look for an HPE icon in your left control bar.
- Click on HPE. Here, you will see all HPE Figma teams.
- Look for "HPE Design System" and click "Request to join".
Once you have been added to this team, you will have access to all of the HPE Design System files.
Before your start designing
Familiarize yourself with the concepts and components the HPE Design System offers.
Understanding use cases and guidelines for individual components will ensure your designs align with the HPE Design System.
Need somewhere to start? Check out the guidelines for Color, Typography, Components, or Templates.
HPE Design System Figma Library
The HPE Design System Figma Library is a library of assets for designing HPE applications.
To access individual files for each component, navigate to the HPE Design System Figma team. If you are having trouble accessing the files, you may need to join the HPE Design System Figma team first.
Each component has its own library file that demonstrates the various states of the component such as enabled, disabled, hover, active, and focus. The examples within these files can be leveraged within your design files and are built to be interactive and responsive.
Still have questions?
Something missing or looking for more information? Get in touch to help make the HPE Design System better.