The squared corner is the one that points at the person who is speaking, and it replaces the traditional arrow from the speaking character in cartoon balloons. So, rounding corners means making your chatbot UX more safe, reassuring, and relaxing -literally!Īn interesting solution is the one of Hubbot, Hubspot’s chatbot, where one corner is squared and the other three corners round. The problem with points and squared corners is that they recall tools like knives and harrows. Chatbot bubbles must have rounded corners, as the human eyes love rounded shapes.Ĭonversely, acute angles convey a sense of danger and menace, according to neuromarketing experts. This is an old trick, but it still works. Erica 3) Rounded corners look better than squared ones Erica utilizes the same font size and font weight almost everywhere, but different background colors for each element. Colors are often utilized to emphasize some elements. ChattyĪn example is the welcoming page of Chatty, where the message “Welcome to Chatty” is in dark bold characters and the rest of the texts in grey or white.Įmphasis can be obtained in several ways, not only through font-weights and font sizes. The elements that are usually emphasized are commands and buttons (like: “Start chat”), welcoming messages, error messages, or the names of the client and the application. You can use bold characters or bigger fonts to emphasize, for example. This is quite simple to do for a designer, as the rules are the same as any graphic interface. Hierarchy makes your chat UI simpler to use, as its crucial elements become immediately recognizable. 2) Any chatbot UI greatly benefits from a graphic hierarchyĪnother important rule for chatbot UI that comes from chatbot UX design is setting a proper visual hierarchy among each individual visual element of your chat. Green, white, and pastel colors are skillfully alternated to create a clear contrast between the bubbles that wrap around the conversation and the chat background. Simply choosing three different colors – one for the background, one for the background of the bubbles that hold your client’s words, one for the background of the bubbles with your bot’s words – allows readers to clearly distinguish who is saying what.Īn outstanding example of a graphical UI that applies this principle wisely is Lark. The usability of your chat comes greatly improved if it is possible to clearly distinguish your bot’s words from your customer’s words in the background of the chat. However, the barer the better is not always a fruitful idea in UX design. Nothing forbids to serve a chat in black typography on a white background. 1) A good chatbot user interface design has appropriate background colors
How can we make a good chatbot UI? I have worked out these 10 tips for designing by studying some of the ones that are considered to be the best chatbot UI examples on the web.
Just to give you an idea of the relevance of visual elements in chatbot UI design, consider that nonverbal messages are estimated at a good 93% of the total of communication. UI design is never a pure matter of aesthetics icons, designs, colors, and other visual elements greatly contribute to create meaning and make good communication. Your chatbot UI (where the acronym UI means user interface) needs care and love exactly as the functional and linguistic aspects of your application.
0 kommentar(er)
