Project Overview


SAFR

SAFR is a secure and accurate AI facial recognition platform, designed for RealNetworks.

Overview

Problem Definition


How to protect properties from unwanted visitors?

Criminal activity, especially burglary has always been a big problem and concern in our society — and is on the rise once again. According to FBI, a burglar strikes every 30 seconds in the US.

The average loss from a burglary is $2,661. Stolen items can’t always be replaced, as many of them hold an important sentimental value to us. But material damage, of course, is not the worst thing that can happen when someone trespasses.

Having said that, how do we prevent these activities and protect our properties and most importantly — human lives?

Process


Design thinking

With the design thinking process, the goal was to identify types of users, jobs-to-be-done and latent needs.

Discovery

• User interviews

• Personas

• Journey mapping

• Competitive analysis

Ideation

• HMW questions

• User flows

• Wireframes

• High-Fidelity design

Prototyping

• Prototyping

Testing

• Usability testing

Implementation

• Final design

• Design handoff

Discovery


User interviews

I interviewed two groups of participants, those who represent two different types of users: property visitors (end users) and potential app users (security guards). These were the findings.

Property visitors (end users)

Participants shared the need for a solution that would allow them to enter a physical space without the need to use a card, a key or a password.

App users (security guards)

Due to a large scope of their work, the sentiment was that they would like to spend less time monitoring video surveillance because it’s way too time-consuming. They would like to be more productive, and focus on their other duties, such as performing inspections, preventing criminal activity and reporting incidents.

Persona

Given that are two types of users of this product, I created two personas based on user interviews that I’ve conducted, that showcase their specific pain points, tasks and goals.

Journey mapping

In this journey map, I refer to the persona (property visitor) defined earlier and thus layed out their experience in a scenario where they visit a school property.

Competitive analysis

While competitors with machine learning and computer vision capabilities offer most features considered for this project, their products usually just offer SDKs and APIs to their customers, without having a web app.

Ideation


How Might We

I created How Might We questions that helped us better align on user’s tasks and goals:

  1. How might we provide a safer and seamless experience of entering a room for property visitors (end users)?

  2. How might we provide a platform where monitoring video surveillance is automated so that security teams don’t have to manually do it and can focus on other duties?

Wireframes

When I started ideating, my main focus was information architecture. As pictured below on the Overview page, I was unsure of what information we should surface to users and where that information should appear.

User flow

In this phase of the process, I explored what the user flow of potential solution could be while focusing on app users and how they might want to accomplish their goals.

Testing


Usability testing

Usability testing showed that participants easily navigated the prototype and found key information, such as Events and Camera, leading to a high task success rate.

Solution


Face detection and unlocking

AI facial recognition platform for live video that uses advanced technologies like machine learning and computer vision to detect faces and unlock important entrances in real-time. It is completely unbiased — it accurately recognizes all skin tones, genders, and even works seamlessly with face masks.

Unlike physical authentication methods that can be lost, misused, or stolen, face recognition offers optimal security and user convenience. The technology is proven to be 98.87% accurate.

Types of users:

  • Property visitors (end users)

  • App users (security guards)

  • To ensure personal privacy, all enrolled and scanned biometric data is fully encrypted and does not contain any visual imagery of individuals’ faces. This helps to ensure that individuals identities are protected, avoiding any liability issues related to new and emerging privacy protection mandates.

Outcome


Final design

The functionality of the web app is built around user’s ability to monitor door entrances and act accordingly. Dark interface is chosen to improve readability and reduce eye strain to support viewing in dark environments which is the most common use case.

Design system

The design system I created aligns with WCAG standards, providing the right contrast between visual elements such as text and its background so that it can be read by people with moderately low vision. It was important to avoid contrast that is too high, which can cause strain on the eyes.

Pictured below are some of the responsive web components, based on the atomic design methodology.

Screens

The following images demonstrate how the web app functions in a school setting.

Recognition

Camera

Events

Face Recognition

Result


Impact

Metrics show that users are actively engaging with the product and smoothly completing workflows. Additionally, reports indicate a decrease in trespassing incidents in properties where this technology is implemented.

90%

incident reduction rate

87%

adoption rate (app users)

95%

engagement rate

Metrics

  • Incident reduction rate (90%) was calculated by comparing the number of trespassing incidents before and after the launch of the video surveillance system, over time.

  • Adoption rate (87%) was calculated by the proportion of users who interacted with the app out of the total user base, since launch.

  • Engagement rate (95%) was calculated by tracking users who performed meaningful actions in the app, such as monitoring camera and events, per month.

  • Data points (via Google Analytics):

    • Segments (to filter users)

    • Event Funnels (to track feature interactions)

    • Dashboards (to visualize and validate engagement)

Project Details


Project details

Role: Product Design, User Research

Client: RealNetworks

Team: Product Designer, Product Manager, Engineering

Tools:

  • Design: Figma, Miro

  • Project management: Jira, Confluence

  • Research: UserTesting.com

  • Analytics: Google Analytics

Year: 2020

Link: SAFR.com