Riversoft turned to us to redesign chatbot platform, improve its user interface and simplified the conversational flow creation to reinforce the app’s user experience.
Riversoft offers an application supporting travel agencies. One of its features is a chatbot platform. They wanted to enhance it by redesigning its interface to make it more accessible for both – technical and non-technical users.
The main goal was to create a common workspace for technical and non-technical users engaged in conversational workkflows creation. The cherry on the top was development of a flow editor, that made it possible to create conversation scenarios through interactive diagrams within the application.
The client decided to partner with us, because they appreciated our developers’ experience in creating flows with GoJS library and our former projects’ beautiful and eye-catching design. Explore our cooperation with a Riversoft whose vision is to become a primary provider for tourist industry in Europe. Delve into improving chatbot ux case study!
Client | Riversoft |
---|---|
Business need | modernized design of their tourist application with new features |
Scope | Product Design workshops, UX, design system, development |
Technology | GoJS, Vue.js |
We had to make client’s application accessible for technical and non-technical users, so that they could work together and seamlessly on chatbot’s conversational flows.
The app’s old UI was archaic and increased the app’s entry-threshold. That’s why our product designers had to redesign the chatbot platform’s UI along with suggesting new features to boost its usability.
Client wanted to create conversational flows in visual form of a diagram. However they struggled with using GoJS library, so we backed them with our GoJS expertise.
Collaborative session to brainstorm new product ideas together, using various tools and techniques.
Refinement and validation of our idea with interactive prototypes to make sure it works well.
Creating final look&feel of the product to ensure right user experience and visual consistency.
Developing new features and refinement of the old ones.
The workshops’ primary goal is to deeply understand real users’ problems, based on shared understanding between team and client, and then find the right solution.
After each workshop session, there is time for internal brainstorming and analyzing earned materials. We polish user flows, create mockups, and consult technology solutions.
The workshops were held remotely through MS Teams and Miro.
To gain a deeper understanding of our users’ specific needs, we created user proto personas. This helped us grasp the intricacies of our target audience, allowing us to design a tailored experience. Our main challenge was harmonizing technical and non-technical user experiences while constructing a seamless flow diagram.
Through collaborative workshops with our client, we crafted wireframes showcasing the user flow. This step empowered us to validate and refine our proposed solutions prior to the final implementation, ensuring a seamless user experience.
See the chatbot UX best practices behind the client’s application’s reinforcement.
Our team of product designers took the initiative to revamp the application icons and UI elements. We introduced fresh and modern colors for different object categories, along with new shapes and colors for sidebars and panels. These updates had a significant impact on the chatbot UX design by giving the application a modern look&feel.
As a result, users now benefit from enhanced navigation capabilities. They can move through the application more efficiently, locate specific features effortlessly, and enjoy a more satisfying and streamlined experience.
Nodes have been equipped with notes feature. A non-technical user can create conversation history of the chatbot’s interaction with a human (the flow of the chatbot), leaving notes in the nodes to describe the specifics of how each of them works. Thanks to this, flow is designed for the user, ensuring a positive UX.
Thanks to the notes, the developer (technical user) easily finds himself in the designed flow and knows exactly how to introduce changes designed by a non-technical user that will allow the chatbot to work.
The user can build the diagram by dragging its elements from the palette (drag&drop), and also thanks to the context menu attached to each node. This accelerates work as the user can view and choose recently used node types.
The application’s default setting allowed to change node’s color freely, which was confusing for users because nodes of the same type could have different colors.
We have introduced a fixed color palette and icons for nodes, giving them specific meanings. Thanks to this, user can easily read the diagram by distinguishing individual nodes.
The flow editor with an intuitive graphical user interface (GUI) allows users to effortlessly create and modify conversational flows and operational structures through an interactive diagram. The result is a visually appealing representation of chatbot scripts and processes that are easy to read and understand.
New user interface, designed to keep users engaged, simplify feature utilization, and facilitate seamless navigation.
Chatbot platform accessible for technical and non-technical users, that can work together on chatbot flows.
Flow editor that enables creating chatbot flows in the form of an interactive diagram.