large_Crossover Series NFTs.png

medium_Crossover Series NFTs.png

small_Crossover Series NFTs.png

thumbnail_Crossover Series NFTs.png

From Photography to NFT Art: Twisted Digital Landscapes with Nate Hill

From Design System to ‘NFT Design System’: Creating TinyFaces

Neurodiversity and Inclusion: Choosing Kinder Design

medium_652ccf22c8853584bde5553986a4eed0.png

small_652ccf22c8853584bde5553986a4eed0.png

thumbnail_652ccf22c8853584bde5553986a4eed0.png

Web5 is here. Goodbye Web3? TBD.

<p><a href="https://blog.intercom.com/why-forms-arent-dead-yet/">medium bookmark / Raindrop.io</a> |  </p>
<div><img src="https://blog.intercomassets.com/wp-content/uploads/2017/10/11092248/Forms_Are_Not_Dead_Yet-1.jpg" alt="hero"></div>
<div>
<p>2016 was the year of the conversational interface.</p>
<p>Everywhere we looked, conversational UIs were breaking out of messaging apps and into the products we use every day, from shoe shopping to cosmetics and everything in between.</p>
</div>
<div><img src="https://blog.intercomassets.com/wp-content/uploads/2017/10/11151624/0-Other-chat-interaction%402x-1.png" alt="0-Other-chat-interaction%402x-1.png"></div>
<div>
<p>Many of these were successful, but many others were not. Conversational UIs might <a href="https://blog.intercom.com/designing-conversational-interfaces/">mirror the way we naturally like to communicate</a>, but they actually required more mental load than traditional GUIs. If you’re asking a user to engage in a conversation instead of tapping a button or two, are you really making things any easier? At times it felt like designers were blindly applying conversational UI to interaction design problems that already have better, if less trendy, solutions.</p>
<p>At Intercom, we’re bullish on conversational interfaces, but as a hybrid model of interaction. When we built <a href="https://www.intercom.com/live-chat">our live chat for sales solution</a> recently, rather than relying on text alone we incorporated conversational UI along with one of the least fashionable interfaces – a form. In this post, I’ll go through the design considerations that led us to the towards this hybrid interface.</p>
<h2>Figure out the problem first and the interface second</h2>
<p>Our live chat for sales tool is all about providing a personal, human selling experience to your website visitors. In order to do this, when someone lands on your website, your sales teams need to ask for some basic information through the messenger in order to understand who they’re talking to and how they can help.</p>
<p>Collecting this information manually is a mundane and repetitive task for a sales team, so we decided to build a new skill for our bot, <a href="https://www.intercom.com/operator-bot">Operator</a>, which would automatically collect your user’s information through the messenger on your website. Herein lies the challenge: how can we automatically collect this information in the simplest possible way for the end user?</p>
<h2>Exploration #1: simple conversational UI 😔 </h2>
<p>As Intercom is a messaging product, an obvious solution would be to rely solely on simple 1:1 conversational elements. Here’s how it worked:</p>
<ul>
<li>Operator collects the visitor’s emails and asks a series of further questions in order to “qualify” them e.g “What is your name?”, “What is your job title?”</li>
<li>Visitor replies with their answers.</li>
<li>System parses the responses as data entry.</li>
</ul>
</div>
<div><img src="https://blog.intercomassets.com/wp-content/uploads/2017/10/11133712/1-Convo-UI%402x.png" alt="1-Convo-UI%402x.png"></div>
<div>
<p>This approach has all the benefits that simple conversational interfaces have to offer.<br />It is a familiar pattern for everyone who uses text messaging apps, it uses the fewest amount of UI components possible, and it keeps all the user input interaction in one place (the reply composer).</p>
<p>However, many test users brought a number of concerns to light. From the end users point of view:</p>
<ul>
<li>They need to read each sentence from the bot and parse them individually.</li>
<li>There’s no obvious way to skip the questions if they aren’t willing to give their information.</li>
<li>It feels mandatory that they need to submit their information, instead of an optional path.</li>
<li>Overall, it feels like a spammy experience they can’t easily get out of.</li>
</ul>
<p>From an implementation point of view:</p>
<ul>
<li>To avoid some potential “<a href="https://blog.intercom.com/bots-versus-humans/">dumb bot</a>” experiences, it needs to correctly parse answers out of a conversational reply. For example, many people reply to “What is your name?” with “My name is X”. Is it really worth the effort to employ some degree of Natural Language Processing for a seemingly simple task?</li>
<li>Similarly, handling validation for some questions is unnecessarily complex. For example, if someone enters an invalid email, should the error messages be delivered by the bot as well? This would add a lot of transactional messages and thus pollute the conversation thread.</li>
<li>It introduced more work for our customers to set it up. They would need to manage how the questions are phrased and edit them for their own tone and voice.</li>
<li>Operator would need to acknowledge the user’s response through some form of language (e.g. “Thanks”, “Got it”). Again, this adds to the overall cognitive effort for people to parse.</li>
</ul>
<p>After grappling with the pros and cons of a purely conversational interface, we decided it wasn’t the best design direction for the problem we were trying to solve.</p>
<h2>Exploration #2: gathering information with forms 😐 </h2>
<p>If simple chat-based conversational UI wasn’t right for the job, what about relying on a form for collecting visitors’ information?</p>
</div>
<div><img src="https://blog.intercomassets.com/wp-content/uploads/2017/10/11133703/2-Forms%402x.png" alt="2-Forms%402x.png"></div>
<div>
<p><em>An early exploration showing a form-based approach overlaid on the messenger</em></p>
<p>Now let’s be clear: <em>nobody</em> likes filling out clunky, complex forms. As arbitrators of checkout, registration, and data entry across the web, their design often falls short, leading to friction and abandonment. As a result, many have ditched forms entirely in favour of different UI models.</p>
<p>Although asking users to complete a form isn’t the trendiest interaction model, the forms we tested to collect information did feel more understandable, honest and efficient when compared to the previous direction. Most people are familiar with basic forms, and it requires minimal back and forth bot interaction as the success and error states can be handled within the form directly.</p>
<p>However, our initial explorations with the form didn’t quite work. The form was introduced by overlaying on top of the reply composer and felt quite intrusive. It temporarily blocked people from sending a reply, and it made the whole experience feel mandatory and impersonal, not what we were aiming for.</p>
<p>However, perhaps we could try to keep the form interaction for collecting information, but think about a better way to introduce the form. </p>
<h2>Exploration #3: Delivering a form within conversation 😊</h2>
<p>Having explored two opposite directions, we experimented with a hybrid design between both of our previous approaches. We had Operator deliver a form <em>within</em> the conversation.</p>
</div>
<div><img src="https://blog.intercomassets.com/wp-content/uploads/2017/10/11133708/3-Form-in-conversation%402x.png" alt="3-Form-in-conversation%402x.png"></div>
<div>
<p>After trying out this approach out with a simple prototype, we felt this direction struck the right balance:</p>
<ul>
<li>It stays within the conversation thread and doesn’t majorly interrupt the user’s flow. </li>
<li>It clearly signals the interaction as being optional: people could ignore it and continue the conversation as they like.</li>
<li>It was much more efficient in terms of capturing information.</li>
</ul>
<p>To validate our instincts, we undertook a round of user testing with a prototype that engineers put together in just a few days. Overall, it tested much better than the previous two approaches. All the participants understood the data collection pattern and had no issues interacting with it. They understood that the questions were asked in order to get a tailored response, and had no issues actually giving their basic information. </p>
<p>Better still, a few of them answered all the questions within just a few seconds. In contrast, this interaction would take have taken significantly longer if it had been handled with simple, back-and-forward conversational UI.</p>
<p>Considering how well it performed during user testing, we shipped this “form within a conversation” as the baseline design to launch with. Some of the factors that led us to believe that this was the right solution for launch may change over time as the tech improves (e.g. Natural Language Processing is only still emerging). We’ll monitor and continue to evolve, and possibly iterate on it as we measure it post-launch.</p>
<hr>
<p>It’s a mistake to believe a conversational interface means every user input and output has to be handled in a purely chat format. Whenever it makes sense, it’s fine to consider a hybrid approach and use other interactive elements within the conversation (e.g. buttons, cards, forms) to help users complete their goals faster and with less friction.</p>
<p>As designers, we should avoid jumping on the bandwagon when the latest UI trend rolls round. Instead, we should focus on the problems in hand, fully explore possible solutions (old <em>and</em> new), and evaluate based on what’s best for the users, not based on our own design ego, or based on a post we read on Medium. Sometimes the best solution could be considered as “boring”, and that’s okay. Sometimes the most most obvious and unfashionable design is actually the easiest for people to use. </p>
<p>If this sounds like a project you’d like to work on, <a href="https://www.intercom.com/careers/design">we’re hiring designers right now</a>.</p>
<p>Further reading:<br /><a href="https://blog.intercom.com/principles-bot-design/">Principles of bot design</a><br /><a href="https://blog.intercom.com/bots-versus-humans/">Bots vs humans</a></p>
</p></div>
<div><a href="https://blog.intercom.com/why-forms-arent-dead-yet/">https://blog.intercom.com/why-forms-arent-dead-yet/</a></div>


The cult of conversational design and why forms aren’t dead yet – Inside Intercom

The cult of conversational design and why forms aren’t dead yet – Inside Intercom

Top Stories