Create Components
To develop a chatbot you need a few Front End components to provide a good user experience. Below you've been provided with wireframes for how the outcome can look to complete the flow. The outcome can be adjusted according to your specific need, feel free to style your components however you want and use whichever library you feel fits.
Tasks:
- Setup a re-usable component library
- Create the relevant components a chatbot with history and user information need (messages, input field, and other UI elements), see wireframes below for example.
- Make sure to follow best practices when it comes to Semantic HTML, Accessibility, Testing etc.
- Feel free to design your experience with own styling or based on already existing library/design system, for example Radix UI.