formless to form
Most things live within a system. Systems provide redundancy and afford efficiency. Systems offer guidelines for use (best practices). Our contemporary lives are the result of stacks of systems. Systems themselves are not good or bad, but they can become cumbersome if not intentionally designed. How might a system be robust when providing guidance, yet flexible to adapt to changing times? I can help with that!
projectSAP Concur Design Systems
what was itResolve accessibility escalations by auditing all existing grid-like components in application and designing new components. The proposed solution accepted by all stakeholders were three components that excelled in respective use cases.
design challengesalignment considerations
SAP Fiori, SAP Concur, accessibility (WCAG), legacy behaviour
accessibility
The grid component in use was overloaded with functions, rendering it inaccessible to keyboard navigation and screen readers
cross device compatibility
Displaying data with grids and tables is inherently challenging on smaller screen sizes
use cases
Design specifications must meet needs of present and upcoming features
processconstraints as scaffolding
The project began in an ambiguous problem space. by using the alignment constraints as scaffolding, I was able to chart a path to approach the work
audit
Keyboard navigation accessibility was a high priority and existing grid-like components did not perform well. After the new components were designed, I audited the existing application and proposed the best new component option.
communication
During the design and development process, constraints and conflicting opinions are bound to surface. The way we speak and write to our colleagues impacts the work. For this project, maintaining open communication with the engineering team informed the design process.
outcomeThe design solution was a set of 3 different data tables. Each of these tables had properties and features that allow it to excel in specific contexts, making it feasible to create cross device and accessibility compliant components. Micro and macro level details such as keyboard navigation model were also considered.
