Interactive conversations
Jellyvision’s interactive conversation format presents a virtual conversation with an expert host who offers helpful, clear guidance on a complicated topic.
The experience is a blend of spoken audio and onscreen text or art, personalized to the user based on their answers to the host’s questions. The user answers the host’s questions by selecting the button that best represents their choice.
Although some of the practices listed below can be applied to interactive experiences that aren’t driven by an audible host (like ALEX Go), much of this advice is primarily for writing scripts that feature both audio and onscreen text (including ALEX Benefits Counselor or ALEX Medicare).
The Jack Principles
The Jack Principles is a book written by Jellyvision’s founder, which lays out Jellyvision’s approach to writing interactive conversations, whether for games, education, or decision support.
Although a lot has changed since they were written, the fundamentals of The Jack Principles are still applicable to UX writing. The book focuses on two main principles that we strive to follow in our interactive conversations:
- Maintain pacing
Engage the user and draw them through the experience by offering them a series of focused tasks and meaningful choices.
- Create the illusion of awareness
Bring a sense of human interaction to the experience by:
- Using friendly, informal language that’s appropriate to the context
- Recalling the user’s previous answers and choices
- Ensuring the flow of interaction and speech doesn’t seem repetitive or robotic
What follows are some practical applications of the Jack Principles we use when writing questions, choices, and audio scripts for our Interactive Conversations.
Questions
Ask questions frequently
Questions are what let us make the conversation interactive. They allow us to personalize the experience to the user and give them control over the flow of the conversation. They’re also our best tool to regulate the pace, reset a user’s attention, and keep them engaged between dense moments of explanation.
Example: In ALEX Benefits Counselor, the comparison of the user’s costs on each medical plan is a lengthy explanation. Midway through this explanation, ALEX asks “Are you ready to see how the plans would handle a worst case scenario?” to re-engage the user and give them agency in the experience.
Ask meaningful questions
If all answer choices for a given question lead to the same outcome, the question should be cut or redesigned. Rhetorical questions like, “Do you like to save money?” effectively pressure the user to give a predetermined answer in order to arrive at a predetermined outcome, which may frustrate the user.
Give each question context
All the info a user needs should be in front of them when answering the question. For example, if you’re asking them if they think they’ll hit their deductible, that number should be somewhere on screen, either in dynamic text, a tooltip, or something else.
Example: In the tax savings section of ALEX Benefits Counselor, ALEX asks the user if they would like to contribute enough money to their Health Savings Account (HSA) to cover their estimated medical expenses.
On this page, we show the user their total expenses, what they’d need to contribute per paycheck, and how much they could save on taxes.
Tell users why they’re being asked for their information
People will be more comfortable answering personal questions about salary, living situation, or health matters if they understand how the information will be used for their benefit.
Example: Before asking the user for their tax filing status, ALEX says: “To estimate how much you can save, I need to ask…”
For more examples of how we consider our users’ experience, go to the User Consideration section in the ALEX Medicare style guide.
Choices
Limit the answer choices
When asking a question, it’s best to only give the user two or three responses to choose from.
There are exceptions to this, like checkboxes or radio buttons. But if a straightforward question requires four or more possible answers, it might be worth asking if there are different ways to organize the UI rather than presenting someone with a stack of eight buttons.
Example: When offering the user a chance to select a contribution level for their HSA or 401(k), rather than offering multiple buttons for different levels of contribution, ALEX offers the user three options:
- Yes, I’ll contribute [the recommended amount].
- I’ll contribute a different amount.
- I won’t contribute.
Offer the recommended or positive choice first
When providing choices, position the affirmative choice first to make it as easy as possible for the user to move forward.
If providing multiple options, try to list the choice we would recommend first.
Example: The user has multiple options when reviewing their medical plans in ALEX Benefits Counselor, but since we generally think a personalized cost comparison is a valuable starting point, the first button reads “Yes, let’s estimate costs to help me pick a plan.”
Answer choices should not overlap
Avoid structuring questions and choices so that multiple choices could be true for a single user.
Imagine if a user rarely ate hot dogs, but likes both mustard and ketchup equally when they do. How would they answer this question?
What is your favorite hot dog topping?
- Ketchup
- Mustard
- Something else
- I don’t eat hot dogs
To compose a better set of answers, follow the MECE principle, where every set of choices contains individual options that are Mutually Exclusive from each other and Collectively Exhaustive of all possible options as a whole.
To account for the possibility that users enjoy ketchup and mustard most together, the MECE-tested answer set for the example above might look like this:
What is your favorite hot dog topping?
- Ketchup
- Mustard
- Ketchup and mustard together
- Something else
- I don’t eat hot dogs
Make sure everyone has a choice
Following the MECE principle above, when asking a yes/no question, you probably need an “I don’t know” or “I’m not sure” choice as well. If a user can’t answer a question, their answer is going to be closing the window, and we don’t want that.
Example: When asking a user if they’ll cover their spouse with their medical plan, we offer them a “not sure” option, so that they don’t need to immediately commit to this decision in order to get the information they want.
Host audio
Write to onscreen text
Structure your sentences so they can be displayed on screen in a clear, concise way alongside the host’s audio.
It’s the dialogue equivalent of designing “mobile first.” It’s hard to go back and rewrite to accommodate this later.
Reference what the user input
This is one of the best ways to keep up the illusion of conversation, even if it’s just parroting back the user’s choice before presenting an option (i.e. “Because you’re spending a lot at the pharmacy, you might want to consider…”).
Example: In ALEX Benefits Counselor, when asking the user if they’d be interested in accident or critical illness insurance, ALEX connects it to the costs the user estimated. “Since you included an urgent care visit in your estimates…”
The host should not read phone numbers or URLs aloud
Instead, use generic phrases like “Check out THIS website for more info” or “Log in HERE for more” and let the onscreen text do the work.
Example: When displaying a link to a Medicare tool, ALEX says, “Here’s where you can go for some guidance,” instead of spelling out a lengthy web address.
Keep the host’s personality out of the answer choices
Answer choices should be clear, concise, and neutral. Forcing users to choose between “fun” choices like “You know it” or “Nada” is basically forcing them to assume a tone that might not reflect how they feel about their selection.
Don’t flourish after the user enters a choice
We want to acknowledge a response so the user knows that we “heard” them, but these don’t need to be drawn out. A simple “gotcha” or “okay” works great. Or parrot back the response like “six, okay” and keep going.