Aller au contenu
ALTIMETRIADEV & TECH

Development & Product Design

The tool shipped, it works, and the teams went back to spreadsheets. The problem is almost never technical: no one looked at who would be using it on Monday morning.

An interface is judged in use: what counts is what is still usable six months in.

Operable product

Compose the interface, it redraws itself

Eight ready mechanisms, seven controls — palette, typography, density, corners, motion, light, structure — and one demonstration interface that answers on click. Pick a mechanism, change what does not look like you, send us the address: it reopens exactly your screen. If none of the eight fits, we build one.

Eight design mechanisms, adjustable on screen: palette, typography, density, corners, motion.

Open the workshop
The catalogue of choices

Nine trades, nine instruments: the demonstration by segment

For each trade, a practitioner's dashboard that opens for real and can be handled: a real move, a master indicator, a living moment. A bid desk, a public-procurement department, a workshop and its flows, a health centre, a product-and-revenue cockpit. Fictional data, stated as such; the move itself is the trade's own. The brand page of each of these houses is shown at the Studio, under “Creation, Design & Model catalogue”.

9 demonstrations, 9 trades — fictional data, real moves
Demos by tradeTrade demonstration — fictional data

A brand director's cockpit

It shows where a brand slips, channel by channel, and opens the exact gap to fix — down to the 41 off-template product shots on the online store.

Who it is forIdentity studios, brand teams, houses running several channels at once.

HTML · CSS · SVG · JavaScript sans dépendance · bilingue · deux régimes

designed on 6 September 2026

Demos by tradeTrade demonstration — fictional data

An SME's bid desk

It sorts 34 lots published within a 62 km radius, calls go / no-go with a written reason, and runs the countdown to the next submission.

Who it is forContractors, engineering practices and trades bidding for public work.

HTML · CSS · SVG · JavaScript sans dépendance · bilingue · deux régimes

designed on 6 September 2026

Demos by tradeTrade demonstration — fictional data

A developer's land sourcing desk

It filters 214 plots down to 7, reads what the local plan allows, and flags the planning notice posted 120 m from a tracked plot.

Who it is forDevelopers, land promoters, property traders and anyone assembling schemes.

HTML · CSS · SVG · JavaScript sans dépendance · bilingue · deux régimes

designed on 6 September 2026

Demos by tradeTrade demonstration — fictional data

Four venues under control, mid-service

It shows the room live on a Saturday at 19:42 — 62 covers seated out of 86 — the day's takings by venue, the evening's bookings and the margin on every dish.

Who it is forRestaurateurs, hoteliers and retailers running several sites.

HTML · CSS · SVG · JavaScript sans dépendance · bilingue · deux régimes

designed on 6 September 2026

Demos by tradeTrade demonstration — fictional data

Running a care centre

It holds occupancy by ward, appointment waits, the day's theatre list and compliance deadlines — aggregates only, never a patient.

Who it is forClinics, health centres, group practices and coordinated care structures.

HTML · CSS · SVG · JavaScript sans dépendance · bilingue · deux régimes

designed on 6 September 2026

Demos by tradeTrade demonstration — fictional data

Public procurement office

Secures the framework agreements reaching their term: three expire with no renewal procedure started, and the closest one falls in forty-seven days.

Who it is forA local authority procurement team preparing its monthly award committee.

HTML · CSS · SVG · JavaScript sans dépendance · bilingue · deux régimes

designed on 6 September 2026

Demos by tradeTrade demonstration — fictional data

Shop floor and flow control

Says where today's constraint is: a press is down, overall equipment effectiveness falls to 71.4%, and assembly now sets the output of the whole plant.

Who it is forAn operations manager starting a shift who must resequence before noon.

HTML · CSS · SVG · JavaScript sans dépendance · bilingue · deux régimes

designed on 6 September 2026

Demos by tradeTrade demonstration — fictional data

Firm dashboard — the text as it stood

Recovers the version of a text that applied on the day of the transaction, shows what had changed just before, and says how many files depend on it — while the statutory deadline timeline runs.

Who it is forAn accountancy or law firm that must answer about a past date, not about the current state of the rule.

HTML · CSS · SVG · JavaScript sans dépendance · bilingue · deux régimes

designed on 6 September 2026

Demos by tradeTrade demonstration — fictional data

Product and revenue dashboard

Ties recurring revenue back to actual behaviour: three paying accounts have stopped logging in, and the funnel shows the drop-off is not at import but at inviting a teammate.

Who it is forA growing software publisher choosing between acquiring more and retaining better.

HTML · CSS · SVG · JavaScript sans dépendance · bilingue · deux régimes

designed on 6 September 2026

Each piece opens full size, exactly as it runs; the live models are driven by hand.

The catalogue of choices

Seven trades, seven screens: our design stock

Products designed then kept in reserve, each drawn for one trade and its morning gesture — plus the two dashboards that steer them, an executive's day and a salesperson's funnel. The versions set aside are here too, shown for what they taught.

9 pieces from our design stock
DashboardsWorking mock-up, in reserve

The daily cockpit

An executive view at instant T: today's opportunities, files in go, contracts at risk, next deadline counting down, briefing. Every indicator is a probability, never a promise.

Who it is forAn executive who wants the state of their watch on one page, every morning.

designed on 6 July 2026

DashboardsWorking mock-up, in reserve

The sales pipeline

Detection, qualification, response, win: a funnel by stage with volumes and conversion rates, average days per stage, pipeline value.

Who it is forA sales management that tracks public prospecting like a private pipeline.

designed on 6 July 2026

Screens by tradeWorking mock-up, in reserve

The tradesman's screen

“Your first public contract is within reach”: an informal voice, four figures, three layers — detect, prospect, anticipate — and one action per screen.

Who it is forA very small construction business that has never answered a tender.

designed on 6 July 2026

Screens by tradeWorking mock-up, in reserve

The screen of the SME already bidding

“I bid, but I rarely win”: success rate, lost contracts and why, the cross-reference graph — data that explains the loss before promising the win.

Who it is forAn SME of ten to fifty people that wants to win more often, not bid more.

designed on 6 July 2026

Screens by tradeWorking mock-up, in reserve

A bid team's radar

Six layers of watch, volumes by territory, the competition graph and an assistant that answers plainly: the screen of a team handling dozens of files.

Who it is forA mid-sized company with a dedicated team and targets by region.

designed on 6 July 2026

Screens by tradeWorking mock-up, in reserve

The owner's-adviser screen

The radar turned towards studies: contracts by type, lots, buyers' history — the material that feeds a framing note.

Who it is forAn owner's adviser or programming firm that documents its studies with facts.

designed on 6 July 2026

Screens by tradeWorking mock-up, in reserve

The developer's screen

Spot where public investment is accelerating — permits, budgets, facilities — to arrive before the private market.

Who it is forA developer, a planner who picks municipalities on signals, not rumours.

designed on 6 July 2026

Screens by tradeWorking mock-up, in reserve

The supplier's screen

Sell to the right site at the right time: contracts awarded in one's speciality, the winning company, the likely date materials are ordered.

Who it is forA distributor, a manufacturer selling to the companies that have just won.

designed on 6 July 2026

Screens by tradeWorking mock-up, in reserve

The recruitment radar

Spot who is about to hire before everyone else: the contracts won that call for crews, by territory and by trade.

Who it is forA recruitment firm, a construction-specialised staffing agency.

designed on 6 July 2026

Each piece opens full size, exactly as it runs; the live models are driven by hand.

The catalogue of choices

What a screen does as it opens

A page does not begin at its first paragraph: it begins with the movement that introduces it. A converging cloud, a counting spiral, a map that rises, a file taken apart line by line — openings and waiting screens that say something instead of filling time.

5 pieces from our design stock
Scenes & motionWorking mock-up, in reserve

The galaxy — every point an entity

A converging cloud of particles; every grain is an entity in the base, with a name, a sector, a use on hover. The scene the galaxy of sources comes from.

Who it is forA firm that wants to show the scale of its material without a table.

designed on 6 July 2026

Scenes & motionWorking mock-up, in reserve

The spiral of contracts

A spiral of points and a rising counter: the public-procurement radar in a single movement.

Who it is forA page opening, a presentation, a trade show.

designed on 6 July 2026

Scenes & motionWorking mock-up, in reserve

The whole of France, on the radar

The map of départements as a relief of points, filterable by layer, a national counter: the version that set the map's vocabulary.

Who it is forA national player that has to show coverage.

designed on 6 July 2026

Scenes & motionWorking mock-up, in reserve

The hologram of a company number

An example company at the centre, its facts in orbit — capital, headcount, contracts, executives — linked by threads of light. The 360 profile as a hologram.

Who it is forA sales demonstration that has to fit in one image.

designed on 6 July 2026

Scenes & motionWorking mock-up, in reserve

The tender, taken apart

A tender file read line by line — object, criteria, documents, deadlines — down to the verdict: go or no-go, with its score. “We read it before you do.”

Who it is forA bid team that wants to see what a file holds before opening it.

designed on 6 July 2026

Each piece opens full size, exactly as it runs; the live models are driven by hand.

The catalogue of choices

The screens drawn before writing a line

A product is drawn as a skeleton before it is coded: the questions the screen must answer, the order they arrive in, and what stays out. Two skeletons — a buyer's workstation and the plan of a multi-world site — laid out before the first line, and re-read at every screen since.

2 pieces from our design stock
ArchitecturesWorking mock-up, in reserve

International — the skeleton

A French firm of international reach, a wireframe globe, zones of operation: the page reduced to its structure.

Who it is forA firm deploying its trades on several markets.

designed on 20 July 2026

ArchitecturesWorking mock-up, in reserve

The procurement workstation

“What demands your attention”: the questions a buyer asks, each with its figured answer and its gesture — the workstation drawn before the code.

Who it is forA procurement department, public or private, that wants a tool that answers instead of displaying.

designed on 20 July 2026

Each piece opens full size, exactly as it runs; the live models are driven by hand.

The method behind a procurement product

What an executive must understand, and what the specialist opens the panel to find.

DEV & TECHNOLOGY · PROCEDURES

Digitise without breaking the evidence chain.

Metadata-driven forms, enforceable validation and interoperable exchange.

A digital procedure must reduce re-entry while increasing traceability.
DRAFT · VALID · REJECTED · PUBLISHED · ACKNOWLEDGED
Method

eForms SDK, UBL/XML, Schematron rules, TED CVS validation and AS4 exchange where required.

  • Metadata-driven notice-type-definition
  • Versioned codelists and multilingual labels
  • Syntax validation + business rules
  • UBL/XML · SDK version identifier
  • eDelivery AS4 · signature · encryption · signed receipt
  • ESPD / eCertis · reuse and prefill where available
We display technical message validity separately from substantive compliance. Two questions, two answers.

Interfaces delivered and maintained, told without the names

A site for two audiences in two languages, an index that returns the rule in force on the day of the facts, a configurator that redraws itself live: what we built, what it produced, and what was hard. Names removed, volumes kept.

TRACK RECORD · REAL ASSIGNMENTS, NAMES WITHHELD

  1. 01

    Our own house — a firm with three practices, two audiences that are not looking for the same thing, and two languages.

    When · Summer 2026, in production and reworked weekly.

    What we did

    We designed and built this site end to end: architecture, design, copy, three-dimensional scenes, and the English mirror. English is not a button that repaints the page — it is a set of URLs of its own, without which no search engine ever sees it.

    What it produced

    A two-world site, fully bilingual, where every English page has its own URL and its reciprocal link to the French one. Seven automated checks guard the release, chained behind a single command: background regimes, stylesheets, brand charter, text tones, structured data, per-language URLs, sub-page substance. The first defect stops the chain — it is a refusal, not a warning.

    What was hard

    The English already existed, but as a display state: no URL served it. Two states of one document are not two documents — the tag that links languages links URLs, and it had nothing to link. The URLs had to be split before we could hope to be read outside France.

  2. 02

    Teams that must cite the rule applicable on the day of the events, and to whom a search engine always returns the latest version.

    When · 2026, in production.

    What we did

    We indexed a versioned body of rules so that a search returns the version in force on a chosen date, not the most recent one. The vintage is a dimension of the index, not a filter bolted on afterwards.

    What it produced

    An index searchable by text and by date, kept separate from the warehouse it serves, and rebuildable without touching the one in service.

    What was hard

    The first rebuild deleted the old index before building the new one — and it could not finish: there was not enough disk space. Its own log gives the time of deletion, an hour and twenty minutes before it was stopped. Destroying before knowing whether you can rebuild is not a rebuild: it is a deletion followed by hope. Its replacement measures free space first and builds alongside; it can no longer touch what exists.

  3. 03

    Brand and product teams that settle a visual direction on screenshots, then discover in development that the real rendering does not match.

    When · Summer 2026, live.

    What we did

    We built a configurator that recomposes an entire interface live — typography, palette, density, corner radii, stroke weights — in the very code that ships to production. What is settled on screen is what is delivered: there is no translation step between the mock-up and the product.

    What it produced

    A single scene, mounted by the public page and by its reduced preview without being duplicated, and an exportable brief carrying the settings chosen.

    What was hard

    A configurator that lives beside the product ends up lying. This one shares its components with the site: the day a component changes, the demonstration changes with it — or it stops compiling, which is exactly the intended behaviour.

No client name is published, with or without their consent. We publish no win rate: it is not measured, and an unmeasured figure is not a reference.

What we do

  • Custom websites: editorial, performance, accessibility, technical SEO.
  • Web and mobile applications: client portals, back-offices, business workflows.
  • Business software and e-commerce, with the roles and permissions that come with them.
  • Product design: journeys, mockups, component system — attached to the code, not beside it.
  • API design: named resources, status codes used for what they actually mean, cursor pagination where volume demands it, versions and an announced retirement calendar.
  • Reversible data migrations, rehearsed on a copy first: we build alongside, we never destroy before knowing we can rebuild.
  • Taking over and repairing an existing product inherited from another team: we read and document what the code actually does before opening the debate on what it should do.

What we deliver

Journeys & clickable mockups
Documented component system
Application in production, code handed over
Documented interface contract, with its examples and its error cases
Automated test suite
Migration log, every step reversible
Technical documentation & handover guide
Performance & accessibility report, measured on screen in light and dark

The method

01

Frame

What the product must do — and above all what it will refuse to do: guardrails are designed together with the features.

02

Prototype

A clickable journey before the first line of final code.

03

Build

Short vertical iterations: interface, logic, data, tests. No hard-coded values — a frozen number never ages, it turns wrong all at once.

04

Hand over

Code, documentation and access: a product that lives without us. The repair instructions are printed by the tool that reports the failure, not by a manual someone would have to think of looking for.

WHAT YOU WILL HAVE IN HAND · The Slice That Holds

Choose an incident: the journey shows what holds, what degrades and what must be recovered.

A slice that can actually be delivered, cut from the whole.

We design the smallest product slice that already delivers a complete service: user intent, data, decision, feedback and usage evidence. It is not a disposable prototype; it carries the contracts that allow the rest to be added.

The executive sees the nominal journey, degraded path and recovery. Value lies in what the user can complete, not in screen count or a demonstration that fails outside the perfect scenario.

Run the journey

State, contract, incident, degradation and recovery

Bounded context, ubiquitous language, aggregate, invariant and domain event set the vocabulary before the screen exists.

Explicit state machine: authorised transitions, preconditions, idempotent commands and an audit log.

Vertical slice linking interface, application logic, persistence, API contract, authorisation, tests and telemetry.

Progressive enhancement, empty/loading/error/offline states and recovery after interruption.

Design system tied to code: typed tokens, components, variants, properties, documentation and visual regression tests.

WCAG 2.2: semantic structure, focus order, name/role/value, target size, contrast, reflow, errors and alternatives — checked by a repeatable test suite and human review.

Core Web Vitals in field data: LCP, INP and CLS at the 75th percentile; lab and field are never conflated.

OpenAPI, backward-compatible versioning, consumer-driven contract tests and a schema evolution strategy.

Characterisation, unit, integration, end-to-end and accessibility tests, each tied to the risk it covers.

Feature flag decoupled from deployment, expand/contract migration, canary, rollback and a dated removal of the flag.

SLI/SLO, error budget, distributed trace, correlated logs and alerts oriented on user-facing symptoms.

ADR, SBOM, dependencies, runbook, reversibility, access and proof of restoration in the handover file.

Evidence discipline: an uninstrumented event remains N.F. — it never becomes an implicit success; keyboard, reduced motion, slow connection and dependency failure belong to the reference scenario.

The slice demonstrates a journey that has been tested and traced within its declared scope; it replaces neither the client’s real business rules, nor a human accessibility audit, nor field measurement under real conditions. Any transition without an instrumented trace remains N.F., never an implicit success.

THE QUESTIONS THAT SET THE PRICE

What we will ask you before we start.

Four questions we ask on every file in this domain. Each comes from an incident someone paid for — us, or a client before us.

Which decision does the screen let you take?

A screen that helps no decision is a decorative dashboard. Every screen we design starts from the decision it serves, then the data that grounds it, and only then the form.

If nobody asks it — A beautiful interface, full of figures nobody uses.

Where do the displayed figures come from, and when were they measured?

No hard-coded figure: every number is wired to its source or carries its date in the same sentence, and a missing value is shown as missing — never as a zero.

If nobody asks it — A frozen number that never ages and turns wrong all at once, with nothing to flag it.

Can the product be operated without us?

We deliver the system with its executable checks, its handover documentation and its repair instructions printed by the very tool that reports the failure — not in a manual someone would have to think of looking for.

If nobody asks it — A product that depends on its author, hence on a single point of failure.

What does the product refuse to do?

A serious product has guardrails: it refuses to write when the count is off, it refuses an entry that contradicts a business rule, it says what it does not know. We design the refusals together with the features.

If nobody asks it — A database that accepts everything, and data nobody can vouch for any more.

CAPABILITY SCENARIO — NOT A CLIENT REFERENCE

When we get the call

An organisation runs its core business through a chain of shared spreadsheets, with rules only one person knows. We formalise those rules, move them into an application with roles and history, then migrate the existing data. The spreadsheet becomes an archive rather than a single point of failure.

Planning something in Development & Product Design?

Write to us. We respond with an assessment, not a brochure.

Write to us