Ricetta numero 168

Ricettario · Capitolo 12 · Libri di testo

Unità di un quaderno operativo per la primaria

Un’unità di scienze di quattro pagine con undici attività :::exercise nel Markdown, stampate da un solo stile: cerchi numerati, banca di parole, punti da unire.

In questa pagina
Output
Canvas · PDF
Livello
Intermedio
Postext
Provata con Postext 1.59.0
Richiede ≥ 1.59.0 · postext-pdf ≥ 1.59.0
Licenza
Aggiornata il 24 ott 2026
Codice MIT · Testo CC BY 4.0

p. 1 di 4

Leggi questa ricetta come testo →
  • Esempio in inglese: non c’è ancora un’edizione italiana
  • Formato 210 × 297 mm
  • 1 colonna
  • Atkinson Hyperlegible Next 12/17
  • Grandstander
  • 4 pagine
  • Livello
  • Postext 1.59.0
  • Impaginato in 16 ms
  • 182 righe di codice

In breve

Un quaderno operativo per bambini di otto anni sugli animali vertebrati. Le domande e le loro risposte sono scritte nel testo; uno stile decide come appare ogni attività sulla pagina.

Che cosa comporrai

L’unità 5 di un quaderno operativo di scienze per la classe terza, in A4: Animals with backbones, gli animali vertebrati. L’apertura mette l’unità in una fascia verde sopra il dipinto di uno stagno; seguono undici attività, ciascuna con il numero in un cerchio verde e un’icona a forma di matita, di fumetto o di coppia. Una banca di parole in un riquadro colorato dal bordo tratteggiato, frasi da segnare con T o F, animali da collegare con una linea al loro gruppo, parole da cerchiare in una frase e in un breve testo, le fasi della rana da numerare, un crucipuzzle, animali da classificare, una domanda aperta sulle righe e un’altra sui quadretti. Un’edizione spagnola stampa la stessa unità come la compongono le scuole di quel paese, con V e F e une con flechas. La illustrano tre dipinti generati con un modello di diffusione.

Questa ricetta risponde a

  • Come compongo una pagina di eserciziario: numeri nei cerchi, banca di parole, vero o falso, collega?
  • Come metto le icone di attività (scrivi, parla, in coppia) accanto al numero di un esercizio?
  • Come costruisco una pagina di esercizi: righe da compilare, riquadri per le risposte, banche di parole, liste di controllo?

La risposta breve

script.js · righe 34–61nel codice completo
// The Markdown says what each activity asks (:::exercise, [[answers]], - A -> B, - [x]);
// this style says how a Spanish workbook prints it: the number in a disc of the unit
// colour, the instruction in bold, blanks on a line, V/F boxes at the line's end, dots to
// join, the bank in a tinted box, squared paper for writing and the activity icons.
const icon = (id, alt) => ({ resourceId: `icon-${id}`, alt, size: 1.05 });
const actividad = {
  id: 'actividad',
  number: { shape: 'disc', background: col('unit'), color: col('paper'),
    fontFamily: DISPLAY, fontSize: em(1.05), fontWeight: 800 },
  instruction: { bold: true, color: col('ink') },
  options: { marker: 'circle' },
  blank: { look: 'line', color: col('ink'), weight: pt(0.75), extra: em(2) },
  trueFalse: { look: 'boxes' }, // V F in Spanish, T F in English: the language's own words
  match: { look: 'dots', gap: em(7), dotSize: em(0.42), color: col('unit') },
  bank: { box: 'banco', order: 'alpha', separator: ' ' },
  area: { kind: 'lines', spacing: mm(9), color: col('rule'), weight: pt(0.6) },
  grid: { cell: mm(9.5), fontFamily: DISPLAY, fontSize: pt(13), rule: col('rule'),
    color: col('ink') },
  icons: {
    escribe: icon('write', t({ es: 'Escribe', en: 'Write' })),
    oral: icon('oral', t({ es: 'Actividad oral', en: 'Speaking' })),
    pareja: icon('pair', t({ es: 'En pareja', en: 'In pairs' })),
  },
  marginTop: mm(7), marginBottom: mm(2), itemSpacing: em(0.8),
};
// The same activity written on squared paper (cuadrícula): `style="cuadricula"`.
const cuadricula = { id: 'cuadricula', extends: 'actividad',
  area: { kind: 'grid', spacing: mm(5), weight: pt(0.4) } };

Ingredienti

Tipo
Atkinson Hyperlegible Next, Grandstander (SIL OFL 1.1)
Risorse
  • charca-1088.jpg
  • ciclo-1088.jpg
  • nina-720.jpg
  • Animals at a pond: a frog, a kingfisher, a trout, a turtle and a rabbit. (Generated With Diffusion Models, originale)
  • Five stages of a frog's life, in a jumbled order. (Generated With Diffusion Models, originale)
  • A girl with a magnifying glass watching a sparrow and a lizard on a wall. (Generated With Diffusion Models, originale)

Preparazione

#1 · Scrivi le attività nel Markdown e dai loro uno stile una volta sola

script.js · righe 34–61nel codice completo
// The Markdown says what each activity asks (:::exercise, [[answers]], - A -> B, - [x]);
// this style says how a Spanish workbook prints it: the number in a disc of the unit
// colour, the instruction in bold, blanks on a line, V/F boxes at the line's end, dots to
// join, the bank in a tinted box, squared paper for writing and the activity icons.
const icon = (id, alt) => ({ resourceId: `icon-${id}`, alt, size: 1.05 });
const actividad = {
  id: 'actividad',
  number: { shape: 'disc', background: col('unit'), color: col('paper'),
    fontFamily: DISPLAY, fontSize: em(1.05), fontWeight: 800 },
  instruction: { bold: true, color: col('ink') },
  options: { marker: 'circle' },
  blank: { look: 'line', color: col('ink'), weight: pt(0.75), extra: em(2) },
  trueFalse: { look: 'boxes' }, // V F in Spanish, T F in English: the language's own words
  match: { look: 'dots', gap: em(7), dotSize: em(0.42), color: col('unit') },
  bank: { box: 'banco', order: 'alpha', separator: ' ' },
  area: { kind: 'lines', spacing: mm(9), color: col('rule'), weight: pt(0.6) },
  grid: { cell: mm(9.5), fontFamily: DISPLAY, fontSize: pt(13), rule: col('rule'),
    color: col('ink') },
  icons: {
    escribe: icon('write', t({ es: 'Escribe', en: 'Write' })),
    oral: icon('oral', t({ es: 'Actividad oral', en: 'Speaking' })),
    pareja: icon('pair', t({ es: 'En pareja', en: 'In pairs' })),
  },
  marginTop: mm(7), marginBottom: mm(2), itemSpacing: em(0.8),
};
// The same activity written on squared paper (cuadrícula): `style="cuadricula"`.
const cuadricula = { id: 'cuadricula', extends: 'actividad',
  area: { kind: 'grid', spacing: mm(5), weight: pt(0.4) } };

Ogni attività è un blocco :::exercise. Quello che legge l’alunno e quello che conta come giusto stanno nel testo: [[hair]] è uno spazio la cui risposta è hair, - [x] un’affermazione vera, - Dolphin -> Mammal una coppia, [[pelo | (plumas)]] una scelta con la parola giusta tra parentesi. Lo stile contiene solo l’aspetto, così le undici attività condividono actividad e un secondo stile, cuadricula, che lo estende con extends per sostituire le righe con i quadretti. Il motore le numera, mescola con un seme la colonna destra delle coppie e gli elementi da ordinare, rende ogni spazio largo quanto la risposta più lunga perché nessuno sveli la propria, e stampa T e F in inglese, V e F in spagnolo, senza una parola nella configurazione.

#2 · Dai alle attività le loro icone

script.js · righe 276–287nel codice completo
const disc = (body) => '<svg xmlns="http://www.w3.org/2000/svg" width="240" height="240" '
  + `viewBox="0 0 24 24"><circle cx="12" cy="12" r="12" fill="${palette.unit}"/>`
  + `<g fill="none" stroke="#fff" stroke-width="1.7" stroke-linecap="round" `
  + `stroke-linejoin="round">${body}</g></svg>`;
const ICONS = {
  write: disc('<path d="M7 17l1-4 7.5-7.5 3 3L11 16l-4 1z"/><path d="M14 7l3 3"/>'),
  oral: disc('<path d="M6 7.5h12v7.5H11l-3.5 3v-3H6z"/><path d="M9.5 11.2h.01M12 11.2h.01M14.5'
    + ' 11.2h.01" stroke-width="2.2"/>'),
  pair: disc('<circle cx="9" cy="9" r="2.3"/><circle cx="15.3" cy="9.6" r="2"/>'
    + '<path d="M4.8 17.5c.4-2.8 2.1-4.3 4.2-4.3s3.8 1.5 4.2 4.3M13.6 13.9c.6-.3 1.1-.4 1.7-.4'
    + ' 1.9 0 3.3 1.3 3.7 3.8"/>'),
};

Un’icona di exerciseStyles[].icons nomina un’immagine del libro, e :::exercise{icon="oral pareja"} mette le immagini dopo il numero, nell’ordine in cui sono scritte; la sintesi vocale le legge tramite il loro alt. Sono segni piatti disegnati nel codice su un cerchio del colore dell’unità, quindi restano nitidi nel PDF e cambiano con la palette. Un quaderno operativo stampa anche una matita accanto alle attività da scrivere; le icone del parlare e della coppia segnano l’ultima, che non ha uno spazio per scrivere (area="none").

#3 · Apri l’unità con una fascia e un dipinto

script.js · righe 65–81nel codice completo
const at = (to, edge, x = 0, y = 0, size) => ({ anchor: { to, edge },
  offset: { x: mm(x), y: mm(y) }, ...(size && { size }) });
const PIC = 75; // mm: the painting's height (it is 176 × 75 mm, 2.35:1)
const opener = { enabled: true, minHeight: mm(20 + PIC + 4), slot: { elements: [
  { kind: 'box', id: 'band', style: { backgroundColor: col('unit'), borderRadius: mm(4) },
    placement: at('container', 'top-left', 0, 0, { width: mm(176), height: mm(18) }) },
  { kind: 'text', id: 'unit', content: '{attr.unidad}', fontFamily: DISPLAY, fontSize: pt(11),
    fontWeight: 800, color: col('unit'), align: 'center', verticalAlign: 'middle',
    textTransform: 'uppercase', letterSpacing: pt(1.4), lineHeight: 1.1,
    box: { backgroundColor: col('paper'), borderRadius: mm(4) },
    placement: at('container', 'top-left', 4, 4, { width: mm(30), height: mm(10) }) },
  { kind: 'text', id: 'title', content: '{titleText}', fontFamily: DISPLAY, fontSize: pt(27),
    fontWeight: 800, color: col('paper'), align: 'left', lineHeight: 1,
    placement: at('container', 'top-left', 40, 4.4, { width: mm(132) }) },
  { kind: 'image', id: 'picture', resourceId: '{attr.pic}', decorative: true,
    placement: at('container', 'top-left', 0, 22, { width: mm(176), height: mm(PIC) }) },
] } };

Il titolo di livello 1 dell’unità disegna la fascia, la pillola del numero e il titolo a partire dai suoi attributi (unidad="Unit 5" pic="charca"), e sotto la fascia il dipinto a 176 × 75 mm. Le immagini dentro le attività usano un tipo di risorsa senza didascalia né numero (dibujo), come le stampa un quaderno. Il testo si legge facilmente a quell’età: Atkinson Hyperlegible Next in corpo 12 su 17 pt, senza sillabazione, a bandiera.

La ricetta completa

Sandbox
// ═══ Postext Cookbook · Nº 168 · Primary workbook unit of activities ═══════════
// https://postext.dev/en/cookbook/primary-workbook-activities
// Code: MIT · Text: original (CC BY 4.0) · Pictures: generated with diffusion models
// Fonts: Atkinson Hyperlegible Next, Grandstander (SIL OFL 1.1) · Needs postext ≥ 1.59.0
import {
  buildDocumentWithFonts, renderPageToCanvas, registerResourceImage,
} from 'https://esm.sh/postext';
import { renderToPdf, decompressWoff2 } from 'https://esm.sh/postext-pdf';

const LANG = 'en'; // @lang: the language of the sample document ('es' | 'en')
const RECIPE = 'primary-workbook-activities';

// ─── 1 · Design ─────────────────────────────────────────────────────────────
// #region palette: one unit colour (green for this unit), a pale tint of it, a sun yellow
const palette = {
  ink: '#1f2b27', // text: a green-tinted near-black
  unit: '#2b7a3d', // the unit's colour: discs, band, folio, dots to join
  deep: '#1d5a2b', // the bank's words and the kicker on white
  tint: '#e6f2e2', // the reminder box, the bank
  sun: '#f2b330', // the reminder's stripe
  rule: '#9cc3a2', // writing lines, the squared paper
  muted: '#5c6b64', // running heads, colophon
  paper: '#ffffff',
};
const col = (id) => ({ hex: palette[id], model: 'hex', paletteId: id });
const colorPalette = [
  ...Object.entries(palette).map(([id, hex]) => ({ id, name: id, value: { hex, model: 'hex' } })),
  { id: 'main-color', name: 'unit (defaults)', value: { hex: palette.unit, model: 'hex' } },
];
// #endregion
const [TEXT, DISPLAY] = ['Atkinson Hyperlegible Next', 'Grandstander'];

// #region answer: the workbook's activity style, one for every kind of exercise
// The Markdown says what each activity asks (:::exercise, [[answers]], - A -> B, - [x]);
// this style says how a Spanish workbook prints it: the number in a disc of the unit
// colour, the instruction in bold, blanks on a line, V/F boxes at the line's end, dots to
// join, the bank in a tinted box, squared paper for writing and the activity icons.
const icon = (id, alt) => ({ resourceId: `icon-${id}`, alt, size: 1.05 });
const actividad = {
  id: 'actividad',
  number: { shape: 'disc', background: col('unit'), color: col('paper'),
    fontFamily: DISPLAY, fontSize: em(1.05), fontWeight: 800 },
  instruction: { bold: true, color: col('ink') },
  options: { marker: 'circle' },
  blank: { look: 'line', color: col('ink'), weight: pt(0.75), extra: em(2) },
  trueFalse: { look: 'boxes' }, // V F in Spanish, T F in English: the language's own words
  match: { look: 'dots', gap: em(7), dotSize: em(0.42), color: col('unit') },
  bank: { box: 'banco', order: 'alpha', separator: ' ' },

Lo script.js composto funziona così com’è: incollalo nello script modulo di qualsiasi pagina, oppure apri la ricetta su CodePen. Cartella della ricetta su GitHub ↗ (si apre in una nuova scheda)

Varianti

#Stampa le soluzioni per l’insegnante

Lo stesso Markdown dà la copia dell’insegnante: tutti gli spazi riempiti, le caselle vere segnate e le parole giuste cerchiate in magenta.

   exerciseStyles: [actividad, cuadricula],
+  exercises: { edition: 'teacher' },

#Numera le attività nei quadrati

Un quadrato arrotondato del colore dell’unità si legge come lo stile di un altro editore.

-  number: { shape: 'disc', background: col('unit'), color: col('paper'),
+  number: { shape: 'rounded', background: col('unit'), color: col('paper'),

Errori frequenti

  • Le parole da cerchiare in un testo continuo tengono un po’ d’aria su ogni lato per il cerchio, quindi una parola subito prima di una virgola o di un punto ne resta un po’ staccata.

Crediti

Testo
Testo originale, CC BY 4.0
Immagini
  • Animals at a pond: a frog, a kingfisher, a trout, a turtle and a rabbit. · Generated With Diffusion Models · originale
  • Five stages of a frog's life, in a jumbled order. · Generated With Diffusion Models · originale
  • A girl with a magnifying glass watching a sparrow and a lizard on a wall. · Generated With Diffusion Models · originale
Font
Atkinson Hyperlegible Next (SIL OFL 1.1) · Grandstander (SIL OFL 1.1)

Modifica questo testo ↗ (si apre in una nuova scheda)Cartella della ricetta su GitHub ↗ (si apre in una nuova scheda)

Una pagina di giochi con le soluzioni capovolte

Nº 174PDF

Libri di testo

La pagina di giochi di una rivista per bambini: cruciverba, crucipuzzle, indovinello, storia da riordinare e altro, su schede con le soluzioni capovolte.

Livello 2 di 3: IntermedioRiviste e fanzine2 pp.

Un quaderno di esercizi arabo, da destra a sinistra

Nº 173PDF

Libri di testo

Un quaderno arabo per la primaria da destra a sinistra: opzioni أ ب ج, colonne da collegare, riquadro di parole, صح o خطأ, crucipuzzle e cifre arabo-indiane.

Livello 2 di 3: IntermedioQuaderni ed eserciziari8 pp.

Operazioni in colonna come le scrive ogni paese

Nº 170Soluzione alternativaPDFLive

Libri di testo

Una scheda di calcolo le cui operazioni sono righe - 864 ÷ 4 del Markdown, cifra per cifra nei quadretti, e la divisione come la fanno le scuole di ogni paese.

Livello 3 di 3: AvanzatoQuaderni ed eserciziari4 pp.

SandboxPDF