<p>Published on <a href="https://blog.prototypr.io/virtual-assistant-vs-1995-wizard-2a347b14781e?source=rss----eb297ea1161a---4">| Prototyping: From UX to Front End &mdash; Medium</a> Pat Harrington </p>
<h4>4 design principles for creating a virtual assistant</h4>
<p>Remember the Wizards that walked us through the complicated software of 1995? By the end of the century, it felt like our computers were run by these Wizards. My favorite being the paper clip in Microsoft Word.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*-X0mHRfoDtzIhMP06uyFLg.png"></p>
<p>Then good design happened. Products became intuitive, fun to use, and discoverable. There was no need for a gimmicky wizard to teach us to use a product.</p>
<p>But yet, here we are. Out of the ashes of all the forgotten Wizards rose the development of Virtual Assistants. People have fallen in love with Alexa, Siri, Cortana, and Google Home. But what makes these products different than their ancestral counter parts?</p>
<h3>Librarian.ai</h3>
<p>I was recently asked to design a product for Librarian.AI. Their technology uses artificial intelligence to serve their users the most context specific documents so that teams can spend less time looking for what they need and more time working on their current tasks. Not only does it serve documents across platforms like Dropbox, Box, and Drive, but it also relays the workflow that helped create these documents. For example, if your teammate researched an answer to a tough technical question on Stack Overflow before putting it into a “Best Practices” document, you would see the Stack Overflow website along with the “Best Practices” document when searching for a this information.</p>
<p>With this technology, they asked me to design a product that <strong>feels like you asked an expert in the room to help you.</strong></p>
<p>I immediately thought about a virtual assistants.</p>
<h4>First Attempt = Wizard</h4>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*ekvF_qYEBASjEoPIJCDIsg.png"><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*cbLxz3ALe9cI-Ka3EelHXw.png">The multiple choice question and obvious results felt too mechanical. It’s like I was back in 1995.</p>
<p>Like many first attempts, my initial designs were bad. They felt out data, robotic, and static. I relied on a question tree to help narrow results for the user. It looked and felt like a Wizard from 1995.</p>
<p>So I went back to the drawing board. I looked at inspiration from some of the most popular virtual assistants and developed a few design principles that I think helped transform the design from a Wizard to an Assistant. The differences are subtle but the overall impact helps Librarian.AI have a much more human feel.</p>
<h3>Be Pervasive</h3>
<p>Be everywhere. The best virtual assistants are useful because they are always at your fingertips or within voice control. By putting touch points in multiple locations, the virtual assistant becomes a constant support in every part of your workflow. The trick is to make sure that the virtual assistant does not get in the way (like our paper clip friend from MS Word).</p>
<p>To accomplish this, I broke the virtual assistant down into three distinct objects.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/507/1*wk342xWXVGwYnvgky8Vbaw.png">Three different forms of the same virtual assistant.</p>
<p>Each of these characters are used in different situations. This allows me to put touch points throughout the product without it getting in the way.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*m3Z_Qo3ZifONqgVsbjKhmQ.png">The full virtual assistant is used to greet the user.<img alt="" src="https://cdn-images-1.medium.com/max/1024/1*uMivva10sCWiDf2h0LsVIA.png">The smaller versions are used throughout the design as constant touch points. Since they are smaller they do not get in the way of the user’s workflow but enhance the experience.</p>
<h3>Subtle Animations</h3>
<p>Check out this youtube video showing Botlr. A robot that brings room service items while you stay at your favorite hotels.</p>
<p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2FWIK-_VDPbps%3Ffeature%3Doembed&amp;url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DWIK-_VDPbps&#038;image=https%3A%2F%2Fi.ytimg.com%2Fvi%2FWIK-_VDPbps%2Fhqdefault.jpg&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=youtube" width="854" height="480" frameborder="0"><a href="https://medium.com/media/9d1d302aea9bccd94222f5c70323b3bc/href">https://medium.com/media/9d1d302aea9bccd94222f5c70323b3bc/href</a></iframe></p>
<p>The design of the robot is fun, friendly, and not intimidating. It feels like a nice human delivered you your things. They accomplish this feel by using some very subtle animations. The noises the robot makes, the eyes on the screen blink, it dances after a delivery, and it rolls at a human speed; all of these are in combination to give the robot its charm and personality.</p>
<blockquote><p>Adding subtle animations into a virtual assistant is essential to the overall experience of the product.</p></blockquote>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*DI88MKaUvlF1UCakL9GrqQ.gif">Above is a brief GIF I put together to demonstrate this idea to the Librarian.AI team. This GIF gives off a little Big Brother vibe, so it did not make it into the final version but shows the power that animation can have.</p>
<h3>Natural Language Processing</h3>
<p>Natural language processing is a beautiful technology. It has matured over the years and is one of the key reasons virtual assistants are becoming more successful. Humans get frustrated when other humans cannot understand them. Same goes for technology. Be sure to allow conversational language and highlight key phrases as a way to give feedback.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*c-BWHTb9epb4U50JzJqN1g.png">Here our technology recognizes that Susan Tucker is a team member, highlights it, and serves related content around this context.</p>
<h3>Serve Useful Results</h3>
<p>Serve useful results <strong>where the user is already working. </strong>The best virtual assistants constantly update their results based on user input, context, and other algorithms. They also put the results where the user is already working and organize it in a way that makes sense. If the virtual assistant is in a chat bot, serve the results right in the chat. If the virtual assistant is a voice command, talk back to the user in a useful way. <strong>Don’t link to another page or create a pop up that gets in the way of a user’s workflow.</strong></p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/422/1*pNheZybiLfM1H2tNFzTHvg.png">Here, even though our user was not asking a direct question, our virtual assistant recognized that it could help and served relevant information right in the user’s normal workflow.</p>
<p>If you are interested in librarian.ai as a product, please reach out to the librarian.ai team at info@librarian.ai.</p>
<p>For more on my work please visit <a href="http://www.itspat.ch">www.itspat.ch</a></p>
<p><img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=2a347b14781e" width="1" height="1" alt="stat?event=post.clientViewed&amp;referrerSou"></p>
<hr>
<p><a href="https://blog.prototypr.io/virtual-assistant-vs-1995-wizard-2a347b14781e">Virtual Assistant vs 1995 Wizard</a> was originally published in <a href="https://blog.prototypr.io">Prototypr</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


Virtual Assistant vs 1995 Wizard

4 design principles for creating a virtual assistant

Top Stories