All systems / agronutikas
AgroNutikas Design System v9.0
Design rules for nine surfaces, four new token layers and field-entry states using local sample data. v9.0 rules, V9 pilot images and production behaviour are separate evidence layers.
Observed means a dated check of a public or versioned artifact. Design reference describes a rule or prototype. Proposal does not establish production behaviour. Each inline marker points to its specific source.
In the field and the office the same state must mean the same thing, offline too.
A multi-surface product app used in different conditions. · mobile app, map, admin, print
- surfaces on one rule set
- 9
- new token layers
- 4
- motion durations
- 5
One product, distinct work contexts
A field entry, a dense operator workspace, a map view and a client-facing website need different levels of information. AgroNutikas Design System v9.0 is a consolidation release that treats nine surfaces separately: marketing web, field app, investor portal, Admin/Ops, print/PDF, slides and video, social, motion, and map/GIS. Their vocabulary, states and provenance rules stay connected, so a phone and a report are not forced into one compressed layout. This describes the design rules' scope, not the production maturity of every surface. [1] Design reference · v9.0 rulebook · reviewed [2] Design reference · v9.0 rulebook · reviewed
v9.0 does not redraw the system. Admin/Ops is now a fully specified surface with 15 screens, and four token layers have been added: motion, ops, map/GIS and editorial. No existing token value changed and v8.1 is preserved, so earlier work needs no colour migration. [3] Design reference · v9.0 rulebook · reviewed [2] Design reference · v9.0 rulebook · reviewed
The field-entry question is simple: what happened, what was saved and what must the person do next? The offline-state rule asks for a clear message and action even when the connection fails. The specimen illustrates that rule with local sample data; it does not measure production sync reliability. [4] Proposal · v9.0 rulebook · reviewed
Full source references
- [1] design-9-0-reference · AgroNutikas Design System Rulebook v9.0, sha256 07675dcd13437a074f2a0642cf93c134150aa89ac05638c82dce475d6201647f (38 sections and 5 appendices; consolidation release, v8.1 preserved)
- [2] nine-surface-matrix · AgroNutikas Design System Rulebook v9.0, section 15 Surface Matrix (nine surfaces) and section 35 Admin/Ops Surface (15 screens)
- [3] token-layers-9-0 · AgroNutikas colors_and_type.css v9.0, sha256 b26f0ba93cc84e756e775430fe026b7fec4723864b30641492fafce10455a53e: motion, ops, map/GIS and editorial token layers; no existing token value changed
- [4] field-entry-states · AgroNutikas Design System Rulebook v9.0, sections 02/23/25; local illustrative data
A field-entry specimen
Sample data · a local field-entry illustration derived from v9.0 rules. Visitors can compare allowed, warning and blocked decisions with an example offline message. All four states, their rules, next actions and evidence limits remain visible without JavaScript; an active browser can highlight one state. This page does not save, submit or sync an entry. It must not be read as an actual farm decision or a live rules-engine response. [4] Proposal · v9.0 rulebook · reviewed Every state presents a word, an icon and colour together. [1] Design reference · v9.0 rulebook · reviewed
The specimen colours come from the field app's dark mode: deep earth #060807 with a green undertone, white headings and a green focus ring. v9.0 left these values unchanged. [2] Design reference · v9.0 rulebook · reviewed When connectivity is absent, the message should say that the entry is saved on the device and offer a way to continue with a local draft. If another device edits the same record, a conflict needs a separate comparison; “saved on device” is not “synced to server”. These are example states from rulebook section 23, not confirmation of production sync. [4] Proposal · v9.0 rulebook · reviewed
The specimen ends with a motion plate. Its table computes five durations in three audience perspectives, three timing curves are drawn from their control points, and only the stepper curve overshoots its target. An expandable lab lets you choose the audience, the curve and the motion scale and run a reveal of six field cards; under reduced motion the cards are in their end state at once. The values come from the motion system token file, not from the field app code. [3] Design reference · Motion token file · reviewed
Full source references
- [1] design-9-0-reference · AgroNutikas Design System Rulebook v9.0, sha256 07675dcd13437a074f2a0642cf93c134150aa89ac05638c82dce475d6201647f (38 sections and 5 appendices; consolidation release, v8.1 preserved)
- [2] token-layers-9-0 · AgroNutikas colors_and_type.css v9.0, sha256 b26f0ba93cc84e756e775430fe026b7fec4723864b30641492fafce10455a53e: motion, ops, map/GIS and editorial token layers; no existing token value changed
- [3] motion-tokens-1-0 · AgroNutikas Motion System v1.0 export-pack/tokens/motion.tokens.json, sha256 3426730990096274f96f6be821ecead3513088c17bdb48fac707c31ae26b9206: durations 80/140/200/340/560 ms, easing smooth/reveal/organic, perspective 0.66/1.30, reveal 20 px, stagger 100 ms up to 6
- [4] field-entry-states · AgroNutikas Design System Rulebook v9.0, sections 02/23/25; local illustrative data
Four fixed examples show status, next action and evidence limit. This page does not save or submit a field entry.
Highlight one state
Allowed
Sample field A · task type and date are filled in.
- Next action
- Review the entry. No real record is saved here.
- Rule
- Illustrative rule: task type and date are present. §25.05 defines the display order of state and action.
- Evidence limit
- Local example; no production rules-engine decision has been verified.
Warning
Sample field A · entered amount needs checking against its source.
- Next action
- Compare the amount with its source before continuing.
- Rule
- Warning remains visible as word and icon · §02.
- Evidence limit
- The amount threshold is not farm data or a verified production rule.
Blocked
Sample field A · the task date is missing in this example.
- Next action
- Add the date and review the entry again.
- Rule
- Illustrative rule: a missing date pauses the entry. §25.05 defines display order.
- Evidence limit
- The block illustrates a rule; it is not a real account or legal decision.
Offline
Sample field A · an example of lost connectivity.
- Next action
- Continue composing a draft; this page neither saves nor syncs it.
- Rule
- “No connection. Save on device.” · §23 reference wording.
- Evidence limit
- Local state illustration; on-device storage and later sync have not been tested.
Motion: durations are computed, never typed
Every duration is a base value × the user’s motion scale × the audience perspective. The farmer view is faster because a tractor is idling; the investor view is calmer because they are reading. The motion layer changes how long, never what happens.
| Token | Base | Farmer × 0.66 | Neutral × 1 | Investor × 1.3 |
|---|---|---|---|---|
--d-instant | 80 ms | 53 ms | 80 ms | 104 ms |
--d-fast | 140 ms | 92 ms | 140 ms | 182 ms |
--d-normal | 200 ms | 132 ms | 200 ms | 260 ms |
--d-slow | 340 ms | 224 ms | 340 ms | 442 ms |
--d-reveal | 560 ms | 370 ms | 560 ms | 728 ms |
Timing curves
- smooth · default
cubic-bezier(0.22, 1, 0.36, 1) - reveal · entrance
cubic-bezier(0.16, 1, 0.3, 1) - organic · stepper only
cubic-bezier(0.34, 1.56, 0.64, 1)
organic is the only curve that overshoots its target, which is why it is reserved for the stepper.
- A transition never carries a raw ms value; always var(--d-*).
- Hover is translateY(−1px) plus shadow: never scale, never rotate.
- A reveal starts 20 px low, siblings follow in 100 ms steps, at most six at a time.
- Under reduced motion, pulses and loops stop and content shows in its end state at once.
Open the motion lab: choose an audience and a curve, then run the reveal
--d-reveal = 560 ms × 1 × 1 = 560 ms
- Field 1
- Field 2
- Field 3
- Field 4
- Field 5
- Field 6
Decisions and rules
The marketing mood is a field manual. The ground is warm cream #FAFAF7 rather than pure white, because it causes less glare. Headings use Archivo, borders are 1.5 px lines in ink #0A1A0C, corners are sharp, the shadow is a 3 px ink offset and corner markers frame blocks as in a printed guide. That surface carries proof and one invitation to explore the pilot, not gloss. [2] Design reference · v9.0 rulebook · reviewed [3] Design reference · v9.0 rulebook · reviewed
The field app is the second mood: light grows from darkness. The ground is deep earth #060807 with a green undertone, not pure black; type is Outfit and Inter, cards have 18–24 px rounding and a soft bioluminescent glow replaces the shadow. The screen presents state first, then context, next action and evidence when needed. It has one primary action, and a control intended for gloved use targets at least 56 px. [1] Design reference · v9.0 rulebook · reviewed [2] Design reference · v9.0 rulebook · reviewed
The investor view is a dense trust surface, with confidentiality and data timestamps beside the figures. Admin/Ops is a separate operator workspace of 15 screens: welded hairlines, a 13 px base size and zero glow, because an operator reads a table, not a mood. It does not copy the field app's large controls. Both are reference surfaces, not a public data room or live operator data. [2] Design reference · v9.0 rulebook · reviewed [3] Design reference · v9.0 rulebook · reviewed
Print/PDF uses a light paper surface and labels that remain legible in grayscale. Slides and video use a dark presentation stage, and social uses platform-specific aspect ratios with a brand overlay on approved imagery. The editorial layer is a separate token layer for longer content. These are v9.0 export and presentation rules, not client files published by this page. [2] Design reference · v9.0 rulebook · reviewed [1] Design reference · v9.0 rulebook · reviewed
Status is always colour, icon and word together, never hue alone. Colours carry Estonian element names such as mets, talinisu, oht and muld, so design and field work share one vocabulary. An allowed field entry lets the person continue, a warning asks for an additional check and a block explains the reason and a recoverable path; a conflict is never silently overwritten. [1] Design reference · v9.0 rulebook · reviewed [6] Proposal · v9.0 rulebook · reviewed
Motion durations are computed: a base value multiplied by a motion scale and a perspective scale. The farmer perspective runs at 0.66 times the duration and the investor perspective at 1.3 times, and the reduced-motion preference is honoured. On the map, a parcel status is always stroke, fill and legend word together, never fill alone; the gold selection colour stays distinct from status green, and source, time and the forecast boundary remain visible. [5] Design reference · v9.0 rulebook · reviewed
Contrast is computed with the WCAG 2 formula from the v9.0 token values. In marketing, field, ops and print modes every text-role pair reaches at least 4.5:1: body text on cream 11.0:1, muted text 6.7:1 and field app body text 16.4:1. One exception is stated openly: white text on the amber marketing button gives 3.2:1, so it is for large text only. [4] Observed · Contrast computation · reviewed
Full source references
- [1] design-9-0-reference · AgroNutikas Design System Rulebook v9.0, sha256 07675dcd13437a074f2a0642cf93c134150aa89ac05638c82dce475d6201647f (38 sections and 5 appendices; consolidation release, v8.1 preserved)
- [2] nine-surface-matrix · AgroNutikas Design System Rulebook v9.0, section 15 Surface Matrix (nine surfaces) and section 35 Admin/Ops Surface (15 screens)
- [3] token-layers-9-0 · AgroNutikas colors_and_type.css v9.0, sha256 b26f0ba93cc84e756e775430fe026b7fec4723864b30641492fafce10455a53e: motion, ops, map/GIS and editorial token layers; no existing token value changed
- [4] contrast-9-0 · WCAG 2.x relative-luminance calculation of role text pairs in marketing, field, ops and print modes from AgroNutikas colors_and_type.css v9.0, sha256 b26f0ba93cc84e756e775430fe026b7fec4723864b30641492fafce10455a53e
- [5] motion-map-grammar · AgroNutikas Design System Rulebook v9.0, section 36 Motion System and section 37 Map/GIS Layer
- [6] field-entry-states · AgroNutikas Design System Rulebook v9.0, sections 02/23/25; local illustrative data
Evidence and limits
The v9.0 rulebook and colors_and_type.css v9.0 are pinned by SHA-256 hashes; they support selected design rules, tokens and examples. They do not establish current AgroNutikas-APP production behaviour, real field data or the maturity of every component. [1] Design reference · v9.0 rulebook · reviewed [2] Design reference · v9.0 rulebook · reviewed All field-entry data in this deep view is sample data. [5] Proposal · v9.0 rulebook · reviewed The system's documentation can also be browsed as an interactive platform: 14 chapters, 16 components in six groups as static previews, and role tokens in four modes (web, app, ops, print). [3] Design reference · Design-system documentation · reviewed
Governance is part of the system: semantic versioning, migration guides, a design debt register of 12 items with 9 resolved and 3 open, a component maturity matrix, an AI implementation contract and a QA script list. They describe how the system is changed and checked; they are not a claim that every check is currently green in the product. [4] Design reference · v9.0 rulebook · reviewed
An older case gallery contains V9 pilot-package images whose capture dates are unverified. The V9 pilot package and the v9.0 rulebook are different things, so we do not use those images as v9.0 screens or dated production proof. Versions and data layers remain separate until the images' provenance is checked. [6] Design reference · Case gallery · reviewed
Full source references
- [1] design-9-0-reference · AgroNutikas Design System Rulebook v9.0, sha256 07675dcd13437a074f2a0642cf93c134150aa89ac05638c82dce475d6201647f (38 sections and 5 appendices; consolidation release, v8.1 preserved)
- [2] token-layers-9-0 · AgroNutikas colors_and_type.css v9.0, sha256 b26f0ba93cc84e756e775430fe026b7fec4723864b30641492fafce10455a53e: motion, ops, map/GIS and editorial token layers; no existing token value changed
- [3] design-system-artifact-9-0 · AgroNutikas Design System v9.0 documentation, version 1792259248-ed7b: 14 chapters (00 Sõnastik to 13 Mida see tõendab), 16 static component previews in six groups, role tokens in four modes (web, app, ops, print) and self-hosted Archivo, Outfit, Inter and DM Mono
- [4] governance-9-0 · AgroNutikas Design System Rulebook v9.0 governance: semantic versioning, migration guides, design debt register (12 items: 9 resolved, 3 open), component maturity matrix, AI implementation contract and QA script list
- [5] field-entry-states · AgroNutikas Design System Rulebook v9.0, sections 02/23/25; local illustrative data
- [6] v9-pilot-images · AgroNutikas case gallery, V9 pilot package; capture date unknown
A useful next step
If your product spans several work contexts, we can map the states of one real journey, define rules for phone and wider screens and build a clearly labelled local specimen. Handoff includes a state vocabulary, control measurements, a contrast calculation, provenance labels and verification questions; production integrations require separate scope. [1] Design reference · v9.0 rulebook · reviewed [2] Proposal · v9.0 rulebook · reviewed
When you contact us, describe a situation in which someone cannot tell whether work was saved or what to do next. We can start with that state and mark what is observed, what is reference and what still needs implementation. [2] Proposal · v9.0 rulebook · reviewed
Full source references
- [1] design-9-0-reference · AgroNutikas Design System Rulebook v9.0, sha256 07675dcd13437a074f2a0642cf93c134150aa89ac05638c82dce475d6201647f (38 sections and 5 appendices; consolidation release, v8.1 preserved)
- [2] field-entry-states · AgroNutikas Design System Rulebook v9.0, sections 02/23/25; local illustrative data
Your system
If you need a similar system, answer three questions in the enquiry:
- Which brand or product is it?
- How many surfaces (web, app, print …)?
- When does it need to be ready?