Hey Google. Get me ready for HQ

In collaboration with the Actions on Google Team and HQ Trivia, The Brigade set out to create a voice-first trivia game for Google Home and Assistant. The game’s host, Scott Rogowsky, and his A.I. Teacher’s Assistant Fredo serve up games of 12 questions that get more challenging as they go.

Players are invited to play via notifications on their phone and can play with any Google Home device or the Google Assistant app on their phone. Users of Smart Displays or Android phones are delivered an interactive visual interface for the game.

Using the admin we built, HQ can schedule themed days (history, music, etc), and manage questions to keep the game interesting over time.


Sounds like a fun game. But where do we start?

It is best practice in conversation design to start with interactions that work with your eyes closed and then layer on visual experience. As such, our primary focus would be nailing the dialogue first.

Example of the Dialogue Flow

We were given a set of 2,000 questions, each with three answers, in 5 different categories. Our first step was to analyze the questions and begin to sketch out the conversational flow of the app. This is much more like writing a choose your own adventure play than anything else we’ve designed. The first step was to define each of the characters.

  • The Host — Scott Rogowsky
  • The Teacher’s Assistant — An AI named Fredo
  • The Contestant — That’s you

Each persona had a defined role that helped us establish how they would communicate with each other. What kinds of things would Scott say? Who would high five a player if they got a savage question right?

With these roles defined, we were able to start writing our dialogue and mapping it out into our flow.

Hot Tip: When you are at this point, it’s a great idea to sit around a table (or Meet) and treat the game like a table read. Pick a teammate to play a role and try playing the game without any technology. This is a great way to begin ironing out conversational hiccups without burning development time.

Putting our dialogue to the test

As the written dialogue began to take shape, it was then worked into the audio-only version of the action. We used scratch recordings of a teammate’s voice to give us a chance to test the conversational exchange between Scott and Fredo, and get a feel for the timing.

We were able to uncover additional holes in our experience and make sure that we accounted for them. It is common for players to say things like, “Oh. The first one!” instead of stating one of the answers. Or they may get distracted by something and need to be prompted before closing the game.

Privacy tip: You cannot keep the mic open. Reprompts allow you to ask the player something before briefly reopening the mic. You are then giving them audio and visual cues that the app is listening.

Once the dialogue was in a solid place, we sent it off to HQ for Scott work his magic in the recording studio. With his voice, music and sound effects, the game began to come to life.


OK, now open your eyes

Google Actions can be delivered in a visual and touch experience for smart displays and Google Assistant on Android phones. We used the conversation UX to build to wireframe experiences for the next layer of our experience. Our tested dialogue made for a solid foundation to base the experience around.

Listening and reading

We wanted to allow a full spectrum of interaction methods at any point in the game. This meant that a person could play it with their eyes closed. They could also play it with the audio turned all the way down. Or they may bounce back and forth between focusing on the screen or just the audio. This meant that we needed to provide all the necessary information at all times, without making any part of the experience redundant or too distracting.

  • Display summaries of dialogue in interstitial screens
  • Always display the question and answers
  • Include both visual and audio cue for correct and incorrect answers

Doing so allows users to get a quick reminder if they missed something Fredo or Scott said.

Visual direction

The UI for was our opportunity to visually connect our action to the HQ Trivia app and add a fun layer to the game. It was critical to make it visually distinct from their primary app as to not confuse players.

HQ University on Android Phones
HQ University on Smart Displays

Sharing

Sharing conversational experiences can be a challenge. We choose to include a sharing interface on Android phones that allows users to share their score with friends.


Key Takeaways:

  • Be all ears in when you start. This is much more like writing a play than designing a traditional interface.
  • Embrace a process that leaves space to uncover variation in user input. This will help you design an experience that feels natural to them.
  • Treat the visual experience as an extension or layer on top of the base audio.

Links