Design considerations
When you start mapping out the design flow in the Build phase of the Pega Express™ delivery approach, consider the personas that you have created based on your research. Select the personas that might have the most challenges with your application and create your initial experience based on those users' needs. In creating an experience for these users, you ultimately design an improved experience for all users.
Accessible-first design
Designing an accessible-first experience involves putting the need for accessibility at the forefront of your design. Consider how ramps were introduced into buildings for people who use wheelchairs. When laws were introduced that required buildings to have ramps, they were added to some part of the building to meet the accommodation. However, we now know that there are many others who benefit from the ramps, such as parents who use strollers and delivery personnel who cart heavy loads on dollies or carriers. Most new architecture design today provides accessible entryways that not only meet the need for an accessible experience but also introduce a more cohesive and holistic way for all people to enter a building and experience the same aesthetics.
When you design an accessible-first application, review the following considerations:
-
Consider colors and their use and implications.
You can use color to convey meaning but it cannot be the only method. By providing multiple signals for meaning, you reassure users and help them better comprehend the information in front of them. For example, you can use both color and text. -
Be careful when you add actions to buttons, links, or icons.
Most users expect to make an explicit action with a button or link, such as when they use the Enter key. Adding automatic actions, for example, if the user only uses the Tab key to highlight a button, might be unexpected and disorienting to some users, especially when a change happens on a different part of the page. Also, always ensure that if a user can use the mouse to click a button or icon, they can also use the Enter key. - Always give users a path forward.
On forms, validate input data and provide controls for users to return to a previous view and make changes. Alternatively, add a review view and a method for the user to update or correct their input. Assume that users make mistakes. Give people safety nets so that they can complete their tasks with confidence. -
Limit excessive content, tables, and interactive components in dialog boxes.
Dialog boxes move the focus into a separate UI element on top of the window or UI element that you are already working in, which might lead to potential issues for users of screen readers and magnifiers because they see only a small area. -
Use tables only for the display of data, not for layout or capturing data input:
-
Tables are useful for displaying a consistent set of data that you need to manipulate as a whole by sorting, filtering, and so on. Use optimized tables for the best keyboard navigation.
-
Avoid clickable rows, include a caption, and set columns as responsive with 100% width.
-
If you want to add multiple interactive elements such as buttons, links, drop-down lists, and so on, then tables might not be the best option.
-
Simplicity in design
Designing a workflow does not need to be complicated. You do not need flashy, complicated widgets to complete a task. If you want to meet the needs of a variety of users, try to make the steps straightforward, with little room for mistakes and frustration. Consider the following tips:
- Divide your processes into small steps so as not to overwhelm users with daunting forms.
- Split complicated data tables into several smaller data tables for ease of comprehension.
- Provide clear, meaningful labels and instructions and optimize tasks to avoid error message alerts.
- Do not clutter the page with information that is not needed to complete the task.
- Use descriptive, business-friendly terms on buttons, links, and icons. Avoid technical jargon.
Consistency rules
Having to look around for how to complete your next action item can be very frustrating. The following tips can be a real benefit to not only help meet the needs of users who rely on assistive technology but also improve efficiency in general:
- Consistent use of colors
For example, use the same design for each button in the app. - Consistent use of links, buttons, and icons
For example, the same icon always has the same action and meaning. - Consistent labeling
For example, do not use , , and in different places if they all have the same meaning within your application. Also, do not use ambiguous labels such as Click here. - Consistent placement of actions and data so that users can easily orient themselves on any page
- Consistent language and meaning throughout the application
Check your knowledge with the following interaction:
This Topic is available in the following Module:
Want to help us improve this content?