Tutorials

How to design a Facebook webview

In this tutorial, we are going to design a Facebook webview using Botsociety and Sketch App. A Messenger webview allows your users to visualize a website inside the Facebook Messenger experience without getting out of Facebook Messenger itself. By using web views, you can mock what happens if the user clicks on a button. But it's when you build your own, custom website that web views become powerful. (more…)

Tutorials

How to design a Facebook Carousel with Sketch

When designing a Messenger chatbot, one of the nicest message formats that you can send is a carousel. The carousel allows you to send multiple images, titles and multiple links for each element of a carousel. In this tutorial, we are going to design a Facebook carousel using Sketch and Botsociety. Note that it is not strictly required to use Sketch - any other image processing software will be ok. I also like Figma, or GIMP, for example. (more…)

Tutorials

How to create your first Slack bot mockup

In this tutorial, we are going to create a simple Slack bot mockup. Designing a Slack interaction before actually building it will help you save a lot of time. How? By previewing and prototyping your bot, you will be able to define the best user interaction possible before actually building it. Otherwise, you will figure out it does not work after you build it - which is very expensive, not to mention frustrating! (more…)