THE PROBLEM

How do we keep members engaged in small communities?

Video

Video has always been something that draws people's eye. If a picture is worth a thousand words, at 28 frames per second, a short video is worth a million.

Every major social media platform supports the ability to upload videos to posts. Many platforms are even built entirely around video. In order to compete with these larger companies, we need to allow people to add videos into our product.

On our platform, community organizers (Hosts) embed videos in Mighty Networks that they publish on YouTube and Vimeo to teach courses, send out quick 1 minute conversation starters, and share recordings of live events. While embedding videos works, the Hosts spend a significant amount of time managing these videos on additional platforms. We found that members will rarely shared videos because instead of 10 seconds to share a video, it was taking 15 minutes.

By making uploading a video as easy as 2 to 3 clicks we can decrease friction and improve member engagement.

Challenges

1. How do we make this as seamless as possible for the user?

Defining What's Expected

2. We allow for image and file upload in a dozen different editors, but there are different flows in each that uploaded videos need to integrate into. How do we create a flow that feels consistent everywhere it's used?

How It Works at Mighty

3. In order to afford video, we needed to charge Hosts for storage space. When they hit the limit of their storage, they need ways to delete what has been uploaded, as well as set rules on how much users at different permission levels can upload. How do we allow Hosts to fully manage all uploads within their network?

Managing Uploads

What's expected

Because video upload is something so widely used, everyone has an existing mental model of how it's supposed to work. Building something unfamiliar could cause confusion.

So, I started off by mapping out how video upload works for other companies, and created a generalized flow that our platform could follow everywhere we support video. Try clicking on any stage to learn more about it.

Prompt to Upload

We always start with a button that prompts people to upload a piece of media. This opens some form of media picker that is oftentimes determined by the operating system.

Processing Draft

After uploading is completed, platforms optimize the video for ease of playback and minimal necessary storage. This can happen in the background while the user continues to draft the post. Platforms that allow for advanced editing options will wait to process the video until after the user publishes the post, and will playback the source video in the editor.

Processing When Posted

After uploading is completed, platforms optimize the video for ease of playback and minimal necessary storage. Not needing to leave the draft opened while the video processes saves the user the mental energy of needing to come back to it once completed. However, while it's processing, the post will not get published and can be returned to a draft state if the user realizes they uploaded something incorrectly.

Failed in Draft

Many things can go wrong while the video is processing. The file can be corrupted or the software doing the processing can go down. In the case the video can't be processed, we need to tell people what went wrong in a way that let's them know how to fix it. Some platforms remove the broken video while others leave it there so the user can manually remove it and have context as to what happened.

Failed After Posting

Most platforms are able to catch a bad file before it gets posted. However, in the rare situation that it's not caught, or that a user edits an already published post, adds a bad video to it, and hits save before the error can be caught, we need to display that something went wrong. Users are then allowed to go back and edit the post and remove the video.

Uh oh! Something went wrong with the video you tried to upload. Please try again!

Successfully Processed in a Draft

If the processing finishes while still in a drafted state, the video appears in the post similarly to how it will appear once posted. Most platforms allow for playback while still in this drafted state to make sure the user uploaded the correct video.

Successfully Posted

When the video is done processing and the post is successfully published the video appears in all it's glory on the page and allows for embedded playback.

Uploading to Draft

Once the video has been selected, it takes a few moments to upload onto the platform. Some common errors here include the file being too large or losing internet partway through. Most platforms allow for the video to be posted as soon as uploading is completed, and then process the video in a pre-published state.

How Does It Work At Mighty?

While many companies only have one kind of post or post editor (Twitter has a tweet, Slack has a message, etc.) Mighty Networks has a half dozen post types: Quick Posts, Articles, Events, Lessons, Comments, and Chats. Each has its own editor and its own flows around how/where it can be published. However, that expected flow that other platforms use can be recreated for all of the post types.

Create

A quick post provides a lightweight set of editing features, allowing for some to quickly share an image, poll, question, and now video.

The editor allows for a user to select the media icon and upload any file type. The server will then process it as an image, a downloadable file, or a playable video depending on user permissions.

Depending on the payment plan you're on you may not be able to play videos natively in the product, so a video uploaded on a free network would only appear as a file type.

Upload

Once the video is chosen from the platform's native file picker, it begins the upload process. If the user hits 'x' it will cancel the upload. While many platforms allow you to post while it's uploading, we could not support it on the backend and meet our deadlines, so we needed to disable posting while the video was uploading.

Processing

Once the upload is complete the video immediately starts processing. While I pushed to get us playback before processing, the developers had a requirement that the original video file could not sit on our servers because of how expensive the data is. To reduce our costs, we had to send it straight to processing and could not provide video playback immediately. We still hope to offer it in the near future.

While a video is processing, it can be posted so the user doesn't have to sit in the editor waiting for it to finish. While any video in the post is processing, the post will not go live to users.

We provided the ability to cancel posting while in the processing state incase the user realizes that they uploaded the wrong video or need to cancel.

As soon as the processing is successfully complete, the quick post is published. If processing fails, the post goes back to a draft state available in the users list of drafted posts.

Success

When the video successfully finishes processing the user can see the video and replace its cover image. For the initial launch of this feature we couldn't provide video playback while still in the editor, but are implementing it now.

Once posted, the video can be played from the quick post by anyone with permissions to see the post.

As soon as the post is live, we can't return it to an unpublished state, and so if a user uploads a new video while editing, we will show the "This video is processing" messaging in the published post after it is saved.

Failure

In the rare occasion that a video fails to process, we warn the user that something has gone wrong and allow them to replace the video. A quick post that fails to process after having been posted will be returned to this editing state. We wanted to show the broken state so if the video failed when the user was looking elsewhere they would have context as to what happened.

If a video fails the first time through the processing state, it is automatically sent back to being a draft. However, if someone edits a live post and adds a corrupted video, we cannot send it back to a drafted state.

Create

A quick post provides a lightweight set of editing features, allowing for some to quickly share an image, poll, question, and now video.

The editor allows for a user to select the media icon and upload any file type. The server will then process it as an image, a downloadable file, or a playable video depending on user permissions.

Depending on the payment plan you're on you may not be able to play videos natively in the product, so a video uploaded on a free network would only appear as a file type.

Upload

Once the video is chosen from the platform's native file picker, it begins the upload process. If the user hits 'x' it will cancel the upload. While many platforms allow you to post while it's uploading, we could not support it on the backend and meet our deadlines, so we needed to disable posting while the video was uploading.

Processing

Once the upload is complete the video immediately starts processing. While I pushed to get us playback before processing, the developers had a requirement that the original video file could not sit on our servers because of how expensive the data is. To reduce our costs, we had to send it straight to processing and could not provide video playback immediately. We still hope to offer it in the near future.

While a video is processing, it can be posted so the user doesn't have to sit in the editor waiting for it to finish. While any video in the post is processing, the post will not go live to users.

We provided the ability to cancel posting while in the processing state incase the user realizes that they uploaded the wrong video or need to cancel.

As soon as the processing is successfully complete, the quick post is published. If processing fails, the post goes back to a draft state available in the users list of drafted posts.

Success

When the video successfully finishes processing the user can see the video and replace its cover image. For the initial launch of this feature we couldn't provide video playback while still in the editor, but are implementing it now.

Once posted, the video can be played from the quick post by anyone with permissions to see the post.

As soon as the post is live, we can't return it to an unpublished state, and so if a user uploads a new video while editing, we will show the "This video is processing" messaging in the published post after it is saved.

Failure

In the rare occasion that a video fails to process, we warn the user that something has gone wrong and allow them to replace the video. A quick post that fails to process after having been posted will be returned to this editing state. We wanted to show the broken state so if the video failed when the user was looking elsewhere they would have context as to what happened.

If a video fails the first time through the processing state, it is automatically sent back to being a draft. However, if someone edits a live post and adds a corrupted video, we cannot send it back to a drafted state.

Create

A quick post provides a lightweight set of editing features, allowing for some to quickly share an image, poll, question, and now video.

The editor allows for a user to select the media icon and upload any file type. The server will then process it as an image, a downloadable file, or a playable video depending on user permissions.

Depending on the payment plan you're on you may not be able to play videos natively in the product, so a video uploaded on a free network would only appear as a file type.

Upload

Once the video is chosen from the platform's native file picker, it begins the upload process. If the user hits 'x' it will cancel the upload. While many platforms allow you to post while it's uploading, we could not support it on the backend and meet our deadlines, so we needed to disable posting while the video was uploading.

Processing

Once the upload is complete the video immediately starts processing. While I pushed to get us playback before processing, the developers had a requirement that the original video file could not sit on our servers because of how expensive the data is. To reduce our costs, we had to send it straight to processing and could not provide video playback immediately. We still hope to offer it in the near future.

While a video is processing, it can be posted so the user doesn't have to sit in the editor waiting for it to finish. While any video in the post is processing, the post will not go live to users.

We provided the ability to cancel posting while in the processing state incase the user realizes that they uploaded the wrong video or need to cancel.

As soon as the processing is successfully complete, the quick post is published. If processing fails, the post goes back to a draft state available in the users list of drafted posts.

Success

When the video successfully finishes processing the user can see the video and replace its cover image. For the initial launch of this feature we couldn't provide video playback while still in the editor, but are implementing it now.

Once posted, the video can be played from the quick post by anyone with permissions to see the post.

As soon as the post is live, we can't return it to an unpublished state, and so if a user uploads a new video while editing, we will show the "This video is processing" messaging in the published post after it is saved.

Failure

In the rare occasion that a video fails to process, we warn the user that something has gone wrong and allow them to replace the video. A quick post that fails to process after having been posted will be returned to this editing state. We wanted to show the broken state so if the video failed when the user was looking elsewhere they would have context as to what happened.

If a video fails the first time through the processing state, it is automatically sent back to being a draft. However, if someone edits a live post and adds a corrupted video, we cannot send it back to a drafted state.

This feature has been released, but this tab is under construction!

Check back later to see what uploading a video to an article looks like.

This feature has been released, but this tab is under construction!

Check back later to see what uploading a video to a lesson looks like.

Video upload is coming to Events soon!

Check back after it's released to see what it looks like.

Video upload is coming to Comments soon!

Check back after it's released to see what it looks like.

Video upload is coming to Chat soon!

Check back after it's released to see what it looks like.

Managing UPloads

Hosting videos is expensive. We could not afford to make it free for all networks and instead have to charge people for how much they use. This means they need control over how much people within their network can upload. When Hosts hit their data limit, they need to be able to manage that storage by either buying more or deleting some of what's there.

The ability to manage the media you've uploaded is actively in development!

Check back after it's released to see how it works.

Results

To see what results this would have on engagement, we tracked the number of Articles created with video from Hosts. We also released this with the MVP of Live Streaming and Group Chat (which you can check out here!).

Over 500 Videos Added To Articles In 48 hours

Considering how long it takes to film and edit a video, the fact that Hosts were able to upload 500 videos in the first 48 hours of the feature being available was a big win.

6,500+ Videos Shared In 1 Month

To start, only Hosts could upload videos. This many videos getting uploaded was a huge step forward in getting members engaged.

Significantly Sped Up Adding Videos

It now takes less than 30 seconds of user focus to post a video. The processing time depends on the video size, but the user no longer has to spend ages on other platforms and can quickly get back to interacting with their community.

Uploading Video

Lead Product Designer

How do we keep members engaged in small communities?

Video

Challenges

What's expected

Prompt to Upload

Processing Draft

Processing When Posted

Failed in Draft

Failed After Posting

Successfully Processed in a Draft

Successfully Posted

Uploading to Draft

How Does It Work At Mighty?

Create

Upload

Processing

Success

Failure

Create

Upload

Processing

Success

Failure

Create

Upload

Processing

Success

Failure

Managing UPloads

Results

Over 500 Videos Added To Articles In 48 hours

6,500+ Videos Shared In 1 Month

Significantly Sped Up Adding Videos