08 —One component, start to finish
A taste of the system — a real example, not a spec.
The approach, in practice
The internal team shared the current component with us. Below is what the approach looks like in practice: the same component, the same settings, the same connections behind it — redesigned on the surface. Nothing about how it works changes.
Today · horizontal-plan-card.tsx · as seen on /pricing/pix4dfields
PIX4Dfields
Includes:
- Unlimited acreage & mapping
- Vegetation indices generation
- AI Detection: weeds, field boundaries & obstacles
- Ready-to-use prescription maps
- Direct export to tractors, spray drones & field sprayers
€157.50/month
€4068
€1890 Billed yearly, excl. taxes
Save 2178€How it works — unchanged
title
description · rich text
prices[]
productCode
includedFeatures
productLogo
Translate ids
LocaleContext
PriceDisplay
SelectPlanAction
Proposed · works exactly the same
Includes:
- Unlimited acreage & mapping
- Vegetation indices generation
- AI Detection: weeds, field boundaries & obstacles
- Ready-to-use prescription maps
- Direct export to tractors, spray drones & field sprayers
€157.50/month
€4068 · €1890 Billed yearly, excl. taxes
Save 2178€Today · horizontal-plan-card.tsx · as seen on /pricing/pix4dfields
PIX4Dfields
Includes:
- Unlimited acreage & mapping
- Vegetation indices generation
- AI Detection: weeds, field boundaries & obstacles
- Ready-to-use prescription maps
- Direct export to tractors, spray drones & field sprayers
€157.50/month
€4068
€1890 Billed yearly, excl. taxes
Save 2178€How it works — unchanged
title
description · rich text
prices[]
productCode
includedFeatures
productLogo
Translate ids
LocaleContext
PriceDisplay
SelectPlanAction
Proposed · works exactly the same
Includes:
- Unlimited acreage & mapping
- Vegetation indices generation
- AI Detection: weeds, field boundaries & obstacles
- Ready-to-use prescription maps
- Direct export to tractors, spray drones & field sprayers
€157.50/month
€4068 · €1890 Billed yearly, excl. taxes
Save 2178€The proposed design here is just an example — the real direction is decided and agreed in phase 1. How the component works is not an example: it’s exactly how the component works today.
Where it starts
Components start from proven, ready-made building blocks — with accessibility, keyboard handling, and focus already handled — and are then restyled with Pix4D’s design settings and shaped to its code standards. The hard, generic problems stay solved; the design is entirely Pix4D’s.
Every component on the list gets this same treatment — built once, in code, documented right where it lives, working exactly the way the current component already works.
Next
The approach, demonstrated. What’s left is the when — phases, milestones, and what gets delivered.