Decolan
Open the conceptA concept for a CNC machining shop: the machine park drawn to scale and a check that says which machine a part fits, then writes the request.
Decolan is not my client and did not commission this website. I made the concept on my own initiative from the text and photos on their public website, so every fact on it is theirs.

- Company
- Decolan
- Service
- Concept website and part-size check
Decolan in Izegem, Belgium, is a subcontractor for CNC turning and milling, from a single part to medium batches, in any material, with its own certified welding department. A buyer who contacts them has a drawing and one question: will my part fit your machines?
What I found
It is a single page. I checked it on 14 November 2026, on a laptop and a phone:
- The page is eight GIF images exported from Fireworks in January 2010. The HTML holds no sentence, only the alt text "Stuur een mail", and the tab reads "index.gif". Google cannot learn what they do.
- The first sentence reads "Decolan hernieuwt zijn site!" ("Decolan is renewing its site"). The code today is identical to the Internet Archive capture of 20 April 2012.
- With no mobile viewport setting, a phone shows a table 1020 px wide at about 38% scale, unreadable without zooming.
- Their strongest point, the machine park (Ø 1400 mm, 15 m in X, lifting up to 50 t), is part of the image. A buyer has to compare the numbers alone, then phone.
- At the https address the browser warns that the certificate is self-signed; it expired in November 2022.

Decisions
Capacity on the first screen
The headline comes from their own sentence: "Draai- en freeswerk, van één stuk tot middelgrote serie". Below it, four figures from their site, 1400 mm, 8 m, 15 m and 50 t, now as text. On the right, a drawing of a turned part with a title block, labelled as an illustration, draws itself once and stays still; on a computer its layers shift slightly with the pointer. Colours come from the logo, yellow and graphite grey.
Services that end in a dimension
Turning, five-axis milling, large milling and welding are four cards, each ending with its maximum dimensions, because that is what a buyer looks for.

The machine park on one scale
I drew the figures from the grey box as working envelopes on a one-metre grid, all on one scale. As you scroll, the drawing holds still and each step draws its envelope: the 6 m lathe, the 8 m five-axis machine, the 15 m machine with its fourth axis, then welding and lifting. Dimensions count up to their real value. At the end all envelopes sit together. A note says it is a diagram, not a drawing of the machines.

A check before the enquiry
"Past uw werkstuk?" (does your part fit?) asks for the operation, dimensions, weight, quantity, welding and material. It answers at once which machine the part fits and how much of the range it uses, draws the part inside the envelope, and flags anything over the 20 t the fourth axis takes. A request summary builds alongside and says when it is ready. The button carries it into the enquiry form, which opens an email to info@decolan.be. No prices or lead times, as on their site.

Dutch, and the phone
The website is in Dutch, like the current one, with the polite "u" they already use. On a phone the machine park drawing stays at the top while the steps change beneath it, and in the tool a bar with the answer stays above the fields.


How it's built
Static HTML, CSS and JavaScript, with no framework or animation library. Every drawing is inline SVG. CSS draws the first screen, a small script ties the machine park lines to the scroll position, and the rest is CSS transitions and IntersectionObserver. Hidden starting states are set only once JavaScript loads, so without it the page is fully visible, and with reduced motion the drawings appear complete. The tool has no server: the browser does the sums and the enquiry leaves through mailto. The page is noindex (meta tag, robots.txt, response header) and the JSON-LD holds only details from their website.
What I would do next
With the company I would first check which certificate the welding department holds, which materials they machine most and what width the five-axis machine takes, which the tool leaves open. A real project would add photographs of the workshop, a French version and a form that takes the drawing as an attachment.
