Tanvir.
All work

Cybersecurity · Insurance · Product Design + Design System

Safemargins

Cyber insurance that answers the policyholder's questions first

The Safemargins overview on a soft lilac field: four headline numbers, the Safe Margins Index trend with a July hover, peer rank, ransomware readiness, attack surface grade and the action plan
Role
Sole UI/UX Designer
Scope
Dashboard · Security Center · Quotes · Claims · Chart widgets · Design system
Read
2 min

01/The project

Cyber insurance that shows its working

Safemargins is a cyber insurance platform from DTS Solutions. A company's cover, and what it pays at renewal, depends on how exposed it looks: what external scans find on its servers and domains, how its security questionnaires read, and how it compares with similar companies.

The person signing in is usually an IT or security lead with a short list of questions. Are we OK for renewal? What should we fix first? Is our cover enough? What happens if something goes wrong? I designed each page around one of them, so it's answered by a number or a chart before anything else.

I was the only designer on it, and the MVP has shipped. The work is under NDA, so this page shows a selection of it, with sample data in place of real customers.

  • 01Cyber insurance platform
  • 02Web app
  • 03Dashboard, charts and design system

02/At a glance

Where a policyholder starts

The overview reads top to bottom: four numbers, the index over time, peer rank, then what to do next and what's coming up.

Four numbers firstThe index, the attack surface grade, open actions and days to renewal sit in one strip, and each one links to the page that explains it.

03/Renewal

Am I OK for renewal?

The first question is about money. Renewal pricing follows the Safe Margins Index, a score from 0 to 1 built from scans and questionnaires, so the number had to make sense at a glance.

  • A score needs something to judge it by. The 0.70 renewal threshold is drawn on the trend, so being above it is visible before you read anything.
  • 0.82 means little without other companies. Peer rank shows the whole spread of 412 healthcare policyholders, the median, and where you sit.
  • Getting ready for renewal touches several pages. Readiness, grade, the action plan and the policy year each get a small card with one measure that fills.
The line to stay aboveWith the threshold drawn in, the distance to it reads first. Hovering a month adds the peer median.
Where you sitYours is the dark bar. Seeing the whole spread of peers makes the 94th percentile mean something.
Progress you can countEach card counts in its own unit: questionnaire ticks, a grade scale, a square per recommendation, a column per monthly scan, a mark per week of the policy year.

04/Fix first

What should we fix first?

Next comes what to fix. Scans find a lot, so the few things that actually move the index come first, and each fix has a clear end.

  • A list of risks doesn't say which matter. Risks are grouped by severity, and recommendations are ranked by how much each one lifts the index.
  • Knowing what to fix isn't knowing how. Each recommendation opens with why it matters, the evidence, the steps, and a vendor that can help.
  • Resolving something should feel finished. Marking it resolved moves it to the resolved list and says when the index will update.
Open it, fix it, close itA drawer, not a new page, so the list stays in view. Resolving says the index updates after the next scan.
Fewer each monthOpen risks after each monthly scan show whether fixes are landing. Hover splits the latest by severity.
Where the hosts areHosts per environment on one scale, open risks beside each, so you can see where problems cluster.

05/Cover

Is our cover enough?

This is where security and insurance meet. A policy limit only means something next to what an incident could cost, so these charts put the two side by side.

  • A $1M limit is abstract. The loss curve marks the limit, and everything above it, the part the company would pay itself, shows in amber.
  • Quotes compared on price alone mislead. Premiums are shown per $1M of cover on one scale, with today's policy as the reference.
  • Not every kind of loss is covered the same. Exposure against insurance splits first and third party, financial and tangible, so the gap has an address.
Move a slider, see the costMore records, more exposure. The curve redraws as you drag, and the amber part above your $1M limit grows with it.
Price per $1MEvery ready quote per $1M of cover, so they compare fairly, with today's premium as the reference.
Where the gap isFirst-party financial loss carries the biggest uninsured gap, $1.4M.

06/Claims

When something goes wrong

Someone filing a claim may be in the middle of an incident. So the form tells them what to do right now before it asks for anything, and submitting it says exactly what happens next.

  • Mid-incident, a form comes second. First steps and the response line sit beside the form, and saying the incident is ongoing brings up the hotline.
  • After sending, people need to know what's next. The confirmation gives a reference and the steps over the next day, starting with when a claims lead will call.
File, then know what's nextNothing to look up mid-incident: first steps sit beside the form, and the confirmation lays out the next day.

07/Widgets

Risk in dollars

The risk quantification and assessment reports put risk in dollars. I designed their chart widgets as components with resting and hover states, on the app's own colours and type. Here are three.

  • Probability curves are hard to read. Each curve is labelled at its peak, and the hover answers one plain question, like the chance of losing more than $2M.
  • A comparison is only honest on one scale. The company and the industry benchmark always share an axis.
Today, after fixes, and peersOne shared axis makes the effect of fixes visible as a shift. Expected, low and high losses sit beside them.
Chance of a lossThe yearly chance of losing at least a given amount, against the benchmark.
Maturity over timeThe control maturity score by month, with the target line at 800.

08/Looking back

Start from the question

The decision that shaped everything was starting from the questions a policyholder brings, not from the data the platform holds. Scans, questionnaires and policy records produce far more than anyone needs to see, so each page answers its question first, with the detail one click away.

The company, people, prices and claims shown here are sample data I wrote so the numbers tie out.

More work

All work →