Demonstration project — fictional brand
SANAGA Automation & Energy
The website of an industrial integrator, with a control room running live in the browser.
Project sheetSAE
- Sector
- Automation and energy
- Market
- Central Africa and Europe
- Type
- Showcase site and supervision
- Pages
- 27
- Languages
- French, English
- Built in
- 2026
The need
SANAGA installs PLCs, supervision systems and solar plants in Central Africa and Europe. Its customers are plant managers and buyers. Before trusting a team with their factory, they want to judge its level. A brochure is not enough: they need proof.
For their customers
A plant manager opens the control room and recognises their own trade: the alarms, the trends, the output of their station. When they ask for a quote, they describe their PLCs and attach their drawings. The engineer who calls back already knows what it is about.
What I built
-
A live control room
A simulated bottled-water plant runs inside the page. Inject a fault: the pump overheats, the alarms rise by priority and the standby pump starts on its own.
-
Expertise pages, with diagrams
For each trade: what the teams go through, what SANAGA delivers, and a diagram drawn like a real engineering plan.
-
A technical quote in 5 steps
The customer lists their PLCs and the number of inputs and outputs, and attaches their drawings. If they have to stop, their draft is waiting for them.
-
Datasheets to download
Six product sheets, as text, spreadsheet or PDF, with an indicative price excluding tax. The buyer has what they need for their file.
Design choices
For the commercial pages, the look of an execution drawing: blue grid, dimensions and title block. In the control room, the calm grey of a plant screen: colour only appears when there is an alarm.
- Archivo, in extended width, for headings
- IBM Plex Mono for measurements and references
- SteelBackground#EFF2F5
- GraphiteText#191D22
- Safety orangeAction#F3680F
- Blueprint blueLinks, drawings#154D8C
Measurements
Home page of the demo, on mobile and on desktop.
| Metric | Mobile | Desktop |
|---|---|---|
| Performance | 89 | 100 |
| Accessibility | 100 | 100 |
| Best practices | 100 | 100 |
| SEO | 100 | 100 |
| Largest Contentful Paint (LCP) | 2,075 ms | 514 ms |
| Transferred size | 183 KB | 183 KB |
Measured on 3 October 2026 with Lighthouse 13 (default profiles), page served compressed from a local server, as in production.
Built with AI
Design, art direction and checks by me. Code and content produced in collaboration with AI agents, then reviewed and tested.
How I work with AIOther case studies
Let’s talk about your project.
Tell me what you do and what you need. I reply within one business day.
You talk to me directly
Mike SOBTAMFO · engineer · Cameroon (UTC+1)