Airport Security Inspector Project Report
1. The Concept
Airport Security Inspector is a premium mobile-first airport checkpoint simulation game where players inspect passengers, validate travel documents, scan luggage through an X-ray machine, and decide whether each passenger should be approved, rejected, or manually searched.
I chose this concept because it is more demanding than a simple static web app. It tests layout design, state management, random gameplay generation, progression systems, saved data, mobile responsiveness, and visual polish. The goal was to create something that feels closer to a commercial mobile game than a basic website.
2. The Stack
The Stack: HTML5, CSS3, and vanilla JavaScript.
The project does not use a framework or game engine. The interface, screen transitions, gameplay logic, local save system, X-ray scanner interactions, level progression, and UI state are all handled with plain JavaScript and CSS.
The AI Assist: ChatGPT/Codex was used throughout the planning, implementation, debugging, visual polish, asset organization, and QA process. Image generation was also used to create higher-quality passenger character artwork so the game did not rely on simple placeholder drawings.
3. The 1 Day Sprint
Morning (Hours 1-3): We started by defining the game concept and core screens: Home, Level Select, Gameplay, Pause, Tutorial, and Result. The first implementation focused on building the basic HTML/CSS/JavaScript structure, wiring the level flow, adding passenger generation, luggage items, document checks, scoring, timer, accuracy, coins, and localStorage progress.
Afternoon (Hours 4-6): The main work shifted to UX/UI. The first versions were overcrowded, visually exhausting, and had many layout problems: overlapping HUD text, clipped buttons, crowded reward panels, bad navbar alignment, and gameplay sections competing for attention. We spent this phase repeatedly comparing screenshots against the target reference, tightening spacing, rebuilding the gameplay layout, improving scanner presentation, and adding better generated passenger artwork.
The Finish Line (Hour 7-8): The final stretch focused on stabilizing behavior and cleaning up the project. We fixed the confusing Play behavior so it quick-starts the latest unlocked level, kept Level Select available from the navbar, added a Reset Progress control to clear old localStorage unlocks, removed unused placeholder assets, verified image references, and added project documentation.
4. The Roadblocks
Roadblocks: The biggest roadblock was UI polish. The gameplay logic worked earlier than the visual design did, but the UI repeatedly broke under mobile constraints. Text clipped inside HUD cards, navbar icons doubled when baked artwork and live UI overlapped, reward panels showed duplicated titles, and action buttons looked squeezed or unprofessional.
Another major issue was saved progress. Because the game stores progress in localStorage, old test data made levels appear auto-unlocked even after the code changed. This made the game feel broken until a Reset Progress option was added.
The asset pipeline was also a challenge. Simple generated placeholder avatars did not match the premium game style, so proper transparent passenger artwork had to be generated, processed, wired into gameplay, and used for passport photo mismatch logic.
5. Key Takeaways
What worked best? The core game logic and level variety. The project now supports multiple inspection types, including luggage threats, document mismatches, expired passports, wrong destinations, electronics, VIP rules, suspicious behavior, fake IDs, and boss-style levels.
What worked worst? The UI iteration loop. Small mobile screens made every element fight for space, and several attempts to use image-backed UI panels caused duplicated text or bad scaling. The project needed stricter layout discipline earlier: fewer competing elements, more fixed aspect ratios, and clearer separation between baked artwork and live text.
My final thought: If I had one more day, I would run full visual QA with automated screenshots at 360x800, 390x844, and 430x932, then tune every screen from those captures. I would also generate a larger passenger set, add more luggage tray variations, and polish the home screen further so it fully matches the premium reference quality.