TL;DR: We launched a cleaner event design, using Slack’s newest capabilities.

see future imageEventbot was created in November 2017 and since then we’ve added lots of calendar features built around the core element…the event! We’re happy to announce that we’ve re-designed our events to be easier to read, simpler to use, and more adapted to mobile devices!

Slack’s Tooling
As a bot built on top of Slack, Eventbot is limited in the interface we can show users. Calendars present a further challenge as there’s lots of required information to present clearly. Slack bots, like Eventbot, used to use “attachments” which are added to a message and could contain text, buttons and drop downs. However, Slack introduced an entirely new way to communicate as a bot in early February. Their new interface is called Block Kit referencing the modularity that developers like us can use to compose better messages to users.

We would hear feedback from users who said Eventbot felt “clunky” and interface was “too complicated”. This hurt. We knew visual changes were a bit overdue so we’d became early beta testers of Block Kit in 2018. The promise of Block Kit meant that messages would be highly customizeable, however, we realized that some of Eventbot’s complexity as a calendar would take some time to change. So we sent feedback to Slack’s wonderful Platform team and iterating on our designs using their very handy Block Kit Builder. Earlier in May, we felt like the pieces started coming together and we’re excited for this new look for Eventbot.

Before and After

The new event design is significantly different, as we prioritized three things: minimize screen real estate, simplify interactions, and make the event visually appealing. We also had to manage Eventbot’s different ways of displaying an event: the summary view of a single event, the longer details view, and a list view of multiple events. Here’s how the new Block Kit designed interface looks in the summary view:

summary view calendar slack

The biggest difference in our core event design is that we’ve opted to use less buttons. To RSVP, users can now select an option from a drop down. We’ve also opted to use smaller text for the date, location, and attendee count. The result is a much cleaner interface for each single event. We also took advantage of a new Block Kit feature, allowing in-line buttons which is perfect for the ability to switch to “Calendar View”. This drastically reduced the number of lines each event takes up, which is a win for user readability.

detail view calendar slack

In the details view of an event, Block Kit pays off in a big way! Eventbot now uses much less screen space for the attendees and is visually easier on the eyes. But the biggest win is that less frequent actions like editing and event or inviting users is now found in the “…” overflow button! No more scary red “danger” buttons - hooray!

The effect of the redesign is compounded in our list view. When multiple events are stacked together, it’s no longer a wall of button. By using dropdowns for the RSVP we even gained a new ability for users to see their chosen RSVP (instead of the static buttons)! Plus, we were able to move buttons like “Post to channel” into the “…” overflow section giving users the ability to remind the channel about a single event! These savings are also apparent on your mobile device since Slack’s phone app shows this new formatting well. Overall, removing buttons and moving to Block Kit produces a more intuitive experience and enables new opportunities for functionality!

What’s next

Block Kit is exciting and it’s a big upgrade for apps like Eventbot! There are a few more places in our app where we’ll be upgrading the design. It’s nice to know that Slack is also adding more features and capabilities, so over time apps will look better and do more within Slack. As always, we’d love to hear what you think! 💌 Send us a note with your comments on the new layout. We’re excited to hear your thoughts!

see future image🚀 Aren’t using Eventbot yet? Install from Slack’s App Directory!

🐦 Follow us on Twitter & Facebook for new features and ideas! 🎉

Photo by Anna Kolosyuk // Unsplash