MishaelGilland

TEDxITB needed a web platform that could support public event information, ticket purchase flows, merchandise checkout, attendee access, and admin-side order operations without making the user journey feel fragmented.

I mapped the needs of attendees and internal organizers: clear event discovery for visitors, reliable ticket and merchandise states for users, and faster review flows for admins managing orders and attendance.

The work moved between Figma flows and implementation. I helped translate event requirements into pages, dashboards, order states, and QR-based attendance interactions while keeping the interface direct enough for event-day use.

Wireframes focused on the highest-risk flows: ticket selection, proof upload, user dashboard states, admin order review, and attendance scanning. Each flow was kept linear so users could understand what to do next.

The interface used a simple event-oriented component set: cards for tickets and products, status badges for orders, tables for admin review, and compact dashboard modules for account-specific information.

The shipped app includes public pages, ticket and merchandise checkout, authenticated dashboards, QR ticket access, and admin tooling for orders, attendance scanning, and event email operations.

This project strengthened how I connect design handoff with real frontend constraints. The biggest lesson was keeping event operations boring in the best way: clear states, predictable flows, and interfaces that hold up when the room gets busy.

Aircraft operating in tropical conditions need clearer ways to monitor structural fatigue signals. For a hackathon sprint, the challenge was to turn technical monitoring data into an interface that could be scanned quickly by operators.

I studied dashboard patterns for fleet monitoring, alert prioritization, and report-heavy workflows. The interface needed to balance overview-level awareness with aircraft-specific detail.

I structured the product around fleet overview, aircraft detail, alerts, and reports. Mock REST data and state stores made the prototype feel operational while still being fast enough for a sprint timeline.

Wireframes prioritized a desktop command-center feel: map first, alerts close by, charts grouped by aircraft, and report summaries available without burying the operator in navigation.

The UI used compact cards, alert severity tokens, chart containers, table rows, and map markers. These patterns kept dense data readable without turning the dashboard into decoration.

The final prototype includes a fleet map, aircraft detail pages, alert states, chart-heavy monitoring views, and report workflows built with React, TypeScript, Vite, Zustand, Recharts, D3, Leaflet, and MSW.

TropiCycle sharpened my approach to technical dashboards: start with the operator's scanning behavior, make severity obvious, and let visual hierarchy do more work than copy.