Aero | Devpost

Inspiration

High school is a highly stressful period, and mental health crises like panic attacks are increasingly common among students. When a crisis hits during school hours, students face an overwhelming barrier to finding help. School emergency handbooks are buried in long, complex PDFs, and requesting a counselor's help requires navigating stressful administrative forms. Additionally, the social anxiety and stigma of explaining their state to a teacher prevents many students from leaving the classroom. We built Aero to be a silent, empathetic companion that translates student panic into immediate, frictionless action and silent passage to safety.

What it does

Aero is a web-based MVP designed for silent crisis navigation. When a student feels a panic attack oncoming, they open the application. It offers a frictionless, non-verbal interface where the student can simply record a voice note or tap a few expressive symptom emojis (such as "Heart Racing" or "Can't Breathe").

Behind the scenes, Aero's AI processes the input, bypasses school bureaucracy by auto-filling the required support forms, and immediately outputs:

An Interactive Grounding Tool: A beautiful, slowly-animating breathing circle to help regulate their heartbeat.
A "Silent Pass": An official, high-contrast digital hall pass to show the teacher, allowing the student to leave the classroom silently without having to explain themselves under stress.
Auto-Routing: A clear map pin indicating which counselor is waiting for them and where, confirming the support request has already been securely filed.

How we built it

Aero was built utilizing modern frontend technologies to ensure it is incredibly fast, responsive, and serene.

Frontend Framework: React (Vite) for building a smooth, fast single-page application.
Styling & Animations: Tailwind CSS for custom pastel-slate calming colors, smooth state-machine transitions, and the CSS-animated breathing visualizer.
Icons: Lucide React for consistent, friendly, and clean visual indicators.
Deployment: GitHub Pages for global, frictionless access.

Challenges we faced

Designing for a user under acute cognitive load (a panicking student) was our greatest challenge. We had to ruthlessly eliminate text fields, complex navigation, and unnecessary buttons. Our initial design was too chatbot-heavy, but we realized that a student in crisis cannot converse. We pivoted to a "tap-and-go" emoji and mic-focused interface. Setting up the custom CSS keyframes for the breathing loop to match a scientifically backed 4-second inhale/exhale cycle also took deep fine-tuning.

Accomplishments we're proud of

We are immensely proud of building a fully responsive, visually calming, and highly empathetic user experience. The "Silent Pass" design is a feature we believe could truly reduce the social stigma of mental health in schools, allowing students to advocate for their health with dignity.

What we learned

We learned that the best AI solutions are not those with the most complex interfaces, but those that hide their complexity behind a single, empathetic button. We learned how to design responsibly, ensuring the AI acts as a secure, non-diagnostic bridge to connect vulnerable students to human counselors.

What's next for Aero

We plan to integrate live browser Web Audio recording with whisper-based Speech-to-Text APIs to make the voice input fully functional, and establish direct webhook integrations with popular school counselor software (like Naviance or PowerSchool) to auto-fill administrative forms natively.