Afterclick

A cybersecurity first-aid kit for the moment of panic right after you click a phishing link, share a password, or send money to a scammer.

Comment

Inspiration

Every year, millions of people fall victim to phishing attacks, credential theft, and financial fraud. Despite billions invested in security awareness training and antivirus software, nearly all existing tools focus strictly on what to do before an attack occurs:

"Don’t click strange links." "Verify the sender." "Check for SSL certificates."

In the real world, people are tired, stressed, multitasking, or deceived by sophisticated spear-phishing. When someone inevitably clicks, an immediate wave of panic and shame sets in.

During that critical window—the first 15 minutes ($\Delta t \le 15\text{ min}$)—victims make costly mistakes: they close the browser in denial, hesitate to notify IT or their bank, or attempt to re-enter credentials on fake portals.

We took inspiration from real-world medical emergency kits: when someone cuts their hand, you don't lecture them on knife handling; you give them first aid to stop the bleeding. We built AfterClick to be the cybersecurity first-aid kit for the digital world—an empathetic, deterministic triage system that meets users right where they browse.

What it does

AfterClick operates as a dual-surface ecosystem: a Manifest V3 Chrome Extension ("AfterClick Companion") for instant on-page analysis, connected seamlessly to a Web-Based Emergency Response Engine.

  1. Deterministic Scam & URL Inspector

    • Local On-Device Parsing: Using tldts, it isolates the registrable domain from sneaky attacker subdomains (e.g., paypal.com.secure-login.account-verify.top $\to$ registrable domain is actually account-verify.top).
    • Zero False Guarantees: Clean messages never receive a misleading "safe" badge. The UI explicitly reinforces that the absence of known red flags does not guarantee safety.
    • Privacy-First Content Inspection: On explicit user command, visible DOM text and link destinations are evaluated for urgency cues, threats, and link mismatches. Password inputs, form fields, session tokens, and cookies are strictly filtered out and never read.

  2. Interactive Emergency Response Workflows

    • Covers the 5 most critical human-layer cybersecurity emergencies:
      1. I clicked a suspicious link
      2. I entered my password on a fake site
      3. I shared a verification code (2FA/OTP)
      4. I sent money to a scammer
      5. Someone had remote access to my computer
    • First Aid First: Immediate, calm, damage-control actions are surfaced before presenting any diagnostic questions.
    • Dynamic Plan Recalibration: State-machine logic recalculates priorities on the fly as facts change (e.g., transitioning from "I can still sign in" to "I am locked out").

  3. Empathetic Voice Guidance (ElevenLabs)

    • In moments of panic, reading dense technical text increases cognitive load. With our "Talk me through it" voice guide, users can listen to clear, steady audio narration of each emergency step, just like an emergency dispatcher talking them through a crisis.

  4. Amazon Bedrock & Evidence-Grounded AI Explanations

    • Explains technical domain and urgency findings in plain, non-condescending English without hallucinating advice or replacing our rule-based triage.

  5. Sanitized Incident Case File & Support Export

    • Compiles a complete chronological markdown log with timestamps and verified recovery links.
    • Generates a Sanitized Support Draft stripped of private tokens, passwords, and sensitive identifiers, ready to paste directly into bank fraud hotlines or enterprise IT tickets. ## How we built it We engineered AfterClick to be fast, privacy-preserving, and rock-solid under stress:
  • Chrome Companion Extension (Manifest V3):
    • Built with React 19, TypeScript, Tailwind CSS, and Vite.
    • Uses minimal permissions (activeTab, scripting, contextMenus, storage) to ensure zero continuous background surveillance.
    • Custom tree-walker DOM extractor for on-demand link mismatch and semantic urgency analysis.
  • Web First-Aid App:
    • Built on TanStack Start / React Router with server-side API rendering and Nitro.
    • Pure state engine in src/lib/engine.ts with 41 automated unit tests verifying deterministic priority sorting, step generation, and plan mutation.
  • Cloud & AI Infrastructure:
    • Amazon Bedrock: Powering privacy-compliant, evidence-bounded text explanations. Strict JSON schema definitions guarantee that the model only elaborates on deterministic findings rather than inventing its own risk verdicts.
    • ElevenLabs API: Integrated using the eleven_multilingual_v2 model with a bounded server-side generation cache and rate-limiting budget.
    • Hosting: Deployed globally on Vercel with edge caching and serverless execution.

Challenges we ran into

  1. The Determinism vs. AI Dilemma:
    • In cybersecurity emergency triage, LLMs are dangerous when allowed to act as autonomous arbiters—a model hallucinating that a phishing portal "looks benign" could cause someone their life savings.
    • Solution: We enforced strict architectural separation. All triage advice, steps, and priority logic are 100% deterministic code (engine.ts). AI (via Amazon Bedrock) is restricted purely to explaining detected evidence in plain language.
  2. True DOM Privacy in Manifest V3:
    • Extracting page cues without compromising sensitive user data was challenging.
    • Solution: We built a custom tree-walking content script with an active blocklist rejecting <input>, <textarea>, <select>, <script>, password fields, and hidden elements.
  3. Punycode & Subdomain Deception:
    • Attackers use homoglyphs (e.g., Cyrillic characters that look like Latin a or o) and deep subdomains to fool users.
    • Solution: We implemented canonical lookalike normalization and public suffix matching using tldts, ensuring that service.paypal.com.evil.xyz is immediately flagged for brand-in-subdomain spoofing.
  4. Sub-second Extension $\leftrightarrow$ Web Handoff:
    • Passing context from the browser toolbar into an interactive web application without requiring cookies or account sign-ups.
    • Solution: Designed URL-safe query handoffs (?incident=<type>&source=extension) that trigger deep-linked triage modals while keeping all active case file progress in client-side LocalStorage. ## Accomplishments that we're proud of

What we learned### 💡 Inspiration

  • Cybersecurity UX is Human Psychology First: Security isn't just about cryptography; it’s about reducing cognitive friction under adrenaline. Removing victim-blaming language and providing audio first aid transforms panic into decisive action.
  • The Power of Manifest V3 Isolation: Designing background service workers and on-demand content injection without continuous tab snooping forced us to build a cleaner, more respectful extension architecture.
  • Hybrid Systems Win: Combining deterministic state machines with Amazon Bedrock’s contextual explanations delivered the best of both worlds: mathematical reliability where safety is concerned, paired with natural empathy where communication matters.

🚀 What's Next for AfterClick

  • Automated Bank Hotline Directory: One-click direct dialing and secure fraud hotline verification for regional credit unions and global banks.
  • Enterprise SIEM Integration: A privacy-preserving "Notify my Security Team" webhook for corporate workers to seamlessly forward sanitized case files to internal SOCs.
  • Multi-Language Emergency Voice Support: Expanding ElevenLabs multilingual emergency narration to support non-English speaking victims globally.

What's next for Afterclick

Built With

Share this project:

Updates

Submission history