Skip to main content
UI Coach Logo
Intermediate

Recover a Failed Video Upload

Design an upload and processing flow that preserves progress, explains failures, and gives creators a reliable path to publication.

Desktop web, Responsive web1 to 2 hours

The brief

Understand the problem

Background

Large video uploads can fail during transfer, verification, transcoding, or policy checks. A single progress bar hides which stage failed and whether retrying will duplicate work or discard metadata.

User context

Andre is uploading a 9 GB workshop recording from an unreliable connection. The transfer completes after two resumptions, but the high-resolution rendition fails during processing.

Product problem

Creators need confidence that their file and publishing details are safe, plus precise recovery actions for failures at different stages.

Objective

Create one upload journey from file validation through recoverable processing failure and successful publish readiness.

What to design

Define the experience

Required experience

  • Validate a file and confirm upload requirements
  • Monitor transfer separately from server processing
  • Resume after a connection interruption
  • Recover one failed rendition without restarting completed work

Screens and states

  • Upload setup
  • Transfer progress
  • Processing detail
  • Failure recovery

Core user flow

Follow the critical path

  1. 01

    Andre selects the workshop file and resolves a missing title before transfer

  2. 02

    The upload pauses when connectivity drops and resumes from the last verified part

  3. 03

    Processing completes for standard resolution but fails for high resolution

  4. 04

    Andre reviews the technical reason and retries only the failed rendition

  5. 05

    The video becomes ready for review with all metadata intact

Product rules

Requirements and constraints

Requirements

  • Label transfer, integrity check, processing, review, and publish readiness as separate stages
  • Save title, description, visibility, and caption settings independently of the media transfer
  • Show resumable progress based on verified uploaded parts
  • Offer recovery actions specific to the failed stage
  • Warn before replacing a file when existing captions or edits may no longer align

Constraints

  • Browser sessions may close before a large transfer finishes
  • Processing duration can only be estimated as a range
  • Only one source file can be active for this draft at a time

Reality check

States worth considering

The local file changes before upload resumes
Storage quota is reached after transfer begins
The source passes upload validation but contains an unsupported stream
A retry fails after some renditions are already available

Ready-to-use content

Mock data

Use this content to test hierarchy and realistic data states. You can expand it when the concept needs more depth.

File details

  • workshop-final.mp4
  • 9.1 GB
  • 3840 x 2160
  • 02:14:38 duration

Processing results

  • 360p ready
  • 720p ready
  • 1080p ready
  • 2160p failed: source frame timeout

Finish line

What to deliver

  • Four responsive screens showing interrupted transfer, partial processing failure, and recovery

Optional direction

Visual resources

Use these as a starting constraint if you want one. They are not part of the required solution.

Font pairing
Old Standard TTQuestrial

Old Standard TT & Questrial

Clear interface writing gives people the confidence to understand what changed and decide what to do next.

Icons
Illustrations

Keep practicing

Intermediate
Creator tools

Publish a Video After Processing

Design an upload workflow that helps a creator prepare metadata, understand processing, and publish a video with the right visibility.

Desktop web2 to 4 hours
Interaction DesignError Handling
Intermediate
Creator tools

Stand-Up Comedy Video Channel

Design a publishing and earnings experience for comedians sharing original performance clips.

Responsive web2 to 4 hours
Content DesignInformation Hierarchy
Intermediate
Creator tools

Distraction Free Writing Session

Design a focused writing mode that protects a chosen draft, blocks selected distractions, and recovers safely after interruption.

Desktop web2 to 4 hours
Interaction DesignError Handling
Advanced
Creator tools

Respond to a Creator Copyright Claim

Design a calm response flow that helps a creator understand a copyright claim, preserve evidence, and choose an available resolution path.

Desktop web2 to 4 hours
Trust and SafetyContent Design
Intermediate
Creator tools

Add Chapters to a Podcast Episode

Design a chapter editor that helps a producer mark, name, validate, and publish navigable sections for one podcast episode.

Desktop web1 to 2 hours
Interaction DesignInformation Hierarchy
Intermediate
Creator tools

Release a Novel as a Serial

Design a publishing workspace for scheduling chapters, sharing previews, and keeping readers oriented across a continuing story.

Responsive web2 to 4 hours
Information ArchitectureContent Design