Graphical User Interface Design Guide
Project Role: Author and Visual Designer
Audience
This guide is intended for highly technical and specialized A/V configuration and programming specialists who have very little experience with graphic or interaction design. The guide provides a high level overview of best practices of interaction design and how to apply these principles in terms of creating touch panel projects.
Context
Extron manufactures A/V equipment, but the company rarely configures or installs that equipment. Some of our touch panel interfaces are highly visible by customers yet completely customizable by installers. My project was updating and improving the existing GUI Design Guide to serve as a best practices and foundation for good design.
Previous version of the GUI Design Guide.
Goals
- Update the guide and expand in terms of content and visual appearance to make it more approachable and readable.
- Provide step by step instructions of how to achieve best practices with Extron's GUI Designer software.
- Provide tailored guidelines on designing for multiple screen sizes, audiences, and scenarios.
- Give the audience tools to evaluate their interfaces in terms of their client's needs.
Adding an infographic to explain how to design for our smaller touch panels.
A sample page describing how to choose a custom color scheme.
Activities
- Interviews
- Ethnographic observation
- Investigate customer support questions and problems regarding touch panel projects.
Process
I reviewed the previous edition of the guide and audited Extron's external training program to learn the needs of our users and understand what they were already learning in our courses. This allowed me to identify gaps in their understanding and tailor the GUI Design Guide accordingly.
Sample page describing principle of consistency
Quick reference page to describe appropriate touch targets and spacing between objects.
Results
Using globally recognized design experts (Don Norman, Jakob Nielsen, Bruce Tognazzini, Susan Weinschenk, Steve Krug, Luke Wroblewski) as sources of information I updated and edited content, added infographics, added step by step instructions for working with our software, added heuristic charts to help our audience objectively evaluate their interfaces and added additional takeaway sections after each chapter to improve reading comprehension and scanning.
In the future, and as our tools and software becomes more advanced we hope to add additional sections such as gestures, haptic feedback and voice interfaces. Furthermore, we hope to move this guide into an online digital format with videos as another interactive learning tool. We also hope that this guide inspires the curriculum for a new Extron training course for user interface design.