ARKO
I designed the sidebar experience, visual language, and brand for a developer-first security tool. Three-person team: the founder (an active CISO), one developer, and me.
DevSecAI shifted from a heavyweight enterprise dashboard to a developer-first product that meets engineers inside their editor. The company needed everything visual and strategic built from zero.
I joined as the first and only designer, working directly with the founder and one developer. Equity-free arrangement. Direct mentorship from a CISO in exchange for full design execution.
Security tooling that developers ignore is not security tooling.
Traditional SAST tools produce long lists of generic severities. Developers skim and move on. AI-assisted coding increases velocity, which means security debt compounds faster.
The product hypothesis: if the tool reasons about architecture and returns one obvious next action, developers fix issues before merge.
My design challenge: earn trust inside a 300px-wide sidebar panel, while producing enterprise marketing that convinced CISOs the same product was worth procuring at scale.
ARKO scans a codebase using an AI pipeline, builds an architectural threat model, and returns prioritized findings with plain-language fixes. The sidebar is the entire product surface for the extension.
Every decision was shaped by two constraints: 300 pixels of width, and developers who close panels they do not trust.
One mental model, reinforced everywhere. The Hackable Score color scale drives the gauge stroke, status pill, pulse speed, bar fills, and README badge.
Single HTML/CSS/JS string injected as a VS Code webview. All styles inline in TypeScript. No bundler. Pure CSS variables and DOM manipulation.
ARKO shipped to the VS Code and Cursor extension marketplaces. Visit devsecai.io for more information. The company received a £750k investment offer, declined because the investor required too large a stake in the company.