Hybrid Escape Room

Novacap: Operation Breach Containment

Abstract black and white geometric design with looping patterns.

An educational cybersecurity escape room designed to teach phishing detection, password security, social engineering awareness, and critical decision-making through immersive gameplay.

Project Overview

Role: UX Designer & Vibe-coder

Duration: 12 Weeks

Team: 6 Students

Tools: Figma, FigJam, Notion, Codex

Methods: Interviews, Personas, Journey Maps, Usability Testing

Outcome: Playable cybersecurity escape room with measurable learning improvements

The Challenge

Many people understand cybersecurity risks in theory but struggle to apply safe behaviours in real-world situations. Our challenge was to design an engaging educational experience that teaches cybersecurity concepts through realistic decision-making rather than traditional training materials.

My Role

I contributed across research, design, development, project management, and team collaboration throughout the project.

  • Contributed to user research, interviews, affinity mapping, persona creation, and journey mapping.

  • Developed and refined the browser-based prototype using HTML, CSS, JavaScript, and AI-assisted vibecoding workflows.

  • Planned and facilitated usability testing sessions, analysed feedback, and implemented iterative improvements.

Team: 6 Members • Duration: X Weeks • Weekly Sprint Meetings: 1–2 per week • Project Tracking: Notion • Collaboration: Figma, FigJam, Google Meet

Research Highlights

To understand users' cybersecurity knowledge, behaviours, and learning preferences, we conducted a combination of user interviews and an online survey. This mixed-method approach helped uncover both qualitative insights and broader behavioural patterns, ensuring design decisions were grounded in real user needs rather than assumptions.

🎤 User Interviews

  • Explored participants' experiences with cybersecurity threats.

  • Investigated behaviours around passwords, phishing emails, and online safety.

  • Identified frustrations, motivations, and learning preferences.

📋 Online Survey

  • Gathered quantitative data from a wider audience.

  • Measured cybersecurity awareness, habits, and confidence levels.

  • Validated patterns identified during interviews.

Key Insights

📌 Users understood common cybersecurity risks but often failed to apply safe behaviours in practice.

📌 Password reuse and weak password habits were more common than expected.

📌 Many participants struggled to confidently identify phishing attempts under pressure.

📌 Users preferred interactive, scenario-based learning over traditional educational content.

📌 Realistic simulations were seen as more engaging and memorable than passive training methods.

Defining the Problem

How might we create a cybersecurity learning experience that helps users recognise and respond to threats under realistic pressure?

Learning Goals

  • Detect phishing attempts

  • Create strong passwords

  • Recognise social engineering

  • Evaluate digital evidence

  • Make decisions under pressure

Ideation

For the Ideation stage, we started by doing a brainwriting session and creating a cognitive mind map and SWOT analysis. After that, we created a storyboard and selected the best idea based on an evaluation matrix and dot voting.

From Sketches to Prototype

The prototype phase began with a series of hand-drawn lo-fi sketches, and then establishing the Digital Game Flow Design & Moodboard to start vibecoding the game.

“Amine have done a great job in very short period of time. All my preferences and ideas were put together in perfect way and beautiful website.”

Kateryna Sierova - Photographer

Young woman taking a mirror selfie in a room with beige curtains, a bed with blue and white bedding, a white dresser, and a staircase leading outside.
A young man smiling in front of a microphone with a colorful screen in the background.

“I am thrilled to share my experience working with an outstanding web designer Amine From the moment I engaged their services, I knew I was in capable hands. Their expertise in web design is unparalleled, and I could not be more pleased with the results.”

Sheikh Adiat - SMMA Agency

“Absolute pleasure working with Amine. Great communication, a driven developer and excellent service delivered consistently.”

Joshua Romao - Agency Owner

Green background with large initials 'JR' in dark green.

CONTACT US

CONTACT US

Have a design project in mind? Send me a message, and I’d be thrilled to discuss it with you! I’m excited about new challenges and look forward to connecting!