Screen capture of an interaction design prototype for a sidebar in the Finance app, which used SCXML (Statechart XML) to specify the exact interaction tactics. My role: interaction designer, prototyper.

Inclusive interactions for Windows apps

At Microsoft my first role was prototyper for the AMP team. We designed and built the first-party apps that came with Windows 8 (and later also Windows 10), which were many users’ first real experiences with the new Windows OSes and touch-enabled devices.

Our research showed Windows 8’s “edgy” design pattern, where navigation and contextual controls are invoked by swiping from the edge of a touch device’s display, was difficult for users to discover and learn. Since this directly impacted the usability of the first-party apps, we explored alternative patterns that were designed to improve usability and engagement.

Fingers, stylus, keyboard, mouse

I established the first tactile interaction design workflow on our team to explore and specify the way designs should respond to user input. This meant defining tactile designs using statecharts in SCXML, which was then used directly in a testable prototype using the SCION statechart interpreter for JavaScript. You can see an example of this in action at the top of this page.

Using statecharts this way clarified communication with product owners and engineers, and it also enabled us to iterate on interaction designs more clearly and see those iterations more readily in the prototypes, which user researchers were able to use as testable artifacts more frequently.