Skip to main content
UI Coach Logo
Back to challenges
Intermediate

Accessible Paper to Text Capture

Design a document capture app that turns printed text into editable, readable content while preserving uncertainty and page structure.

Mobile, Responsive web

The brief

Understand the problem

Background

Printed letters, forms, and handouts are difficult to search, enlarge, or read aloud. Text recognition helps, but skewed pages, columns, handwriting, and poor contrast can alter important content.

User context

George has low vision and receives a printed appointment letter. He wants to hear it read aloud, enlarge the date, and save the clinic number without relying on a perfect scan.

Product problem

The product must guide capture, retain a reference image, and make recognition errors visible before the text is copied or acted upon.

Objective

Create capture, recognition review, accessible reading, and export for a printed document.

What to design

Define the experience

Required experience

  • Camera alignment and capture
  • Recognized text review
  • Reading controls
  • Export or copy

Screens and states

  • Camera guidance
  • Processing and page review
  • Accessible reader
  • Uncertain text correction

Core user flow

Follow the critical path

  1. 01

    George aligns the appointment letter

  2. 02

    The app detects a shadow and requests another photo

  3. 03

    Recognized text opens in a large readable view

  4. 04

    He checks the date against the image and saves it to his calendar

Product rules

Requirements and constraints

Requirements

  • Keep the source image beside extracted text
  • Mark low-confidence words and numbers
  • Support text size, spacing, contrast, and read aloud
  • Preserve headings and basic reading order
  • Allow correction before export

Constraints

  • Processing may occur offline
  • The document may contain private information
  • Handwriting support is limited

Reality check

States worth considering

Multi-column reading order is wrong
A date is uncertain
A page is cut off
The document uses an unsupported language
Read aloud is unavailable

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.

Recognized appointment

  • Westfield Clinic
  • Tuesday 21 October at 10:30
  • Bring photo identification
  • Phone: 03 5550 1842, number confidence 72 percent

Finish line

What to deliver

  • Four mobile screens
  • A detailed uncertain-text correction state

If you want more

Optional extensions

Add multi-page document capture
Design a form-field extraction mode

Optional direction

Visual resources

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

Color palette
#A9A4CE
#05623B
#1F1109
#79829C
#6CBCB4
Font pairing
Roboto SlabRoboto

Roboto Slab & Roboto

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

Icons
Illustrations

Theory to review

UX principles for this brief

Use these as decision lenses, then validate the design with the people and context in the brief.