Spacture.ai 18-Day Redesign

18-DAY REDESIGN SPRINT

Spacture.ai

Redesigning an AI-powered surveillance experience for the people who actually use it.

Project

Mobile App Redesign

Role

UX/UI & Product Designer

Timeline

18-Day Design Sprint

Focus

System Design & Hierarchy

PRODUCT CONTEXT

Spacture.ai is an AI-powered surveillance experience designed to help teams make sense of security information, cameras, incidents, people, and analytics from a mobile interface.

The redesign started with an existing app that worked as a product, but lacked a cohesive experience. The challenge was to rethink the interface, resolve inconsistencies, establish a stronger visual system, and make complex surveillance information easier to understand and navigate.

THE CHALLENGE

An 18-Day Redesign Challenge

I started with an existing Spacture.ai mobile experience and a limited amount of time to rethink it. Rather than redesigning isolated screens, I looked at the product as a system:

How should users move through the app?
What information deserves priority?
Where were the existing inconsistencies?
How could the interface become more cohesive?
How could a complex surveillance product feel easier to use?

The goal was not simply to make the app look newer. The goal was to make the experience clearer, more consistent, and easier to navigate.

18-DAY SPRINT TIMELINE

PHASE 01

Define

Direction & Goals

PHASE 02

Audit

Identify Friction

PHASE 03

Explore

Visual System

PHASE 04

Design

Mobile Specs

PHASE 05

Refine

Polish Details

EXISTING EXPERIENCE AUDIT

The App Worked. The Experience Needed Work.

The first step was studying the existing interface and mapping recurring patterns that created friction.

ISSUE 01

Inconsistent visual language

Different screens did not always feel like parts of the same product.

ISSUE 02

Weak information hierarchy

Important information competed for attention with secondary content.

ISSUE 03

Fragmented navigation

The experience did not make it obvious where the user was or where they should go next.

ISSUE 04

Inconsistent components

Controls, cards, buttons, and surfaces lacked a unified system.

ISSUE 05

Dated visual treatment

The interface needed to meet expectations of a modern AI/security product without sacrificing clarity.

THE KEY REALIZATION

“The problem wasn't one bad screen. It was the lack of a system connecting the screens.”

Shifted the project from a collection of screen redesigns into a system-level redesign.

TARGET AUDIENCE

Who Was I Designing For?

Retail Store Owners

OVERVIEW

Need a quick understanding of what is happening in their environment without inspecting every detail.

Security Personnel

ACTION

Need fast access to cameras, incidents, people, and actionable information.

Business Analysts

ANALYTICS

Need structured information and analytics that help understand operational patterns.

IT & Security Teams

SYSTEM

Need visibility into system status, user roles, configurations, and security health.

“Design Implication: They share one fundamental need — complex information must become easy to scan and act upon.”

DESIGN OBJECTIVE

Three Things Had to Change

Make navigation easier

Create clearer relationships between the major product areas.

Establish a visual system

Create a common language for typography, color, surfaces, controls, and interactions.

Make complex info scannable

Prioritize information so users can understand what matters without processing everything at once.

07 — 08

VISUAL TONE & TYPOGRAPHY

Establishing the Visual Language

Dark Technical Aesthetic

The visual exploration focused on creating a darker, technical, premium interface appropriate for an AI surveillance product:

Dark Surfaces Purple/Blue Accents High-Contrast Type Rounded Cards Clear Status States

Typography as Hierarchy

Typography was used deliberately to separate page information, primary values, metadata, and status alerts:

Page Title / Primary Values

Section Headers / Action Tags

Supporting Metadata & Timestamps

ONBOARDING & AUTHENTICATION FLOW

Entry & Identity Management

STORE SETUP & CAMERA PAIRING FLOW

Hardware Pairing & Configuration

11 — 16

PRODUCT AREA BREAKDOWNS

One Product. One Visual Language.

11 · DASHBOARD

Start with what matters

Entry point focusing on clear hierarchy, compact scannable cards, top priority alerts, and fast navigation to major product areas.

12 · SURVEILLANCE & CAMERAS

From feeds to usable information

Structures feeds into a clear relationship: Camera content → Context → Status → Action.

13 · INCIDENTS

Make important events easy to find

Clear hierarchy separating event info, timestamp, location, severity status, and action workflows.

14 · ANALYTICS

Complex information should be easy to read

Visual grouping, card containers, and data visualization elements designed for fast trend interpretation.

15 · WATCHLISTS & PEOPLE

Organizing dense info without overwhelming

Clear structures for profiles, list view states, risk tags, and identity actions.

16 · SETTINGS

Consistency should survive all the way to the edges

The same visual and component rules carry into configuration screens for predictable usability.

16.1

CORE SURVEILLANCE & LIVE FEEDS

Dashboard & Live Camera Feeds

16.2

AI SEARCH & INCIDENT DETECTIONS

Natural Language AI Search & Event Detections

16.3

SECURITY WATCHLISTS & SYSTEM ADMIN

Watchlists, Directory & System Settings

BEFORE & AFTER

5 Major System Changes

01 · NAVIGATION

Before: Less predictable section relationships.

After: Clear product structure and predictable navigation hierarchy.

02 · INFORMATION HIERARCHY

Before: Competing elements fought for attention.

After: Primary, secondary, and metadata clearly separated.

03 · UI COMPONENTS

Before: Inconsistent repeated UI patterns.

After: Reusable unified component system across all screens.

04 · VISUAL LANGUAGE

Before: Screens felt visually disconnected.

After: Color, typography, surfaces & spacing work together.

05 · OVERALL EXPERIENCE

Before: Functional collection of separate screens.

After: Cohesive mobile product experience.

18 — 21

KEY DESIGN DECISIONS

4 Strategic Design Decisions

DECISION 01

Prioritization over volume

Show the most important information first, then provide depth when the user asks for it.

DECISION 02

Consistency over novelty

Prioritize reusable patterns so familiar interactions reduce the amount users must learn.

DECISION 03

Scan, then investigate

Support quick overview scanning, then seamless transition into deep item investigation.

DECISION 04

Visual system supports content

Dark surfaces and indigo accents exist to create clarity, hierarchy, and recognition.

REFLECTION & LEARNINGS

AI Products Are Not Only About AI

The key design challenge was deciding how to structure complex information around the humans operating the system.

01. Systems thinking matters

Redesigning one screen is easy. Making 20+ screens feel like one cohesive product is much harder.

02. Hierarchy > Density

A product can contain a lot of data without displaying everything at equal visual priority.

03. Consistency creates usability

A unified component system reduces the amount of cognitive interpretation users must do.

04. Constraints force prioritization

The 18-day timeline made it necessary to focus on changes that created systemic value.

FINAL REFLECTION

“The goal wasn't to make Spacture look newer.
It was to make the complexity of surveillance feel simpler.”

Spacture.ai became an exercise in turning a collection of screens into a more coherent product experience — where navigation, hierarchy, visual language, and interaction patterns work together.

Spacture.ai · Mobile App Redesign

Ready to explore another case study?

Safexit iOS App

INDEPENDENT UX/UI CASE STUDY

Did I Lock
the Door?

Designing for the uncertainty that happens after we leave home — a digital memory system for repetitive actions.

⏱️ 8:57 AM — Commute to work

“Wait… did I actually lock the door?”

You lock it every day. But today, the memory is missing. Uncertainty sets in.

SAFEXIT VERIFIED 8:57:12 AM

✓

Front door

Locked

8:42 AM

Confirmed

Uncertainty resolved in 2.1 seconds.

Project

Independent UX/UI Project

Role

UX/UI Designer

Focus

UX Research & Product UI

Tools

Figma · Interactive Prototyping

OVERVIEW

The Strangely Specific Moment

There is a strangely specific moment that happens to a lot of people.

You leave home. You lock the door. You walk a few minutes down the road. And suddenly:

“Wait… did I actually lock the door?”

You try to remember. You replay the moment in your head. You know you usually lock it, but you can't confidently remember whether you did it today.

So you check. Or turn around. Or call someone. Or continue walking while wondering whether you should go back.

Core Question

“Can we design an experience that gives people confidence about actions they've already taken?”

THE PROBLEM

We Don't Always Forget. Sometimes We Just Aren't Sure.

COMMONLY ASSUMED PROBLEM

“I forgot to lock the door.”

Frames the issue as personal carelessness or cognitive failure. The assumption is that the action wasn't completed.

THE ACTUAL FRICTION

“I don't know if I locked the door.”

The person may have completed the action correctly. The friction is that they have no reliable evidence to confirm it after leaving.

THE UNCERTAINTY LOOP

Action → Leave Home → Doubt Appears → Memory Reconstruction → Uncertainty → Check / Verify

THE REFRAME

Shift From Control System to Confidence System

TRADITIONAL SMART-HOME PRODUCTS

Control System

Focuses on active control: remotely locking doors, toggling appliances, adjusting lights, and automating routines.

Core question: “How can we automate this task?”

SAFEXIT APPROACH

Confidence System

Focuses on reassurance: helping people confidently know that an action has already been completed without requiring heavy interaction.

Core question: “How can we help people confidently know it's already done?”

04 — 05

RESEARCH & METHODOLOGY

Understanding Behavioral Patterns

Research aimed to understand the behavioral mechanisms behind routine uncertainty rather than simply validating that people forget things.

1. Routine

What do people normally do before leaving? Which tasks are completely automatic?

2. Uncertainty

Which actions cause the most doubt? When exactly does doubt appear?

3. Response

Do they go back home? Call someone? Or mentally replay their actions?

4. Technology

What information would make a digital confirmation believable and trustworthy?

PARTICIPANT DATA PLACEHOLDER

[Insert actual participant numbers & demographics here]

RESEARCH FINDINGS

4 Core Behavioral Patterns

PATTERN 01

Repetitive actions become automatic

Locking doors, turning off stoves, closing windows happen daily. Because the sequence is familiar, people remember the general routine rather than the specific instance.

PATTERN 02

Doubt appears after leaving

Uncertainty rarely happens while performing the action. It strikes 10–15 minutes later during the commute when physical verification is difficult.

PATTERN 03

Memory reconstruction fails

People attempt to recall standing position, key sounds, or what they held. However, reconstructed memory fails to provide 100% confidence.

PATTERN 04

Physical verification as fallback

When memory fails, people seek physical evidence: turning back home, messaging flatmates, or checking camera feeds.

CENTRAL DESIGN INSIGHT

“Repetition makes actions easy to perform — but difficult to remember.”

The product shouldn't ask users to remember better. It should give them something reliable to remember from.

08 — 09

FRAMING & HMW

PROBLEM STATEMENT

People perform important household actions as part of repetitive routines, but because these actions become automatic, they later struggle to confidently remember whether they completed them today. This uncertainty creates unnecessary mental load and leads to repeated checking or disrupted routines.

HOW MIGHT WE

“How might we help people confidently verify important actions they've already completed after leaving home?”

DESIGN PRINCIPLES

Guiding Experience Principles

1. Confirmation over reassurance

EVIDENCE

Provide concrete evidence (exact timestamps, status states) rather than vague reassuring phrases like "Everything looks good".

2. Answer immediately

ZERO FRICTION

When someone opens the app in panic, the status must appear on screen 1 in under 2 seconds. Zero multi-tap navigation required.

3. Don't create false certainty

HONESTY

If a sensor is unverified or offline, explicitly state "Unable to confirm". Never show a false green checkmark.

4. Minimise interaction

CALM UX

The user wants to confirm "Did I do it?" and exit. The product respects user attention and minimizes screen time.

11 — 12

CONCEPT & CORE SCENARIO

The Commute Scenario Walkthrough

8:42 AM

Action Recorded

User locks the front door. Safexit passively registers the event timestamp: Front door · Locked · 8:42 AM.

8:57 AM

Doubt Strikes

Halfway to work. The user wonders: “Did I lock the door?” Instead of turning around, they open Safexit.

8:57:02 AM

Instant Peace of Mind

The app immediately displays HOME SECURED. Front door: Locked (8:42 AM). Uncertainty resolved instantly. User closes app and continues their day.

13 — 14

IA & USER FLOW

Streamlined Information Structure

Home

Current state of key leaving-home actions. Primary landing screen.

Activity

Chronological log of recent household events & timestamps.

Detail

Detailed status, sensor connection, and manual verification notes.

THE CONFIRMATION MODEL

The 3-Pillar Verification UI Rule

EVERY ITEM MUST COMMUNICATE EXACTLY THREE ELEMENTS

01. WHAT

The Object

Front Door, Kitchen Gas, Balcony Window

02. STATUS

State Verification

Locked, Switched Off, Closed

03. WHEN

Timestamp

Confirmed at 8:42 AM

16 — 17

EXPLORATION & WIREFRAMING

Comparing Concept Directions

DIRECTION A — REJECTED

Smart-Home Dashboard

Treats product as control system with toggles and sliders. Cluttered when user only wants fast reassurance.

DIRECTION B — REJECTED

Pure Timeline

Chronological history. Requires scrolling and cognitive scanning to find door status.

DIRECTION C — SELECTED

Status-First Experience

Prioritises current state & recent leave-home verification directly on screen load.

ONBOARDING & PROFILE SETUP

Onboarding & Verification Flow

18.5

HARDWARE PAIRING & LOCK SETUP

Hardware & Camera Pairing Flow

MAIN INTERFACE & DASHBOARD

Core Interface Screens

19.5

FAMILY ACCESS & LOCK SETTINGS

Multi-User Access & Lock Control

EDGE CASES & HONEST UNCERTAINTY

Designing for Edge Cases

⚠️ ACTIVE ISSUE

Something needs attention

Kitchen stove

Still on · Detected 8:51 AM

Provides immediate alert banner without hiding the issue.

❓ UNVERIFIED

Unable to confirm

Balcony window

Sensor offline · Check manually

Transparent honesty prevents false sense of security.

⏳ STALE STATE

Older timestamp

Last confirmed

8:42 AM (3 hours ago)

Explicit time delta ensures user evaluates freshness.

TRUST & TRANSPARENCY

Specificity Creates Confidence

Vague status indicators like "Door: OK" leave room for doubt. Explicit status data ("Front door · Locked · Confirmed at 8:42 AM") provides the cognitive grounding required to eliminate anxiety.

22 — 23

USABILITY TESTING

Evaluating Reassurance Efficiency

TASK 01

Verify Door Lock

“You left home and aren't sure whether you locked the door. Show how you check.”

TASK 02

Appliance Verification

“You're unsure whether you switched off the iron. Find out.”

TASK 03

Trust Assessment

“Look at this screen. Tell me whether you believe your home is secure.”

[Insert actual usability-test results, completion times & user quotes here]

24 — 25

ITERATION & FINAL SOLUTION

From Smart-Home Dashboard to Confirmation Tool

EARLIER ITERATION

Control-focused Dashboard

Contained sliders, temperature controls, and multiple tabs. Required users to scan through device lists when looking for quick verification.

FINAL DIRECTION

Confirmation-first Experience

Prioritises the exact evidence users seek during post-departure doubt. Resolves uncertainty in seconds.

26 — 27

REFLECTION & TAKEAWAYS

Key Product Design Takeaways

01. Small problems contain rich UX opportunities

A momentary panic ("Did I lock it?") seems trivial, but cumulative daily anxiety has a measurable impact on wellbeing and routines.

02. Lack of certainty ≠ Forgetfulness

Reframing the problem from "user forgot" to "user lacks evidence" shifted the entire product architecture from control to reassurance.

03. Trust is an interaction problem

Trust isn't built with slick visuals. It's built with timestamp specificity, honest uncertainty, and immediate access to evidence.

04. Good UX often means removing interaction

The ideal outcome isn't maximizing app engagement time. It's enabling the user to confirm their state and leave the app in 3 seconds.

FUTURE EXPLORATIONS

Next Steps & Ecosystem Integration

Smart Lock & Sensor APIs

Integrating Matter protocol and Apple HomeKit for passive detection without manual logging.

Location Geofencing

Automatically surfacing leaving-home status widget on lock screen when leaving 100m geofence.

Local Privacy Architecture

Ensuring household verification data is processed strictly on-device for user privacy.

FINAL REFLECTION

From “I think I did it.”
to “I know I did.”

Technology shouldn't demand more of our attention. It should quietly record what matters and give us confidence when we need it most.

“The goal isn't more automation. It's less uncertainty.”

Interaction Designer

& Bike Rider

Selected work

Spacture.ai

KiranaPro

Safexit

Some Cool Visuals

About Me

02. What's Next?

Let's work together.

Interaction Designer

& Bike Rider

Selected work

Spacture.ai

KiranaPro

Safexit

Some Cool Visuals

About Me

02. What's Next?

Let's work together.

KiranaPro

Order Flow and design for KiranaPro

Here's a little sneak peak 👀

The Project

Challenges

Colour Scheme

Typography

Also did some fun stuff

And here's how it turned out to be!

Ready to see more?

Spacture.ai 18-Day Redesign

Spacture.ai

An 18-Day Redesign Challenge

The App Worked. The Experience Needed Work.

Inconsistent visual language

Weak information hierarchy

Fragmented navigation

Inconsistent components

Dated visual treatment

“The problem wasn't one bad screen. It was the lack of a system connecting the screens.”

Who Was I Designing For?

Retail Store Owners

Security Personnel

Business Analysts

IT & Security Teams

Three Things Had to Change

Make navigation easier

Establish a visual system

Make complex info scannable

Establishing the Visual Language

Dark Technical Aesthetic

Typography as Hierarchy

Entry & Identity Management

Hardware Pairing & Configuration

One Product. One Visual Language.

Start with what matters

From feeds to usable information

Make important events easy to find

Complex information should be easy to read

Organizing dense info without overwhelming

Consistency should survive all the way to the edges

Dashboard & Live Camera Feeds

Natural Language AI Search & Event Detections

Watchlists, Directory & System Settings

5 Major System Changes

4 Strategic Design Decisions

Prioritization over volume

Consistency over novelty

Scan, then investigate

Visual system supports content

AI Products Are Not Only About AI

01. Systems thinking matters

02. Hierarchy > Density

03. Consistency creates usability

04. Constraints force prioritization

“The goal wasn't to make Spacture look newer. It was to make the complexity of surveillance feel simpler.”

Ready to explore another case study?

Safexit iOS App

Did I Lock the Door?

The Strangely Specific Moment

We Don't Always Forget. Sometimes We Just Aren't Sure.

“I forgot to lock the door.”

“I don't know if I locked the door.”

Shift From Control System to Confidence System

Control System

Confidence System

Understanding Behavioral Patterns

4 Core Behavioral Patterns

Repetitive actions become automatic

Doubt appears after leaving

“The goal wasn't to make Spacture look newer.
It was to make the complexity of surveillance feel simpler.”

Did I Lock
the Door?

From “I think I did it.”
to “I know I did.”