Moving security training out of a service queue and into the customer's hands

Inside Human Firewall, every phishing simulation ends with training. The user clicks the simulated email, lands on a page, and gets a course attached to it. Long video, long text, the usual format.

People didn't finish it. Even after reminders, completion stayed low. The training felt forced, so people backed off.

There was a second problem underneath that one. We didn't have a way to make these courses ourselves. We used a third-party tool to build them, exported the SCORM package, and showed it to the client. Customer Success and the graphics team did that work.

This wasn't just something I noticed. It came up through the CTO, who handles client-facing escalations, as a recurring problem across accounts.

I was also seeing it on the ground, chasing the status of a single course, asking the graphics team about posters, the marketing team about video, Customer Success about client sign-off. For one course.

Admins on the client side wanted to do this themselves. They couldn't, because there was no tool to create a course and export a SCORM package. So they relied on us instead, and every handoff was a place for delay and miscommunication.

Course creation was one small part of a much bigger security job. It didn't need to take up a security team's attention, and it didn't need to sit with Customer Success either.

So the goal became simple. Give clients the tool to do it themselves, let AI handle the heavy parts of making content, and free up Customer Success for the security work that actually needs them.

We looked at two ways to lift engagement: conversational training, where the end user talks to an AI that teaches the topic, and flashcard training, swipe-based cards like Duolingo.

I built the conversational version to a full high-fidelity prototype in Cursor with Claude and tested it with real users. Engagement didn't move. Clients couldn't relate to it the way they related to a flashcard format they already understood.

So we made a sequencing call. Flashcards first, because people connect with them immediately. Conversational stays on the roadmap as a second engagement bet, to revisit once the flashcard format proves out.

When we tested card-based learning, the response was different. People were comfortable right away.

Every employee being enrolled had used Duolingo or something like it. They already knew how cards work, so the format didn't get in the way. Swipe forward, swipe back, learning cards and quiz cards mixed, a few minutes instead of a long module.

I approached this as an exploratory build, taking reference from Duolingo and other card-based learning apps to find the format that fit.

My first approach was to design the end result first, how the learner would see and swipe the cards. I spent the first two or three days getting that experience right.

Then I hit the problem. A finished-looking card is not an editable one. To let admins edit cards inline, and to reuse the card elsewhere in the product, I needed the opposite of what I had built.

So I changed the order. I went back to the base and built each component and each section inside the card first, then rebuilt the preview on top of that. Building it component-first is also why the code could later be reused as a module inside Human Firewall 3.

The AI does the work of structuring and drafting the cards. But nothing goes out until the admin pushes it.

The admin reviews the cards, edits, and only then presses Push to Training Cards. The training gets structured, the cards get generated, and it saves to their library. The admin is the one who decides it's ready.

Everyone's design taste is different, so the card editor gives real control. Each card has three components: title, body, and media. You can long-press a component and drag it up or down to reorder it. Select any text and a styling toolbar shows up right above it. You can upload your own media.

The freedom has a limit, and the limit explains itself. A line under the card says media takes space, text is limited to 200 characters, remove media for up to 500. The tradeoff is shown at the moment it matters, then it's the admin's call.

The admin building a course and the employee taking it aren't in the same headspace, so the two surfaces look different on purpose. The creator side is light and dense, built like a tool. The learner side is dark and calm, one card at a time. On mobile it's pure swipe: left, right, forward, back, however the user wants to move.

All of them use it regularly, enrolling their users with content personalised by role, designation, and level.

It started as its own product, designed and built end to end, and the engineering team brought the code directly into HF3.