👋 Hey, I'm Mitch Butler.

I'm a product designer and developer from Halifax, currently based in Toronto.

In 2018, I founded Human Collective
In 2010, I co-founded Mappedin

LinkedInInstagramDribbbleTwitterMediumGitHub

Want to read the code that drives this site? I've made it public on GitHub

Launching JUJU

Last month I helped build and launch JUJU, a live streaming platform for artists.

JUJU was founded by artists who recognized a gap in the market for live online entertainment.

On one side of that gap, you had short-form events on platforms like Instagram. These streams were not curated, the quality was inconsistent, and the only way to earn from them was with a tip jar. Many artists aren’t comfortable “passing around the hat” to collect donations and end up giving away their content for free.

On the other side, you had long-form concerts with high quality and high ticket prices. These are expensive productions. The risk of investing in a show like this and having it flop is enough to keep most independent artists at bay.

Our goal was to deliver curated live content with concert quality, but with a shorter format and lower price. Most artists will perform a JUJU set of four or five songs for just a few dollars per ticket.

We knew that people were craving concert-quality streaming, so we invested a lot of effort into testing several streaming partners and platforms. It turns out that a little effort and preparation will get you to ticket-quality content. The requirements for the artists are minimal. Many already have access to the necessary home studio gear and a smartphone with a decent camera.

You can hear the quality in the promo video below. You might be surprised to find out that the audio in this clip was pulled directly from the live stream without any post-production. It’s what the audience experienced live.

As I said, we launched quickly. Our first show was within a month of being presented with the idea. With this speed came problems we had to solve in a hurry.

One such issue was unpredictable behaviour with the streaming player we selected. If the stream didn’t start until after the player was loaded, the video would occasionally fail to start entirely. Not good.

The solution we came up with was to give the fans access to a sort of “lobby” page with their tickets. Fans could visit the lobby page in the days leading up to the show, but it would display a show poster beside the comment feed instead of the live stream player. On the day of the event, the artist would begin streaming, and we’d watch as the stream buffered for a moment before flipping a switch to replace the poster with the live stream player for everyone waiting to watch. It was an odd fix, but it meant that fans would never be presented with the player before the video started. Crisis averted.

We announced the event early one morning a few days before the show. I like to do what customers will do as a sort of launch day ritual, so I bought a ticket to the show. I was satisfied to see that I landed safely on to the “lobby” page, but shortly after I saw a comment pop up in the comment feed. That couldn’t be right — the show wasn’t about going to start for another three days.

I panicked. Were we not clear that this is a live event? Maybe landing on this “lobby” page was confusing for the audience. How many fans might be waiting right now for the show to start!?

But, as comment after comment started to pour in and I read through, I saw that these fans did understand the premise and were using the lobby page as we never expected. They were leaving personal notes for the artist before the performance. Notes like:

So excited! The last time I saw you in concert, your children were small and wanted to sit beside you on stage!

And:

Last year we celebrated our 11th wedding anniversary by attending the Moon vs Sun concert in Montreal. To be able to celebrate our 12th anniversary by watching your online concert…it is hard to ignore that a tradition is being born!

Through the rest of the day, I left the page open on one monitor and watched as fans left incredibly personal and heartfelt notes to the artist.

On the day of the event, we sat in the lobby with the audience as the anticipation grew. Messages were now hitting the feed as quickly as we could read them. For the first time since the COVID-induced lockdown, we were sharing a moment with hundreds of other people. One comment captured the moment beautifully:

I love this feeling — same feeling when you sit in the audience before a CK show starts, [watching] the beautiful grand piano on the stage and the awesome lighting, and then the house lights dim…

Incredibly, the lobby was the result of a last-minute fix to an odd bug. It had left an impact that we could never have expected. It gave us a space to share our thoughts and a chance to share our excitement at a time when we’re all separated. The experience convinced me once again that nothing will teach you more about a product than launching it.

December 5th 2019

Assisted Support Chatbot

This one is for everyone dealing with a large volume of holiday customer support over the holidays 🎁

A (concept) support bot that handles simple requests for customers, allowing support reps to monitor, take over, or update chat rules in real-time to keep customers happy.

View on Dribbble
December 4th 2019

Dark Mode Expert Chef App

There are plenty of recipe apps in the App Store, but we're missing something that caters (pun) to an audience of experts: chefs who aim to measure and improve their recipes. This is a concept aimed to address that.

View on Dribbble
December 2nd 2019

Reccomended Wines

Playing with wine elements and representations for a project.

View on Dribbble

How I think about design specialization.

If you have a hard time understanding design roles, here’s a shortcut: design is a spectrum from conceptual to practical.

Research → Experience → Interface → Prototyping

Research is where you gain detail on your users and the challenges they face. A talented researcher will uncover insight and empathy by monitoring and interviewing users. They’ll build tools (e.g. user personas) that will ground your team in a deep understanding of the problems you’re solving.

Experience covers the pattern of interactions, feedback, and information that define the way a user will engage with your product. Experience designers produce wireframes and flow charts that choreograph a user’s journey from their first impression to their mastery of the product.

Interface designers create visual components and screens that influence the look and feel of your product. They work with color & contrast, visual hierarchy, and animation to create a blend of familiar interactions with a unique visual identity.

Prototyping provides the team with interactive mockups for testing and iteration. Prototypers work in code or using specialized tools to quickly create experiences resembling the end product closely enough to test with users in context and rapidly iterate.

Most designers working on product teams will have expertise somewhere along this spectrum. In most cases they’ll also have some skills in adjacent domains, for example many experience designers have skills in interface design or user research.

How is this useful?

This is a quick way to understand designers and design teams, their strengths, and any gaps that might exist. If you’re a small company looking to hire your first designer, then it helps to understand which set of skills you’re looking for and which candidate is the best fit. As you grow your team you can use it to balance complimentary skillsets. At Human Collective, when we’re helping a client decide where at start, we always recommend hiring from the inside out and maintaining a balance that matches their needs.

A word of caution: any useful model is a generalization, and is therefore destined to be wrong around the edges. That said, I’ve found this to be incredibly useful when explaining design roles to non-designers.


How I think about design specialization. was originally published in Human Collective on Medium, where people are continuing the conversation by highlighting and responding to this story.

hover to load
April 25th 2017

Expanding Search Results

View on Dribbble

Why Not?

If someone at work asks their manager “Why do we hold this weekly meeting?” or “Why does our product have this feature?” the response should never be “Why not?”

Why is it important? Maybe it’s mission-critical, maybe your competitors do it, or maybe it’s just “expected” in your industry. Processes are defined with good intentions but over time conditions change and when they do our instinct is to hold our ground.

To ask “Why not?” is to justify losing effort and gaining complexity just because there’s no good reason not to. Instead, we should ask ourselves “Why?” and remove those features, meetings, etc for which we don’t have a good answer. It ensures everything we do has a clear sense of purpose, and it creates space to do the things that our competitors don’t do and that aren’t “expected” in our industry.

April 24th 2017

Store Profile Cards

Playing with what a simple location profile might look like. Photos taken from official brand Instagram accounts.

View on Dribbble

What can we Learn from Brutalist Web Design?

As designers, sometimes we forget about our audience. We set out to build things that are trendy or technically interesting instead of powerful and meaningful. We can spend hours tweaking the aesthetic only to populate our work with meaningless placeholder content.

Brutalism has set out to challenge what’s trendy. It ignores conventional grids, opting instead for an ugly mess of layered content. It denies users of common patterns for navigation and leaves them on their own to discover how to access other pages (or not). We find these designs shocking and obscure because they challenge the part of our craft that we seem to identify most with: our trends and conventions.

Ironically, brutalist design has itself become a trend and it won’t be long before it can’t support its own satirical weight. Until then we should learn what we can from it.

Here’s what brutalism gets right:

  • We’ve become frivolous. Our communities tend to reward displays of style and technique above meaning and impact. We should focus on saying something even when it means a design that’s less technically impressive. Not every time, but sometimes.
  • Content should not be interchangeable. It should shape the form and flow of the page. Design the content first.
  • The simplest deviations from trends seem to be the most effective. For example: replacing complex layouts with a single column, or delicate font pairings with a single rugged font. These will still be around when brutalism is not.

Methods of Production

As the modern movement emerged in fields like industrial design and architecture a designer’s most important asset was their understanding of materials and production. There’s a sense of modesty in the designs of the 60s and 70s. A sense that designers were chipping away at the usual facade to uncover something about the things they were creating.

In UI design, the methods of production (programming) have become so flexible and abstract that exposing them seems less valuable. The fact that the work is so unconstrained has caused many designers to become less engaged in implementation leaving the choice of tools and methods purely up to developers. This has triggered some exciting growth and specialization as designers search for new frames of reference (e.g. User Experience Design). That said, the lack of continuity between design and implementation is going to hurt the field as we face the limitations of new technologies.

As we move into an era of natural language interfaces we’re regularly hitting the limits of what the technology can do. Just watch someone using Siri for the first time and you’ll see this. Yet designers aren’t exploring and exposing these limitations. They aren’t pulling back the facade to find value in the patterns and materials that form these products. Instead we’ve regressed back to decoration and novelty, and we seem to be designing and marketing tools like Siri as if its limitations don’t exist.

Once again we need designers to take an interest in the materials and methods they’re designing for. It’s is the only way we’re going to uncover the value of technically limited products like natural language or predictive interfaces.