Skip to main content
UI Coach Logo
Back to challenges
Intermediate

Company and Invention Timeline

Design an editorial history experience that connects one influential invention with the people and companies that shaped it.

Responsive web

The brief

Understand the problem

Background

Popular histories often reduce an invention to one heroic founder and omit parallel work, employees, public funding, or social consequences. A well-sourced timeline can surface relationships without losing readability.

User context

Nora is researching the development of the personal computer for a college essay. She needs a coherent chronology and sources she can evaluate independently.

Product problem

Readers need to move between events, organizations, people, and evidence without mistaking a simplified narrative for the complete history.

Objective

Create a topic introduction, filterable timeline, event detail, and source trail for one invention history.

What to design

Define the experience

Required experience

  • Understand the topic's scope and editorial approach
  • Explore events by theme, organization, and period
  • Open an event to see participants and consequences
  • Trace claims to primary and scholarly sources

Screens and states

  • Topic overview
  • Interactive timeline
  • Event detail
  • Source library

Core user flow

Follow the critical path

  1. 01

    Nora reads how the timeline defines personal computing

  2. 02

    She filters for interface and manufacturing milestones

  3. 03

    She opens an event that credits several teams and earlier work

  4. 04

    She saves two sources with citation details

Product rules

Requirements and constraints

Requirements

  • Distinguish documented fact, interpretation, and disputed claim
  • Connect events to multiple people and institutions
  • Offer list and keyboard alternatives to the visual timeline
  • Provide complete source metadata and editorial corrections

Constraints

  • The experience should cover one invention deeply
  • Company marketing material cannot be the sole source for major claims
  • Images require rights and captions

Reality check

States worth considering

Sources disagree on a date
A person's contribution is poorly documented
The timeline becomes dense on small screens
A cited source becomes unavailable

Finish line

What to deliver

  • Four responsive editorial screens with a sourced disputed event

Optional direction

Visual resources

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

Color palette
#1B1A1A
#E9C5B7
#716561
#8B8C8A
#8C848C
Font pairing
PT SansCabin

PT Sans & Cabin

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

Icons
Illustrations