GUI Design for GEM Lite on a Pocket PCGeneral Dynamics C4 Systems

Evan DesmaraisGregory Kern

Introduction

• General Encryption Manager (GEM)

• GEM Lite

• Stage Two

• Last Year Simple Networking Protocol

Background

• Dell Axim X5 Pocket PC– 400MHz Intel XScale™ processor– 64MB RAM and 48MB ROM– 3.5 inches thin film transistor (TFT) screen– 240x320 pixels in 16-bit color

• How does current GUI research apply to PDA?

Project Scope

• GEM Lite connects to encryptors

• About 50% of the GUI depends on these connections

• Lab tour

GEM Lite Pocket Main Shell

1. System status indicator2. Device count indicator 3. Button cluster

a. Startupb. Shutdownc. Discoverd. Devicese. Eventsf. Requests in Progress

4. Menu/Icon Navigation Bar

5. Scrollbar

GEM Classes

GEM_Date_Time GEM_Default_Settings

GEM_Help

GEM_ChecklistPanel Class

Alternating soft colors make options more readableGEM_ChecklistPanel

object used to display the Event Log Settings portion of GEM Lite

GEM_DataGrid and GEM_Record Classes

GEM_DataGrid object shown here as a component of GEM_GridPanel class

Each row is selectable

GEM_Record object uses alternating soft colors to make data more readable with minimal distraction

GEM_DataGrid example GEM_Record example

GEM_Alert Class

Descriptive event messages

Windows form covers all other panels, forcing user to acknowledge event before being allowed to continue

GEM_BarGridPanel Class

Icon Bar:

Images aid the user in determining each button’s functionEach cell selectable

and can be edited separately using buttons from the icon bar

Reusable panel class displays static routing tables and network manager from GEM Lite.

“Unique” Panel Classes

GEM_BGLPanel

GEM_AuditDataPanel covers two different views

Confirmation Panels

Error Checking and Prevention

• Regular Expressions

• Disabling Options

• Save Options

• Deletion protection

Aesthetics & Accessibility

• Button placement & icon design consistent with well-known applications

• Color scheme tested under colorblindness simulation

• GUI designed to give useful feedback regarding user actions

Aesthetics & Accessibility (colorblindness testing)

Original Protanope Deuteranope Tritanope

Testing

• Development testing (finding/fixing bugs)

• Exploratory testing

• Task-based user test

Conclusion

• Proof of Concept– Functional– Aesthetic– Accessible

Recommendations & Future Work

• Build back-end functionality

• Design & build encryptor-dependent portions of GUI

• Database solution

• Landscape mode

• Screen magnifier

Questions?