Examples — Semiotic

Home · Getting Started · Charts · Features · Playground

This page requires JavaScript for interactive chart demos.

AI / Machine-readable docs: llms.txt · llms-full.txt · CLAUDE.md · schema.json · API Reference · Examples

View on GitHub · npx semiotic-ai for CLI access

Machine-readable page content

Canonical: https://semiotic.nteract.io/examples

Semiotic in practice

Examples

Each example starts with a visual question and shows how data, layout, annotation, and interaction work together to answer it.

Frame

Topic

39 examples

Six views · one evidence chain

The Living Ledger

Trace a coral threshold, a forest disturbance, and a modeled pollination gap backward to evidence and forward to people.

Deterministic replayEvidence lineageSentenceFilterPhysics pipeline

Portable analytical artifacts · five chart rooms

The Insight Forge

Investigate a packaging failure across five chart rooms. Evidence you accept becomes a portable artifact that can filter and annotate the next view.

Portable artifactsDeterministic recipesAudited lineage

Five Stream Frames · analytical adventure

Analyst Adventure: The Case of the Vanishing Visionary

Investigate a missing CEO across temporal, categorical, geographic, network, and physics rooms where reading each chart determines the story.

Deterministic storyKeyboard playableAgent-readable

Nine linked linguistic views · natural-language controls

The Sentence Is Not the Words

Follow one sentence through grammar, ambiguity, meaning, rhetoric, corpus paths, phrase relationships, and textual variants without losing the words you selected.

SentenceFilterShared selectionAuthored fixturesAccessible structure

Late events, closing windows

Watermarks, Made Physical

Events arrive out of order. A watermark decides when a window can close; late arrivals roll into a visible gutter.

EventDropChartPhysicsAgent-readable

From first use to real contribution

The Stakeholder Journey

Same people, two community setups: after habit forms, invitation either opens a path to commitment or leaves usage private.

StreamPhysicsFrameStage ledgerLive geometry

Review queues under AI throughput

Merge Pressure

Pull requests share finite human review, recirculate through CI, and only merged work counts toward shipping the feature.

GauntletChartShared capacityWeighted groups

Housing plan vs cumulative drag

Not in MY Backyard

A housing approval simulator: a plan enters with lift and drag, loses features at civic gates, gains burden, and may get approved without becoming housing.

GauntletChartbodyForcesCompound glyphs

Point controls + radial weather

Brushable Weather Rings

Align daily weather around annual rings, brush a seasonal interval, and inspect the selected days on a straight timeline.

Custom chartAccessible navigation

Four custom frames · ISOTYPE

Lake Travis, in Signs

A lake-level and weather dashboard rebuilt with repeated pictograms across streaming XY, ordinal, network, and geographic custom layouts.

Custom chartLocalAccessible navigation

TemporalHistogram · ISOTYPE · source audit

Nathan's Hot Dog Contest, Four Ways

Read Nathan's winning counts four ways, then use the pace view to see how contest-duration changes alter the historical comparison.

TemporalHistogramISOTYPESource-audited

Altitude sections · evidence ledger

The Buildings Behind AI

Count the physical scale of AI infrastructure through relief maps and repeated units for power, water, capacity, and compute. Every claim keeps its denominator and source.

Custom chartLocalAgent-readable

Fuel mix · demand vs forecast · spare capacity

The Grid Is the Real AI Infrastructure

What is generating, whether demand beat the forecast, and how little spare capacity is left—for the grid regions under AI data centers. Twin of The Buildings Behind AI.

DifferenceChartstyleRulesBigNumberAgent-readable

Isometric creative-industry terrain

Creative Gravity of America

Metro creative industries become contour shelves on a stacked isometric United States: screen, sound, games, design, and research as height—not topography.

GeoCustomChartContoursIsometricCustom layout

TokenLayer · task-aware ISOTYPE

Sometimes it's better to be discrete

Estimate a bus-waiting probability, reveal the count, and compare how density curves, quantile dots, hypothetical outcomes, and commuter icons support different tasks.

TokenLayerQuantile dotplotHOPsDesign critic

Explorable MAUP laboratory

Where You Draw the Line

Move one border across an unchanged field, then watch the aggregate answer move through a 1D transect, a constructed city, and a 2D-plus-time reporting stack.

Direct manipulationContinuous fieldSensitivity analysis

Custom ordinal timeline

All the Wars of the United States

A layered timeline of conflicts, geopolitical spheres, historical periods, concurrency, and the comparatively rare years of peace.

Custom chartLocalAccessible navigation

Automatic chronological network

A Genealogy of Cubism and Abstract Art

A constraint-laid influence graph styled after Alfred H. Barr Jr.'s iconic 1936 Cubism and Abstract Art cover.

Custom chartLocalAccessible navigation

Custom isometric GeoFrame

Paris, Isometric City of Lights

Five-by-five strategy-game views of Paris, Austin, San Francisco, and Tokyo, populated from DBpedia landmarks with resilient local snapshots.

Custom chartLocalAccessible navigation

Custom radial network

The Wheel of Urines

A medieval uroscopy diagnostic redrawn as a node-link diagram in a ring — twenty named urine colors, each spoked to the stage of digestion it signifies.

Custom recipeLocalIntent-awareAccessible navigationAgent-readable

Custom botanical hierarchy

The New York & Erie Railroad

McCallum and Henshaw's landmark 1855 organization diagram rebuilt as computed railroad trunks, workforce boughs, and navigable roles.

Custom chartLocalAccessible navigation

Five coordinated realtime swarms

Wikipedia, as it happens

A live, filterable view of English Wikipedia edits with actor classification, signed change encodings, aggregation, and revision-level drilldown.

Custom chartLocalIntent-aware

ZIP-driven civic data + networks

Your Local Government Explorer

Resolve any postal place into its county's federal disaster record and spending, live 311 service requests, LOCUS municipal law, and a network of bodies, sponsors, meetings, and active legislation.

Real chokepoint data, four-frame replay

The Long Way Around

Replay three periods of IMF PortWatch traffic: a quiet spring, the Ever Given blockage, and the Red Sea detour. Four linked views show where routes and transit times diverged.

Realtime reader telemetry

The Scroll You're Telling

Read a short history of data journalism while the page plots your scroll position, velocity, and dwell time alongside the essay.

Custom chartLocalIntent-aware

Twelve personas · twelve chart grammars

The 12 Kinds of Data Visualization People

An expanded remake of the Nightingale essay: Excel brute forcers, Tableau zen masters, Accurat-style studios, news orgs, scientists, industry oracles, fun freelancers, procedural artists, finance annotators, DevOps terminal wizards, workshop nomads, and academic dissectors each get a chart body.

Custom chartSankeyCandlestickLocal

Distant reading · literary signals

Can You Know a Book Better Without Reading It?

A rich remake of the Nightingale essay as an interactive distant-reading room: chapter signal fields, phase summaries, corpus fingerprints, and narrative-flow Sankeys for four public-domain novels.

LineChartBarChartSankeyLocal

Funnel analysis · Pop Art flows

We Live in a World of Funnels

An interactive remake of the funnel essay: classic conversion funnels, A/B testing, branching Sankey paths, and temporal path motifs argue through precision and accuracy.

FunnelChartSankeyProcessSankey

The intelligence layer, end to end

What the Machine Sees

Watch Semiotic read real World Bank data with no model call: profile it, rank chart capabilities, then describe, audit, and lay out a navigable structure for the chart it chooses.

Custom recipePortableIntent-awareScene-auditedAccessible navigationAgent-readable

Interactive architecture map

The Living System of Semiotic

Trace each example from its visible charts and settings through the four frame models, data inputs, and the rhizomatic implementation beneath them.

Network + GeoCustomChart metaphor

The Octopus: It has its tentacles in everything

A history of the octopus as an information-visualization metaphor: moral networks, imperial octopus maps, and a final Semiotic-as-octopus frame diagram.

Custom chartGeoCustomChartNetworkCustomChart

Difference chart + uncertainty band

Point Climate Anomaly

A polished climate readout comparing this year's daily temperature with an adjusted historical mean and the 5th-95th percentile range.

Five chapters · perception → Semiotic

The Gestalt of Data Visualization

A chapterized remake of the 2015 Gestalt Principles essays — similarity, common fate, proximity, figure/ground, continuity — each demonstrated on a live Semiotic chart, in a Bauhaus 'perception lab' look.

16 charts · context → sparkline

Semiotic Standard: Chart Deployment Codes

An Alien-inspired field standard for when to deploy 16 Semiotic charts across XY, ordinal, network, geographic, and physics frames—then redeploy the same charts as sparklines.

Context modeSparkline modeReal World Bank data

Mobile-first review · Semiotic demos

Mobile Data Visualization That Works

A research-backed field guide for phone-sized visualization: density budgets, small multiples, touch-first controls, constraint breakpoints, and source-led design choices built as live Semiotic demos.

ResponsiveResearch-backedTouch-first

Eight chapters + an interactive toy

Drawing Networks

Work through eight ways to draw and inspect a network, from arc diagrams and matrices to communities, Sankey, and chord. The final playground adds pathfinding, centrality, and ego-network tools.

Retro cartography · real geography

Map of the Oregon Trail

The 1985 Oregon Trail end-game map over real Washington/Oregon/Idaho geography—gray land, CGA-blue rivers, caret mountains, forts, and a wagon from START to FINISH.

Custom chartLocalAccessible navigation

Spin the globe to filter · M6+ 2021–2025

Earthquakes

An orthographic ProportionalSymbolMap drives a small dashboard: drag-rotate the globe and the KPI tiles, magnitude bars, regional ranks, and quarterly line recount only the events facing you.

ProportionalSymbolMapdragRotateLinked summary

Rough hachure · Ausfeld 1840

Europa nach den lebenden Sprachen

A hand-tinted remake of Karl von Ausfeld's living-languages plate of Europe. Exact Natural Earth geoareas keep hit testing and accessibility; createRoughRenderMode paints only the ink.

semiotic/roughStreamGeoFrameHistorical plate