Trace
A cross-platform application designed to streamline the hospitality service cycle: table ordering via QR codes, live KDS screens for kitchen and bar powered by Firestore Realtime, and a demonstrative integrity mechanism for billing traceability.
01 / OVERVIEW
Bridging table service and kitchen operations seamlessly
Trace was developed as my final degree project (TFG) to resolve operational friction in hospitality: idle waiting times to order or pay, manual communication mistakes, and desynchronization between front-of-house staff and preparation stations (kitchen and bar).
I designed and built a complete system featuring two distinct environments: a frictionless guest interface accessible by scanning a table QR code without requiring app installation, and a synchronized real-time management dashboard with dedicated views for kitchen, bar, and administrators.
The project served as an applied software engineering initiative to implement reactive patterns using Angular Signals, distributed state synchronization with Firebase Firestore, and a demonstrative cryptographic chaining pipeline for invoice traceability.
02 / THE PROBLEM
Operational bottlenecks across dining rooms, bars, and kitchens
Traditional paper-and-verbal ordering workflows in small-to-medium restaurants suffer from recurring coordination and communication breakdowns:
Idle waiting times
Guests depend on waiter availability to view menus, reorder drinks, or request the bill, slowing table turnover during peak service hours.
Kitchen and bar desynchronization
Food and beverages often share a single printed ticket, requiring kitchen cooks and bar staff to manually coordinate preparation timelines.
Zero visibility on order status
Diners have no indication of whether their order has begun preparation, while staff lack a unified visual overview of elapsed preparation times.
Error-prone allergen communication
Verbal inquiries regarding food intolerances create dietary risks if items are not strictly filtered against active recipes during order placement.
Vulnerable billing traceability
Traditional point-of-sale setups struggle to provide tamper-evident proofs that tickets have not been retroactively altered or deleted after closing.
High adoption friction for diners
Forcing customers to download a heavy native app or register with credentials creates immediate drop-off at the table.
03 / THE SOLUTION
Dual architecture: frictionless guest access and synchronized KDS
Trace decouples the dining experience from staff management while synchronizing both in real time over Cloud Firestore:
Guest Interface (Comensal)
Instant access via table-linked QR/URL, transparent anonymous authentication, digital menu with reactive 14-allergen filtering, cart, and live order tracking.
Kitchen & Bar KDS
Dedicated Kitchen Display System screens that automatically partition food and drink line items, enabling cooks and bartenders to mark tickets as preparing or served.
Floor Administration
Central dashboard for managing active tables, updating menu items, monitoring service metrics, and generating print-ready table QR codes.
Technical Billing Engine
Order settlement with 10% VAT calculation, client-side PDF receipt generation, and a chained SHA-256 hashing log for auditability.
04 / PRODUCT FLOW
End-to-end journey: from table QR scan to settled bill
The service workflow was structured to maximize guest autonomy while giving staff real-time clarity at every stage:
End-to-end service cycle from table QR scan to tamper-evident invoice registration.
- 01Diner
Table QR Code
The diner scans the table QR containing the unique table identifier embedded in the URL.
- 02Diner
Anonymous Auth
Firebase Auth initializes an anonymous session; the assigned UID is linked to the active table.
- 03Diner
Digital Menu
Exploration of categories, descriptions, prices, and ingredients loaded reactively.
- 04Diner
14-Allergen Filter
Instant reactive filtering to exclude any dish conflicting with selected dietary intolerances.
- 05Diner
Table Cart
Item quantities and custom instructions calculated in real time with Angular Signals.
- 06Diner
Order Dispatch
Atomic creation of the ticket in Firestore with timestamp, table ID, and line items.
- 07Staff
Kitchen / Bar KDS
Kitchen food and bar drink lines are routed in real time to their respective station screens.
- 08Diner
Realtime Tracking
The customer watches live preparation status updates (received → preparing → served) on their phone.
- 09Diner
Bill Request
Payment notification sent directly to staff terminals alongside the itemized receipt preview.
- 10System
Settlement & Hash
Order closure, PDF generation, 10% VAT computation, and chained SHA-256 record hashing.
DEMO / VIDEO
Trace demo
Automated walkthrough video of the guest and restaurant workflow, including real-time synchronization between the kitchen and the guest device.
05 / ARCHITECTURE
Layered design and distributed data distribution model
The application leverages a unified codebase built on Angular 20 standalone components and Ionic 8, packaged as both a Progressive Web App and a native Android app via Capacitor:
Layer separation: cross-platform client, reactive UI, real-time BaaS services, and data integrity module.
Angular 20 & Ionic 8 (Standalone)
Modular architecture organized into distinct views (guest, staff, admin), decoupled business services, and synchronous local state managed via Angular Signals and computed properties.
- Angular Signals for lean reactive UI state
- Ionic Framework for adaptive touch UI components
- Standalone Angular 20 component tree
- Modular SCSS with semantic design tokens
Capacitor 8 Bridge (Android)
Native Android packaging powered by Capacitor 8 for staff handheld terminals, enabling direct access to hardware and local storage.
- Native compilation for staff floor tablets and mobile phones
- Integration with camera/hardware QR scanners
- Secure local session persistence
- Controlled offline handling during connectivity blips
Firebase Auth & Cloud Firestore
Serverless BaaS infrastructure featuring dual authentication (anonymous for diners, email/password for staff) and real-time snapshot subscriptions for sub-second updates.
- onSnapshot listeners for instant ticket propagation
- Normalized collections: tables, orders, catalog, invoices
- Firestore Security Rules enforcing table UID tenancy
- Firebase Hosting for low-latency global delivery
Demonstrative SHA-256 Integrity Engine
Experimental billing module that calculates a SHA-256 cryptographic hash for each invoice, concatenating it with the preceding invoice hash to create a tamper-evident append-only ledger.
06 / TECHNICAL DECISIONS
Engineered architectural choices and their trade-offs
Every major technical choice was selected to accommodate specific operational constraints within hospitality environments:
Session Anchor: Table → Anonymous UID
Problem Context
Restaurant diners will not complete email/password registration forms to order food; onboarding barriers cause immediate abandonment.
Decision Taken
Trigger Firebase anonymous authentication upon opening a table-linked URL. The assigned UID is permanently associated with the active table session in browser storage.
Technical Rationale
Enables strict Firestore Security Rules (diners can only read and mutate orders belonging to their active table) with zero signup friction.
Trade-off Assumed
If the diner clears local storage or opens an incognito window, a new anonymous UID is generated, requiring re-association with the active table.
Real-time Synchronization via Cloud Firestore
Problem Context
In busy kitchens and bars, a 30-second delay in ticket notification or status changes disrupts cooking rhythms and degrades customer experience.
Decision Taken
Implement real-time listeners (`onSnapshot`) across active order collections rather than periodic HTTP polling.
Technical Rationale
Delivers sub-second updates to KDS monitors without the network overhead and latency spikes of polling endpoints.
Trade-off Assumed
Increases concurrent read operations in Firestore. Requires carefully scoped queries filtered by active shift and date to avoid listening to historical collections.
UI Reactivity via Angular Signals & Computed
Problem Context
Recalculating subtotals, modifier pricing, cart item counts, and allergen filters frequently triggered change detection cycle overhead.
Decision Taken
Adopt native Angular Signals (`signal`, `computed`) for local synchronous UI state, restricting RxJS Observables to Firebase asynchronous event streams.
Technical Rationale
Produces cleaner, more deterministic, and highly performant component code. Derived values recompute exclusively when their direct dependencies change.
Trade-off Assumed
Requires managing a hybrid paradigm across the codebase (Signals for UI state and Observables for Firestore network data streams).
Reactive Filtering Across 14 EU Allergens
Problem Context
European food safety regulations mandate clear disclosure of 14 major allergens. Diners with celiac disease or nut allergies need absolute menu filtering certainty.
Decision Taken
Tag each recipe item with standardized allergen identifiers and compute an in-memory boolean exclusion filter that instantly updates visible dishes as preferences change.
Technical Rationale
Operates entirely in-memory over the cached catalog, providing immediate user feedback without recurring network calls.
Trade-off Assumed
Relies on administrative discipline during catalog item entry to guarantee no recipe ingredients remain untagged.
Demonstrative Invoice Integrity via SHA-256 Hashing
IMPORTANT: This mechanism is a technical demonstration and an academic data-integrity exercise. It is NOT certified or approved under Veri*Factu regulations, does NOT integrate with the Spanish Tax Agency (AEAT), and is NOT a complete production legal tax system.
Problem Context
Explored how cash register transactions can be safeguarded against retroactive alterations through an immutable audit trail.
Decision Taken
Implement SHA-256 hash chaining where each invoice payload includes the previous invoice's hash, sequential invoice number, tax base, 10% VAT, timestamp, and signature.
Technical Rationale
Demonstrates the technical mechanics of a tamper-evident audit ledger on the web without requiring a heavyweight distributed blockchain network.
Trade-off Assumed
Concurrent bill generation requires sequential ordering; simultaneous settlements must be arbitrated to ensure an intact chain.
07 / CHALLENGES & SOLUTIONS
Engineering hurdles encountered and how they were solved
Real-world challenges that emerged during the development of Trace and the concrete technical approaches used to overcome them:
Automatic ticket splitting across Kitchen and Bar KDS
A single customer order typically mixes cooked dishes and bar beverages. Presenting the entire ticket on both screens caused clutter and duplicated staff effort.
Introduced a preparation station taxonomy for all products. Upon saving an order, line items are routed by category; the kitchen screen only subscribes to food items while the bar receives drinks, linked by a shared order ID.
Concurrent state synchronization between table and kitchen
When the kitchen marked an item as preparing at the exact moment a diner added extra items to the open table ticket, document-level race conditions occurred.
Refactored the data model into two levels: a parent order document for session metadata (table, timestamps, payment status) and an independent subcollection of line items that mutate concurrently without locking the parent document.
Client-side PDF receipt generation in mobile PWAs and Android
Standard Node PDF libraries depend on file-system APIs that fail when running inside mobile web browsers or Android webviews.
Employed client-safe Canvas/VFS rendering (pdfmake/jspdf) encapsulated inside an environment-aware service that switches between Blob downloads on web and Capacitor File Opener on native Android.
Optimizing SCSS bundle sizes and Angular production budgets
The initial production build triggered bundle budget warnings due to redundant SCSS variable imports across standalone Ionic components.
Restructured style assets into modular SCSS partials, centralized design tokens, and eliminated duplicate imports in component decorators, reducing style bundle sizes well below threshold budgets.
08 / TESTING & QUALITY
Verification strategy and automated test coverage
Critical financial calculations and reactive state logic are backed by an automated test suite:
48 passing unit tests
Tests focus specifically on VAT decimal rounding, SHA-256 hash chaining, strict allergen filtering, and KDS ticket splitting.
Critical Areas Covered by Tests
- 10% VAT and Tax Base Calculation
Decimal precision checks verifying exact cent rounding and tax breakdowns across single and multi-item orders.
- SHA-256 Hash Chaining Logic
Cryptographic verification confirming that altering a single character in history invalidates subsequent block signatures.
- Reactive 14-Allergen Filters
Validates that no menu item with declared traces or ingredients bypasses active dietary filter selections.
- KDS Station Routing
Ensures precise separation of kitchen food items and bar beverages into their respective live queues.
- Table-UID Check-in Lifecycle
Tests anonymous authentication initialization and persistent session linkage to the physical table number.
- PDF Document Assembly
Verifies proper assembly of receipt line items and tax summaries prior to document generation.
Build & CI Guarantees
- Strict TypeScript
Zero implicit `any` types, rigorous null checking, and exhaustive interface definitions.
- ESLint and Prettier
Automated linting and formatting enforced via pre-commit hooks and CI pipelines.
- Production Build Budgets
Enforced limits on JavaScript and CSS bundle sizes during release packaging.
09 / SECURITY & DATA
Access isolation and security within a serverless BaaS
Without an independent backend server, security and data boundaries are enforced directly through Firebase declarative rules:
Anonymous vs Staff Role Isolation
Diners use anonymous credentials scoped strictly to their table session; staff authenticate using verified accounts with write privileges over KDS and catalog data.
Firestore Security Rules
Declarative security rules preventing diners from reading or mutating orders from other tables, or altering item prices.
Append-Only Invoice Records
Firestore rules explicitly disallow `delete` and `update` operations on issued invoice collections, ensuring record immutability.
10 / RESULT
A verified, functional end-to-end service solution
Without fabricating commercial revenue figures or active customer counts, Trace delivers a robust, tangible software solution:
End-to-End Service Cycle
Fully functional order lifecycle from table QR scanning through kitchen prep to payment closure.
Real-time KDS Monitors
Dedicated responsive touch interfaces for kitchen and bar stations with flicker-free updates.
Instant 14-Allergen Filtering
Accessible, safety-conscious menu browsing for guests with severe dietary intolerances.
Demonstrative Auditability
Technically sound SHA-256 hash chaining and client-side PDF receipt generation.
Cross-Platform Delivery (PWA + Android)
Instant access via any mobile browser, alongside a native Android build via Capacitor 8.
Automated Test Suite
Comprehensive unit test coverage verifying all mathematical and core business operations.
11 / WHAT I LEARNED
Key architectural and engineering takeaways
Building Trace provided invaluable hands-on experience solving challenges well beyond surface-level UI design:
Real-Time Distributed State Architecture
Gained a deep appreciation for idempotency and document granularity when designing real-time systems to avoid race conditions across concurrent devices.
Security in BaaS Environments
Learned that in serverless BaaS architectures, database security rules serve as the actual business and authorization layer, requiring the same rigor as backend APIs.
Adopting Angular Signals over RxJS
Experienced firsthand how Signals drastically streamline synchronous UI state management compared to the mental overhead of complex RxJS subscription chains.
Technical Proofs vs Regulatory Claims
Understood the vital professional distinction between implementing a demonstrative cryptographic integrity mechanism and claiming legal regulatory certification like Veri*Factu.
The Value of Unit Tests for Critical Logic
Automating tests for tax arithmetic and hash chaining provided the confidence needed to refactor core modules without fear of silent regressions.
Cross-Platform Build Trade-offs
Explored the practical differences between serving a lightweight web PWA and packaging an Android native container with Capacitor, balancing hardware access and portability.
12 / TECHNICAL NAVIGATION
Deep-dive case study sections
Navigate directly to specific technical and architectural chapters:
Layer breakdown covering client, Capacitor bridge, and Cloud Firestore.
Design justifications and trade-offs made throughout the project.
Detailed overview of the demonstrative cryptographic chaining mechanism.
Real-world hurdles around synchronization, PDFs, and production builds.
Automated unit tests covering financial formulas and business logic.
Firestore rules, dual-role authentication, and immutable audit logs.