Skip to content
Marlow
Work

Fieldnotes

A desktop notebook for researchers that keeps quotes, sources and tags in one place.

Client
Fieldnotes Labs
Role
Design engineer
Year
2025
Team
Founder, 3 engineers
Fieldnotes app window with a sidebar of notebooks and an open note
Fig. 1Fieldnotes app window with a sidebar of notebooks and an open note

  • 11k

    Researchers in the public beta

  • 62%

    Still active after 8 weeks

  • 140

    Components shipped in React

Timeline

8 months, start to launch

  1. Prototypes2 mo
  2. Design and build6 mo
  3. Private beta3 mo

The problem

Researchers kept interview quotes in one tool, sources in another and their synthesis in a slide deck. Every time they wrote up a finding they lost the link back to the person who said it.

Approach

A quote in Fieldnotes is an object, not text. It carries its source, timestamp and tags wherever you paste it, so a finding in a report still opens the minute of the interview it came from.

I prototyped the editor in code from week two. Dragging a quote between notes, and what happens to its source when you edit it, were questions a static mock could not answer.

Editor with a quote block showing its source and timestamp
Fig. 2Quotes keep their source, even three documents later.
  1. Findings are written as sentences, so a synthesis reads like a report instead of a wall of stickies.
  2. Every quote keeps its speaker and timestamp, even after it is pasted into another document.

Details

The sidebar collapses to icons at narrow widths instead of disappearing. Search opens on the slash key and filters by tag, person or date as you type.

Search panel filtering notes by tag and person
Fig. 3Search by tag, person or date.
  1. Type a tag or a name and it turns into a filter. There is no filter panel.
  2. Enter opens the quote inside its interview, at the minute it was said.
  3. Findings and raw notes share one index, so a finding links back to every quote behind it.

Outcome

Fieldnotes left beta in June 2025. The component library I built is now the team's design system, with docs written next to the code.

“Most designers hand you a picture of the editor. Ines handed us the editor. We shipped her prototype’s drag interaction almost line for line.”
Tom AchterbergFounder, Fieldnotes

Credits

Design engineering
Ines Calder
Engineering
Theo Brandt, Ama Mensah, Lukas Weber
Founder
Hanna Lind

Next project

Linea

A wayfinding system for a 46-station tram network, from signs to the departure app.

Network diagram of four tram lines with interchange stations