TEMPLATE 001 · AN EDITORIAL CANVAS

A quieter canvas.A clearer story.

A thoughtful home for research, images, and everything in between. Give your ideas the space, rhythm, and attention they deserve.

Explore the possibilities See a real project

Discover the detailsSCROLL TO DISCOVER

FORM / FUNCTIONN° 001

DESIGNED WITH INTENTIONAn adaptable, editorial template for research projects, visual essays, and work worth sharing.

01A considered visual language

∞Ways to compose your content

YouA story waiting to be told

01 / THE APPROACH

Let your ideas breathe.

A good page creates room for the things that matter.

A quiet background. A confident headline. Details that reward a closer look. Forma brings an editorial sensibility to the web, giving both short introductions and longer stories a natural rhythm.

Start with your story, then compose it your way. Combine photographs, diagrams, rich tables, text, and references. Every element belongs to the same visual language, while each section has room to feel different.

02 / VISUAL COMPOSITION

One collection. Many points of view.

Try a different column count or show fewer images. Select an image to take a closer look.

Coral concentric circles on a warm white background — 01Study 01 · Rhythm in repetition.

Sage green geometric shapes and an amber sun — 02Study 02 · Finding a little balance.

Winding terracotta contour lines — 03Study 03 · A different kind of landscape.

Overlapping geometric planes in pale blue and dark green — 04Study 04 · A change in perspective.

03 / A CLOSER LOOK

A little space for the details.

A full-width lead image followed by a pair of supporting views. Each image keeps its own proportions.

Terracotta landscape of contour lines — 01The opening view · A full-width image.

Concentric coral study — 02A companion detail · Natural proportions.

Sage and amber geometric composition — 03Another perspective · A supporting image.

04 / CLEAR COMPARISONS

Bring the details into focus.

Grouped headers, aligned numbers, highlighted rows, and room for a useful footnote. Wide tables scroll naturally on smaller screens.

EXAMPLE COMPARISON — ILLUSTRATIVE DATA
Approach	Quality		Efficiency
Approach	Accuracy ↑	Recall ↑	Latency ↓	Memory ↓
Baseline	82.4	79.1	142 ms	4.8 GB
Variant A	86.2	84.3	128 ms	4.2 GB
Proposed	91.7	89.5	106 ms	3.6 GB
Evaluation notes	All values are fictional and demonstrate table formatting only.

Illustrative sample data only. ↑ Higher is better. ↓ Lower is better.

A table should make a comparison easier to read. Use merged cells to group related columns, align measurements to the right, and give the most important row a subtle accent. Captions and footnotes keep the necessary context close at hand.

05 / IN SEQUENCE

A story, one frame at a time.

Scroll or use the arrows to move through a collection. Open any frame for a full-size view.

01From the Forma collection · Study 1

02From the Forma collection · Study 2

03From the Forma collection · Study 3

04From the Forma collection · Study 4

Explore the details

06 / DATA IN MOTION

Let the data tell its story.

Lines, grouped bars and scatter plots. Explore a point, compare series, or open the underlying table. Illustrative sample data.

Bring your own SVG

SVG controls the artwork. The template binds only point inspection, legend visibility, and enlargement.

A little progress, every season

View data table

A little progress, every season — data
Season	Study A	Study B
Spring	42	35
Summer	65	58
Autumn	72	79
Winter	89	84

Room for comparison

View data table

Room for comparison — data
Discipline	Plan	Actual
Research	24	28
Design	32	30
Build	48	42

Patterns in the details

View data table

Patterns in the details — data
Iterations	Observations
1	30
2	42
4	57
7	71
10	88

Ways to explore

Illustrative sample data.

View data table

Ways to explore — data
Category	Tasks	Share (%)
Read	32	32.0
Compare	24	24.0
Create	44	44.0

A balanced collection

Illustrative sample data.

View data table

A balanced collection — data
Category	Tasks	Share (%)
Words	40	40.0
Images	35	35.0
Data	25	25.0

07 / A FLEXIBLE COLLECTION

Choose the pieces. Make them yours.

Compose a project page, a service introduction, or a practical guide with the same reusable pieces.

01 / DISCOVER

A place for ideas

Introduce a project, a service, or a collection with a clear title and a short description.

Explore layouts ↗

02 / COMPARE

Details that matter

Choose only the components your story needs. Each card can carry an image and an optional link.

Explore data ↗

03 / SHARE

Ready for your world

All content lives in your own configuration. The template takes care of layout and interaction.

View the collection ↗

START WITH A QUESTION
Define the idea
Describe who the page is for and what they should learn.
GIVE IT STRUCTURE
Choose the components
Combine text, media, cards and data in the order that tells your story.
MAKE IT YOURS
Refine and share
Use your own words, images and details, then preview on screens of different sizes.

Overview

Details

Each tab accepts the same content blocks as a section. Mix a short explanation with a table, chart, or gallery.

Accessibility

Use the arrow keys to switch tabs, or Home and End to jump to the first and last. Without JavaScript, every panel is displayed in order.

Can I choose which components appear?

Yes. Add, remove, reorder, and repeat blocks in your content configuration. Nothing here depends on a particular project.

Can a panel contain more than text?

Panels accept other content blocks, so you can place a chart, table, or card collection inside them.

Does the content work without JavaScript?

Text, images, charts, tables, and native disclosure panels remain readable. Tabs show all their panels when JavaScript is disabled.

Give each idea the form and space it needs.

FormaSample editorial statement

08 / THE FINISHING TOUCHES

The little things belong, too.

A final note, an acknowledgement, a useful reference. Thoughtful typography and generous spacing keep longer passages readable without losing the thread of the page. Motion follows your pace: sections arrive gently, images open on request, and navigation stays close by.

01 / LIVE PROJECT

V2PE, in Forma

See how this template adapts to a complete research project.

02 / COLLECTION

Back to the collection

Find a starting point for your next idea.

A FRAME FOR YOUR NEXT IDEA

Make something worth a closer look.

Explore the V2PE example

A quieter canvas.A clearer story.

Let your ideas breathe.

One collection. Many points of view.

A little space for the details.

Bring the details into focus.

A story, one frame at a time.

Let the data tell its story.

Bring your own SVG

A little progress, every season

Room for comparison

Patterns in the details

Ways to explore

A balanced collection

Choose the pieces. Make them yours.

A place for ideas

Details that matter

Ready for your world

Define the idea

Choose the components

Refine and share

Overview

Details

Accessibility

The little things belong, too.

V2PE, in Forma

Back to the collection

Make something worth a closer look.