Last month, we introduced Slack and Google Home design but, up until now, there was no way to properly prototype a Facebook Chat Extension interaction. Also, there was no way to design a web-views shown inside a Messenger chatbot experience. From today you will be able to, with Botsociety!
Facebook Chat extension
A Facebook Messenger Chat Extension is like a micro-app that you can embed into a Facebook Messenger experience. The cool thing about it is that it can take place inside a conversation between two or more users. Something like
It’s really powerful, and it requires a different design process compared to a Facebook Messenger chatbot. In order to properly design a Facebook Messenger chat extension, the steps are usually:
- Produce a hypothesis of an ongoing conversation between two or more users
- Define the moment when the user opens the Messenger Chat Extension
- Define and design the screens shown inside the extension
- Define the output of the extension inside the chat
- Repeat from point 1 until you are finished!
From today, you can now use Botsociety to create a high-resolution prototype of those steps. You can use the graphical design application of your choice for step 3 – Sketch for example – and then upload its output to Botsociety.
Facebook Messenger update: Webview
Following the same idea, you can now add custom web view inside a Facebook Messenger chatbot preview. We decided to take the same approach: You can design the web view with your favorite graphical tool – such as Sketch – and then upload its output to Botsociety. We will then take care of showing you how it will exactly look like during the chatbot experience, on iOS and Android.
Curious? Try Botsociety today, it’s free!
Start up? Open source? Education? If you are a start-up, open source or education project, and you are using Botsociety, you may be eligible for a Promotional code and other cool stuff! Fill this form and we will get back to you
Also published on Medium.