Syndicated News

Block Party

Meet Block Kit, an easier way to build powerful apps

There’s now a simpler, more flexible way for you to build engaging apps in Slack. Two releases make this possible: Block Kit, a UI framework made up of stackable “blocks,” and the Block Kit Builder, a prototyping tool that enables you to quickly design and code interactive Slack apps.

Defining your app’s TL;DR

Check out the sample app below. Isn’t it formatted nicely? The call to action to approve an expense report is clear and accessible at the top of the message with supporting, contextual information that follows. For the user, it is easy to parse. And fortunately, for the developer, it was simpler to build.

That’s because you now have more control over the hierarchy of an app message. Blocks enable you to define both order and appearance of information delivered by your Slack app.

Meet the new blocks

Let’s take a tour of the five new blocks you can build with today.

Section: Simply a container for text. A section block can be coupled with an inline action or image.
Context: A space to add helpful metadata or a description.
Image: An image container, including a caption.
Divider: A simple separator that makes messages more readable.
Actions: Interactive components for your app’s call to action; includes buttons, six drop-down menu types, and a datepicker.

Here are some examples of what’s possible with apps that launched today.

Guru, a knowledge management platform, helps people capture information as it’s shared with them in Slack. Using dividers, Guru’s “help” message now contains clearer calls to action, including an overflow menu that enables users to access advanced app functionality without cluttering their screen.

Optimizely’s Slack app enables product and marketing teams to brainstorm, test and track digital campaigns. The context block clarifies which marketing campaign a particular message is referencing — in this case, “Attic and Button.”

Doodle, a scheduling tool, built an app that enables people to indicate their meeting availability. Rather than jumping back and forth between calendars, the datepicker enables quick polling without leaving Slack.

The combined power of these blocks gives you the ability to deliver information in a clear, actionable way, enabling users to get more work done faster.

Prototype your app UX in the Block Kit Builder

The Block Kit Builder enables you to quickly prototype app interactions, selecting blocks and editing the code as you go.

The Block Kit Builder also houses customizable templates — pre-built common use cases for apps in Slack, such as approvals or notifications — so you not only have a foundational example of how to use blocks, but a head start with a majority of the code populated for you.

For instance, imagine you’re building a sales lead tracking app that shares updates between your company’s CRM and Slack. In the Block Kit Builder, select `Notifications` from the list of available templates.

You’ll see a pre-built notification message in the builder, including the corresponding JSON. Edit, add or even delete blocks that aren’t a good fit for your app. You might want to add a message menu or button to allow users to update a lead status from Slack. When you’re satisfied with the final output, copy and paste the JSON into your own app’s code.

How to get started

Whether you’re new to building apps in Slack or upgrading an existing app, the Block Kit hub is your place to get started. We can’t wait to see the beautiful apps you’ll build next.

View original content: Here