The CIP-015 landing page.
Industrial Defender secures the control systems behind power utilities and other critical infrastructure in the US. When NERC introduced CIP-015, a new standard for internal network security monitoring, they launched a product for it and needed a landing page. I led the design at Akka Studio.
[ROLE] Design lead, Akka Studio [WHEN] September to October 2026 [WHERE] United States, remote [WITH] Hristijan, CEO of Akka StudioWhat the page had to do
Industrial Defender already had a CIP-015 page. The message and the product stayed the same, and the brief was to restructure the page and give it a visual language that fits the product.
Akka Studio, with Industrial Defender’s team.
The message, the purpose and the brand orange.
The structure, the typography and the visual language.
HristijanClient lead. Brought in the project and managed the relationship and the calls.
Client teamReviewed each design round.
OgnjenDeveloper. Built the page in Webflow.
MeDesign lead. Page design, 3D and animation.
Brand orange #FF5E13 Brand black #13120E TypeSwitzer and Geist Mono
StructureHero, steps, roles, data, the requirement table, proof, quote, call to action, footer
Referencesui.io for scroll behaviour, armadin.com from the same industry
BackgroundDark in the first round, light after client review
Five early directions.
Three hero concepts (Instrument, Split ledger and Circle) and five layout variants, all built on the same 3D scene: a PLC that pulls back to show the whole substation, with the anomaly marked in brand orange.
The camera moves through a wireframe substation and the anomaly lights up in orange.
The whole plant flattened into one drawing, read the way an engineer reads a schematic.
Devices as vertical marks on a grid, the signal arcing between them.
The headline beside the 3D on a light ground.
Headline centred, a dial turning underneath it.
The final page.
The headline states what the product does. Behind it, the substation is a real-time 3D scene running in the browser.
The six steps of the workflow: scope, detect, prioritize, evaluate, retain and protect. Each step is drawn as you scroll. The section went through three visual variants.
The same alert shown twice: as the operator handles it, and as the evidence record an auditor opens later.
Three roles, the OT engineer, the security analyst and the compliance manager, each with its own animated illustration.
The Purdue model. Level 1 is where the monitoring data comes from, so the section explains it and shows each layer.
Requirements R1.1 to R3, each matched to a capability the customer can demonstrate.
The closing section: what changed, what it means and how it was handled.
The footer, set over a field of substations.
Every asset drawn for the page.
A homepage section for the launch.
I designed ten proposals in Figma and Hristijan selected two. Both went to the client as animated 3D on a staging link, with a mockup of the homepage showing the section in place. The client is deciding between them.
Option A
Ready for CIP-015, centred, with the call to action under it
Option BNERC CIP-015 set large over the field of substations
