22
Cheryl Platz Interaction Designer [email protected] http://cherylplatz.com @muppetaphrodite

Cheryl Platz · 2017. 1. 30. · Microsoft // Connected Car // Speech Framework Example voice UI flow (VUI) for Navigation - in this case, providing partial management of multiple

  • Upload
    others

  • View
    3

  • Download
    0

Embed Size (px)

Citation preview

  • Cheryl PlatzInteraction Designer

    [email protected] http://cherylplatz.com

    @muppetaphrodite

  • Introduction // Background and Skills

    EDUCATION Carnegie Mellon UniversityBS in Computer Science and Human-Computer Interaction

    CMU’s Entertainment Technology CenterGraduate sudy and project work

    DESIGN SPECIALTIES

    Design for speech systems (Grammar based and natural language)

    Design for constrained attention (Automotive, phone over Bluetooth)

    Designing for nonstandard form factors (handheld game consoles, in-dash systems, etc.)

    Designing at massive scale (IT software to manage millions of CPUs at once)

    Designing for storytelling and immersion (video games, theatrical work)

    BONUS SKILLSImprov performer and instructor 10 years professional experience (Unexpected Productions, Seattle Experimental Theater, NERDprov, Jet City Improv)

    STEM Volunteer, Advocate and Mentor4 years teaching Intro to Interaction Design workshop to high school students, 4 years as volunteer STEM panelist, 2 years on nonprofit board

    EXPERIENCE

    Senior UX Designer // Amazon 2014 - Present

    Senior UX Designer // Microsoft2007 - 2014 Projects: Cortana, Windows Automotive, System Center Configuration Manager, Windows Intune

    Producer // Griptonite Games 2004 - 2007Shipped Games: Disney Friends (GBA/DS), Pirates of the Caribbean: Dead Man’s Chest (GBA/DS), Chronicles of Narnia (GBA)

    Assistant Producer // Electronic Arts2003 - 2004Shipped Games: The Urbz (GBA/DS launch title), The Sims: Bustin’ Out (GBA/GCN/PS2/Xbox), The Sims 2 (PC), The Sims: Makin’ Magic (PC

    Interaction Design Intern // Disney Parks & ResortsProjects: Disney’s Photopass, DTV

    Interaction Designer // MAYA DesignProjects: Symantec website, various banking clients, internal tools design

  • Microsoft // Connected Car // Speech Framework

    CONTRIBUTORS:Myself (Design Owner)2 Program Managers, 1 Prototyper2 Researchers

    PROBLEM: Design a best-of-breed speech system system for use in the car that passes all automotive industry distracted driving safety standards.

    In addition, guide all 5 major feature teams on the appropriate use of speech within their areas (Start, Navigation, Media, Communications, and Car)

    SOLUTION:Our early process focused on developing a push-to-talk experience that provided guidance to users without overwhelming. Careful attention was paid to multimodality, error handling, and the interaction between the VUI and GUI.

    At right, a sample progression of some of our initial PTT GUI, along with a VUI flow for dealing with low-confidence results of varying types.

  • Microsoft // Connected Car // Speech Framework

    Example voice UI flow (VUI) for Navigation - in this case, providing partial management of multiple waypoints during navigation by relying on context and particular keywords when making the request

  • Microsoft // Connected Car // Speech Framework

    Example “triple flow” for Navigation - Rationalizing the interaction between hardware buttons, touch input and speech input in a multimodal system that allows transitioning between these input types as the driver desires in the moment.

  • Microsoft // Connected Car // Notifications Framework

    CONTRIBUTORS:Myself (Design Owner)1 Program Manager, 1 Prototyper2 Researchers

    PROBLEM: Many of our in-vehicle apps needed to provide information to the driver, but interruptions threaten the driver’s safety.

    SOLUTION: We designed, tested and implemented a multimodal notification system that optimized for drive-related, time-sensitive notifications where a simple binary action can be taken in the vehicle.

    Our notifications taxonomy identified what sorts of information can be shown as an interruption, and what information could wait until after the drive.

    We also developed a series of rules for the implementation of the notifications to prevent accidental dismissal or overload. For example, interactive notifications must wait for at least half a second before taking touch input to prevent accidental dismissal.

    RESEARCH QUESTIONS:

    What verbal prompts are appropriate, and must they match the on-screen text?

    What visual patterns are most effective when presenting notifications?

    What notifications are relevant to drivers while in motion? What actions can be taken?

    Are these notifications safe and useful while in motion?

    What happens when a notification is missed?

    EXAMPLE EARLY EXPLORATIONS: Experimenting with size, placement, appearance and content of notifications.

  • ACTIONABLE NOTIFICATIONS CRITICAL NOTIFICATIONS

    APP NOTIFICATIONS

    These notifications are lightboxed to avoid creating a disorienting loss of context. The controls are oriented to the driver’s side and physically separated to avoid accidental selections.

    Critical notifications indicate immediate threat to the safe operation of the vehicle. Participants responded as desired, calmly pulling the vehicle over as soon as it was safe.

    “Toast” notifications were used for confirmations on background tasks (like “FM 89.5”) and select-ed alerts not related to the drive. Many drivers chose to ignore these entirely.

    CONTENT TYPES:We learned during testing that drivers were very specific about what messaging was appropriate when driving. If the driver couldn’t take action during the drive, the information was deemed a distraction (for example, tire pressure is low.) Drivers preferred to get this information before or after a drive unless it was a severe issue.

    VOICE UI: Actionable and critical notifications were accompanied by a spoken prompt and a question to the driver. This enabled many drivers to take action without ever looking away from the road.

    FINDINGS: We iterated on designs based on several simulator-based studies while driving. Our findings enabled us to limit the types of information shown while in motion, and verified that the binary action model was successful.

    Final designs were verified as safe against NHTSA standards using an eye tracker in controlled track testing in SUVs.

    Microsoft // Connected Car // Notifications Framework

  • Griptonite Games // Disney Friends // User Experience for Games

    TEAM:Myself (Lead Producer)15-person team of game designers, artists and programmers

    DESIGN GOALS:High immersionAll-ages playGender-neutral appealLighthearted brand-appropriate toneEffective use of flagship Nintendo DS functionality (voice, wireless, time of day, 3D)

    MY CONTRIBUTIONS: Initial game pitch & structureCollaborated on game designProject managementPeople managementAuthored game textScripted select cutscenesDesigned & executed playtests

    RESULT:Major reviewer scores of 7.0 and above (9.0 from USA Today) - particularly remarkable for a kids’ title “If you are a fan of these types of experiences you will be hard pressed to find a better offering than Amaze’s Disney Friends” -ZTGD

  • Griptonite Games // Disney Friends // User Experience for Games

    PROBLEM:Become one of the first Nintendo DS titles to incorporate speech recognition, but do so in a way that performs well, integrates seamlessly with gameplay goals, and can ship simultaneously in at least 6 languages.

    SOLUTION:In partnership with our game designers, I drove the creation of four separate voice vocabularies (one per character) to use the Nintendo DS’s built-in voice recognition system. Each vocabulary was extensively tested and customized in each supported language.

    We rapidly learned that the accuracy of the speech libraries dropped measurably with the addition of each new keyword/intent. We looked across characters to identify a desirable number of intents to be supported at any time.

    Interestingly, in testing we discovered reticence from some kids to speak certain phrases aloud (“I love you” doesn’t sit well with 8-year old boys) so in some cases we designed alternatives to include all play styles.

  • Griptonite Games // Disney Friends // User Experience for Games

    DESIGN:At right, several design artifacts I produced, including UI flows and an excerpt from the master game design document.

    TESTING:I drove usability testing into our core process. The first gameplay prototype was generated in 6 weeks (running on the DS) and placed in front of 30 kids, leading to major insights and changes to our core game design.

    We also conducted 3 rounds of focus tests and some extended duration in-home journal studies. Between major studies, we conducted frequent ad hoc kid testing with milestone builds.

    SAMPLE FINDINGS:Discovered play style differences in boys and girls that led to more inclusive design decisions.Showed that players spent surprising amounts of time in simple “activities” Found that even “expert” players needed basic tutorials on movement and touch interactionPrompted major redesigns of most in-game menus (Store, Pause menu, etc.)

  • PROBLEM:As we moved from concept car into framework for our suite of IT professional software, we needed to develop new visual design patterns.

    When there is so much content, the design must have a subtle presence so as not to overwhelm the data.

    Microsoft // System Center // Metro for IT

  • CONTRIBUTORS:Myself (Lead designer)1 additional designer1 prototyperPM stakeholders

    PROBLEM:Explore a unified approach to the most complex IT processes - software deployment and incident management in large networks.

    PROCESS:Scenario authoringExploration & sketchingStoryboardingHigh fidelity compsUser testingEvangelization

    RESULT:Our work was very well-received by our stakeholders and served as the inspiration for a number of concepts that made it into future design patterns and products.

    Sketches for a new concept, the application tile - it contains all of the information about a particular app’s deployment, but can also be physically manipulated on the canvas. Heavy use of progressive disclosure to handle complicated objects.

    Microsoft // System Center Configuration Manager // Concept Car

  • Microsoft // System Center Configuration Manager // Concept Car

    Above, explorations for a tool allowing administrators to drill down on properties of troublesome devices, looking for patterns and commonalities. Below, a sample high-fidelity exploration delivered to our prototypers. Pictured are minimized app tiles, a deployment, and the troubleshooting viewer.

    PHILOSOPHY:Behind these designs was an underlying hypothesis that our users only focus on a few tasks at once, that evolve over time. Rather than exposing long lists, expose frequent and recent objects and use the extra space for visualization and manipulation.

    FINDINGS:Though resources were limited, we managed to test our prototype with some of our target users (IT pros).

    Feedback was positive and constructive from this user base notorious for being resistant to “easier” software:

    “This is incredible compared to now.  It is easy to make changes. Very well thought-out.”

    “The pre work – patch work – post work and view status on the screen would be huge!”

    “I actually like it.  What I like is I don’t have to dig through the console to find what I’m doing.”

  • Microsoft // Metro for IT // Patterns and Guidelines

    PROBLEM:Define new design patterns for the next round of IT professional software. Optimize for touch and large screens, while synthesizing design patterns like the App Bar from other Microsoft products.

    FOCUS:I owned the patterns for Alerts and Commanding.

    Alerts have long been unactionable in our consoles, so the goal was to present the right amount of information with the right ways to take action without additional work.

    Commanding presents a particular challenge with regard to contextual commands - when working at large scale, contextual menus save our IT pros time. Old contextual menus didn’t scale well, and were sometimes accident-prone.

  • Configuration Manager 2012Case Study - Information Architecture

  • Microsoft // SCCM 2012 IA // Case Study // Step 1: Analyze

    CONTRIBUTORS:Myself (lead designer)1 additional designer, 1 researcher

    PROBLEM:SCCM 2007 was largely produced without UX consultation until the endgame. As a result, the product’s IA was a single, massive tree that represented every object type - and every individual object - in one long branched list. For large companies, expanding the wrong node could grind the whole experience to a halt.

    GOALS:Our task was to analyze the SCCM IA and provide guidance on how it could be overhauled.

    Create new groupingsPrevent major regressions for expertsDeal with massive scale & complexityBecome more consistent with our sister products

    DELIVERABLES:Visio diagramsUsability reports (cardsorts, clickthroughs)Interface mockups

    INPUTS:Previous tree structureUsability report from 2007 versionSystem Center wide IA efforts

    CHALLENGES:Reticent product teamMassive scope of product15 years of product history

    At left: a taste of the original SCCM 2007 management tree view, which could get MUCH larger.

  • Microsoft // SCCM 2012 IA // Case Study // Step 2: Flatten the Tree

    KEY CHANGES:Demoted child objectsFlattened treePreview pane pattern

    TOP LEVEL GROUPINGS:Site ConfigurationResourcesDeploymentsMonitoringMy WorkspaceTroubleshooting

    One of the most obvious problens was the impracticality of listing all objects in one tree when there might be thousands in each node.

    Part of the reason this decision was made was to provide access to child objects. But the tree view in the “navigation pane” allowed random access to objects that had no meaning out of context - they were dependent on their parents. Our first major decision was to “demote” certain object types that were always child objects. We removed them from the main tree, and extended the main content pane to allow the display of those child objects in context.

  • Microsoft // SCCM 2012 IA // Case Study // Step 3: Prototype & Test

    After our first round of IA work, we decided to prototype a new interface using the new architecture and put it into iterative lab testing.

    Among our major findings was validdation of our decision to demote certain object typess - admins did not have any trouble getting their heads around the concept, and were even delighted by some of the proposed changes to the preview pane.

  • Microsoft // SCCM 2012 IA // Case Study // Step 4: Iterate, Iterate, Iterate

    We took our findings from the first round of testing and spent several months evangelizing the changes with PMs and taking feedback. We reported our findings and our design/test plan for the future. Our top level groupings remained consistent, but some child nodes were moved based on feedback.

    At the same time, we were forced to incorporate major changes to the product roadmap, called the “Client of the Future” initiative - incorporating more user-centric management principles. This was a major paradigm shift for the product.

  • Microsoft // SCCM 2012 IA // Case Study // Step 5: Card Sorts

    One of the challenges of working on Configuration Manager is the small number of users available for testing. Our earlier tests burned through most of our available local pool. But with the sheer scope of tasks available, we needed more quantitative research.

    We slowly built up the user list required to do extensive quantitative research. We also took advantage of the annual Microsoft Management Summit to do in person open card sorting exercises with admins from outside of the Puget Sound.

    I worked hand in hand with our researcher and PMs to tune the tasks presented and to help interpret the results, suggesting changes based on the findings.

  • Microsoft // SCCM 2012 IA // Case Study // Step 6: Iterate (Once More, With Feeling)

    As we incorporated the card sort findings, yet more feature changes came down the pipe, as well as a looming Beta 1 deadline. Within a relatively short time period we made several major iterations to the IA, initiated more testing, and evangelized again with our PM counterparts.

    TOP LEVEL GROUPINGS:Site AdministrationClient AdministrationUsers & DevicesSoftware LibraryMonitoringAssets & Compliance

  • Microsoft // SCCM 2012 IA // Case Study // Step 7: Finalize

    In the end, we settled on just 4 major groupings based on a large body of research, analysis, testing, and design work, including some new information on user roles.

    These groupings managed to minimize role splits across workspaces, and managed to maintain reasonable consistency with other related System Center products.

    Beyond the top-level grouping changes, we found homes for a number of problematic child nodes and new features. Meanwhile, we introduced changes to the framework that allowed us to flatten the tree significantly from previous versions of the product.

    TOP LEVEL GROUPINGS:AdministrationSoftware LibraryMonitoringAssets & Compliance