Monday, June 26, 2017

Conversational Bot UI Features Missing in Slack


Conversational UX design is evolving as more and more apps begin to incorporate conversational UI functionality. While the concept of a messenger-centric UI can seem simple, the melding of a messaging-first user experience is nothing to underestimate. Conversational user interfaces can be simple for humans to interact with (you are just chatting back and forth), however, blending in and balancing rich visualization and complex interactions is not simple to get right. Just like any other UX, it is a balance of minimalism while allowing for rich expressiveness in the UI without overwhelming the user.

Slack is one of the leading platforms for building bots, especially for enterprise applications. However Slack has a number of bot conversational UX features that are still missing relative to other platforms such as FB Messenger, for example. Here is my compiled list of features I would like to see in Slack's bot framework to improve its messaging UX and bring it on par with platforms like FB Messenger:

1) Conversational Streams and UI Alignment
Slack bots (especially in direct-messaging one-on-one dialog flows) force the bot and the user to both be left justified in the messaging UI stream. This goes against UI norms found in the majority of messaging application and related best practices for messaging apps. Typically in a streaming messaging flow, your conversational stream (you being the person interacting with the bot) is on the right of the screen and the party you are talking to (in this case the bot) is on the left side of the screen (or it can be visa-versa).

This is something not supported in Slack and makes a number of things awkward and cluttered in a bot-to-human dialog, especially when it is one-on-one (as opposed to Slack group channel). In Slack the entire conversational interaction is left justified, which can make the UI look cluttered when there are visual rich elements involved and and things like "Quick Replies" in the back and forth stream.

I hope that Slack will allow for aligning the bot vs the user on different sides of the messaging stream, something more similar to how FB Messenger works. This will allow for a more natural conversational interaction.

2) Horizontal Scrolling Carrousel UI Components
Slack (mobile and desktop/web) does not provide any kind of horizontal card or horizontal scrolling carousel. While some might consider this bad design (to allow for horizontal scrolling of cards), it is often necessary to minimize the vertical area needed to display information in rich messaging interactions. FB Messenger allows for limited horizontal scrolling carousel that I find to be very useful when building bots. Hopefully Slack will incorporate this. Slack already supports rich "attachments", so it would be a natural fit to allow for some limited level or horizontal scrolling.

3) WebView Integration
Slack does not have explicit support for messaging buttons that open a webview UI. Sometimes a webview is needed to show rich web content (again here this kind of feature should not be abused). FB Messenger has this ability and allows for controlling how the webview window is opened and closed. This can be mimicked in Slack by using embedding links in the "field" elements for example, but is a bit of a hack.

4) Quick Reply Buttons
One particularly nice feature I got accustomed to using in Facebook Messenger is the feature referred to as "Quick Reply". This allows the bot to display "Quick Reply" buttons that are shortcuts for the user to enter commands that they would normally have to type.

There is a away to mimic quick replies in Slack, but it again, it is a bit of hack. Check this open source node/slack project for an example of how this works with Slack. Quick replies are a real necessity in a rich messaging interaction. Again here, I hope that Slack adds this feature natively instead of making bot frameworks jump through hoops to  emulate this feature.

Hopefully the Slack product team will address these issues as Slack is by far the best team and enterprise collaboration/messaging platform on the market today.

FB Messenger might have some superior bot-to-human interaction and UX functionality, but it inherently lacks the team collaboration functionality and the many third-party integrations that Slack has to offer. Perhaps FB Workspace might have something to offer down the road, but it has a long way to go in order to catch up with Slack.

Tuesday, June 20, 2017

Building Slack Bots with Node.js

There are a number frameworks for building Slack bots such as botkit and beepboop. But sometimes you just want to use the native Slack APIs and build your bot without the added burden of a complex bot application framework. If this sounds like what you are looking for, then you have come to the right place.
This project demonstrates how to apply the essential Slack APIs using the keep it simple principle and a straight forward approach to extending and customizing your bot's conversational dialog and interactive UX (interactive buttons/menus).
Slack has an extensive set of APIs for building user-to-bot conversational UI and interactive messaging applications. This project implements a bare minimal bot application written in node that provides a template for integrating with the various Slack APIs. This is a starting point application for building your bot that can be thought of as a basic modular template and set of coding patterns for building a Slack bot that exercises the essential Slack APIs and bot interaction features.
Support for api.ai is included for demonstration purposes, but other NLP services can be used instead.
The focus of the project is to make it easier to implement NLP intents and conversational bot/user interactions and the associated UI interactions that might come about from the use of Slack attachments (such as Slack interactive message buttons and interactive message menus). Adding new NLP intents and handling the callbacks for interactive UI elements are demonstrated in this basic bot. Examples for using incoming webhooks and slash commands are also provided.
The hope is this project will make it easier to start building a Slack bot by providing a template on which you can extend your bot with new dialog/conversations and interactions. The coding patterns will hopefully make it easy to extend the conversational user interaction when building your bot.
By design, this bot uses the Slack Event API and avoids any use of the Slack RTM API.
Note, that this bot was not designed to work with Slack Enterprise Grid. Some minor modifications would be required to have it work in a cross team enterprise environment.
Slack APIs demonstrated in this bot application:
  • Event API (subscribes to: "message.im" and "reaction_added").
  • Sending Text/Attachment/Interactive Messages via channel reply.
  • Sending Text/Attachment/Interactive Messages via Incoming Webhook.
  • Handling Slash commands.
  • Handling Interactive Message actions.
  • Handling oauth.access to store and use bot access token.
In addition to the core Slack REST APIs, this app demonstrates how to use the following slack wrapper APIs:
  • @slack/client
  • @slack/events-api
  • @slack/interactive-messages
  • @aoberoi/passport-slack
Give the GitHub project a spin. Hopefully you will find it a good starting point for building Node native Slack bots.

Wednesday, June 14, 2017

Python Data Science and Machine Learning Stack

If you ever wondered how the whole Python Data Science and Machine Learning stack all fits and plays together (Numpy, Scipy, Pandas, scikit-learn....)