Smart Assistant is a virtual assistant that can be embedded in any solution as part of a web app, mobile app, website, or existing dashboard. Retail or corporate customers can use the Smart Assistant to resolve queries, execute tasks and get smart advice. Content, skills and illustrations can be customized and extended to fit your product need.
Let’s inspect now more in detail the smart assistant design pattern structure.
The header section at the top allows you to maximise the view and get direct “customer support” through a video call or chat.
In the main content area, the start screen displays a human illustration you can use to personify this assistant. Different skills that can be customised are displayed to give users direct access to fulfil the most important or recurring tasks.
At the bottom, users can type or use voice commands to interact with the smart assistant. By clicking on the home icon in the header, users are redirected to the start screen.
Skills are small apps or functions that cover the most important or recurring user needs. When you select a skill, the smart assistant can act in three different ways: answer your question, offer your options to select or walk you through a step by step flow. Each step can show and combine different UI elements like cards, charts, chat bubbles, etc.
To be close to the user, the tone and voice is a clearly “natural speaking” language. A best practice is to put emphasis on the most important information by changing the font weight to bold.
Cards & interactions
In the different flows that a smart assistant could cover, you can use cards to display different options in a more visual way.
User flow example
Here is an example of a user flow triggered by a skill. Motion is key to give a more friendly and natural relation with users.
On desktop, the smart assistant can be opened by clicking on a fab button. It will be aligned to the bottom right part of the screen. On mobile, it will be displayed in full screen.
Tools to build the smart assistant
Let's start building your own smart assistant!