modula

Two ways to build interactive content.

Galleries, timelines, exercises, maps, flipcards. Over 90 accessible components, to integrate into your stack with the CDK, or let your AI compose the finished content with Connect.

timeline.html

<dna-timeline factor="days" timezone="utc">
  <dna-timeline-item value="1969-07-17T13:32:00Z">
    Apollo 11 takes off from planet Earth.
  </dna-timeline-item>
  <dna-timeline-item value="1969-07-17T16:22:00Z">
    Lunar trajectory entry begins.
  </dna-timeline-item>
  <dna-timeline-item value="1969-07-19T17:21:00Z">
    Apollo 11 passes behind the moon.
  </dna-timeline-item>
  <dna-timeline-item value="1969-07-20T17:44:00Z">
    Separation between Eagle and Columbia.
  </dna-timeline-item>
  <dna-timeline-item value="1969-07-20T20:17:00Z">
    Landing on the Moon.
  </dna-timeline-item>
  <dna-timeline-item value="1969-07-20T23:43:00Z/1969-07-21T02:39:00Z">
    Moonwalk preparation.
  </dna-timeline-item>
  <dna-timeline-item value="1969-07-21T02:56:00Z">
    First Armstrong's Moonstep.
  </dna-timeline-item>
  <dna-timeline-item value="1969-07-21T17:54:00Z">
    Astronauts take off from the moon to join Collins.
  </dna-timeline-item>
  <dna-timeline-item value="1969-07-21T21:24:00Z">
    Eagle performs rendezvous with Columbia.
  </dna-timeline-item>
  <dna-timeline-item value="1969-07-24T21:16:50Z">
    Columbia's Ditching.
  </dna-timeline-item>
</dna-timeline>

Preview

Apollo 11 takes off from planet Earth.

Lunar trajectory entry begins.

Apollo 11 passes behind the moon.

Separation between Eagle and Columbia.

Landing on the Moon.

Moonwalk preparation.

First Armstrong's Moonstep.

Astronauts take off from the moon to join Collins.

Eagle performs rendezvous with Columbia.

Columbia's Ditching.

Editor

Self-hosted · for developers

CDK

The Component Development Kit can be hosted in your own infrastructure: Modula’s Web Component library and its AI-assisted collaborative editor work in any stack — React, Vue, Svelte, or plain HTML.

Explore CDK Discover the Editor

SaaS · for content teams

Connect

Connect Claude, ChatGPT, or Gemini to Modula through a managed MCP server: your AI discovers the components and assembles finished interactive content for you — lessons, presentations, articles — on demand.

Discover Connect See use cases

What you can ship.

Real interactive experiences built with Modula — from compliance training to data journalism. New examples published regularly.

Preview

Corporate training

Data Privacy Compliance Course

Twelve interactive units with explainer video, scenario exercises, and a final quiz. Exported to SCORM and loaded into a corporate LMS.

Preview

Classroom lesson

The Etruscans · Lesson for Grade 7

A history lesson built in the free Playground — timeline, image gallery, and multi-choice quiz. Projected from the classroom display.

Preview

Travel narrative

Adriatic Sailing Journey

Month-long sailing trip retold as a scroll-driven map narrative with GPS track, photo stops, and per-stop journal entries.

Preview

Editorial

Climate Migration · Long-form

Long-form data narrative on climate displacement: IDMC and World Bank figures as a bar chart, before/after satellite comparisons, and an interactive hotspot map, in a neutral editorial theme.

Preview

Textbook supplement

Chemistry Chapter Appendix

Supplementary appendix on chemical bonding for a school chemistry textbook. Annotated molecular diagrams with tappable hotspots, a side-by-side tour of four crystal structures, and flip-card concept checks.

Preview

Interactive quiz

The Puzzler

A weekly general-knowledge quiz: ten rounds of mixed trivia, from world capitals and noble gases to a closing crossword — all scored in one go.

Preview

Data story

Ocean Temperature Anomalies

Scroll-driven explainer walking readers through ocean surface temperature anomalies from 1950 to 2023, one chart at a time.

Preview

Tutorial

SaaS Product Onboarding

Interactive getting-started guide: annotated product screens with hotspot tours, short walkthrough recordings, and a step-by-step progress tracker.

Preview

Fiction

A Short Story · Scroll-driven

Independent writer’s short story published as a scroll-driven piece with illustrations that change with each scene.

Preview

Compliance training

Workplace Safety · Forklifts

Four-unit training on forklift safety procedures. Per-unit assessment, end-of-course summary, SCORM-exportable.

Who’s behind Modula

Built by Chialab.

We’re a design studio in Bologna: we design and build interactive content for publishing, culture, and education, one project at a time, refining each component until it’s accessible, solid, and made to last. Modula is the culmination of these years of care and craft.

More about Chialab

Get in touch

CDK

Connect

What you can ship.

Data Privacy Compliance Course

The Etruscans · Lesson for Grade 7

Adriatic Sailing Journey

Climate Migration · Long-form

Chemistry Chapter Appendix

The Puzzler

Ocean Temperature Anomalies

SaaS Product Onboarding

A Short Story · Scroll-driven

Workplace Safety · Forklifts

Built by Chialab.

Questions about features, pricing, or workflows?