Project: Creative Apps - Embers

[NamanAryan9]

Track

Creative Apps (GitHub Copilot)

Project Name

Embers — Give your memories a place to live

GitHub Username

NamanAryan9

Repository URL

https://github.com/NamanAryan9/embers

Project Description

Embers is a grief memorial web app that gives
you one last conversation with someone you've
lost — and a final letter written in their voice.

You write down who you're remembering: their
name, your relationship, and the specific things
they used to say or do. Embers uses GitHub Models
API (GPT-4o) to bring those memories to life in
a tender, finite conversation — exactly 10
exchanges. Then the person writes you a farewell
letter, revealed word by word like a typewriter.
And they're gone.

It's not a chatbot. It's a memory keeper.

Key features:

• AI conversation that speaks in the person's
  voice using only your specific memories
• Gender inference from relationship field —
  no forms to fill
• Final letter generated from the conversation
  context, personalized to your memories
• Complete privacy — everything stays on your
  device, nothing sent to any server except
  the AI API call
• Atmospheric design: candlelit UI, aged
  parchment, ambient sound, custom cursor,
  ember particles, cat tail animation
• "X is still here" — kept memories persist
  on the welcome screen

Demo Video or Screenshots

Live Demo : https://namanaryan9.github.io/embers/

Primary Programming Language

TypeScript/JavaScript

Key Technologies Used

React, Vite, Framer Motion, React Router DOM,
GitHub Models API (GPT-4o-mini), GitHub Copilot,
Web Audio API, CSS @Keyframes, Google Fonts
(Cormorant Garamond), localStorage

Submission Type

Individual

Team Members

No response

Submission Requirements

• My project meets the track-specific challenge requirements
• My repository includes a comprehensive README.md with setup instructions
• My code does not contain hardcoded API keys or secrets
• I have included demo materials (video or screenshots)
• My project is my own work with proper attribution for any third-party code
• I agree to the Code of Conduct
• I have read and agree to the Disclaimer
• My submission does NOT contain any confidential, proprietary, or sensitive information
• I confirm I have the rights to submit this content and grant the necessary licenses

Quick Setup Summary

1. Clone: git clone https://github.com/NamanAryan9/embers
2. Install: npm install
3. Create .env file with VITE_GITHUB_TOKEN=your_token
   (Get free token at github.com/settings/tokens)
4. Run: npm run dev
5. Open: localhost:5173

Technical Highlights

• Built the entire frontend in one night —
  I wrote the architecture, component structure,
  and design system while GitHub Copilot
  accelerated implementation. We worked as
  partners: I made every creative and technical
  decision, Copilot helped me move fast.

• Engineered the AI system prompt carefully —
  the model references specific memory details
  in every response, infers gender from the
  relationship field automatically, and treats
  gibberish as wordless grief rather than
  ignoring it. This required many iterations
  to get right.

• Built variable timing into the typewriter
  effect — longer pauses after punctuation
  so the letter feels like someone actually
  breathing as they write, not a machine
  printing text.

• Wrote all atmospheric effects in pure CSS —
  film grain overlay, ember particles, cat tail
  sway, candle flicker — all GPU-composited
  with will-change and translateZ(0) for
  smooth 60fps performance.

• Designed a palette that shifts from warm
  to cool as exchanges decrease — the user
  feels time running out without any text
  telling them so.

• Generated all UI sound effects procedurally
  using Web Audio API — no audio files,
  pure code synthesis.

• Architected privacy-first from the start —
  zero backend, zero accounts, zero external
  storage. Memories never leave the
  user's device.

Challenges & Learnings

The biggest challenge was the emotional
design problem — how do you make an AI
feel like a real person and not a chatbot?

The solution was prompt engineering:
forbidding generic grief words like
"cherish", "treasure", "soul", "beautiful"
and forcing the model to anchor every
response to a concrete memory detail the
user provided. The difference was dramatic.

The second challenge was performance —
the custom cursor was calling
document.elementFromPoint() 60 times per
second causing visible lag. Throttling
the hover detection to every 100ms while
keeping the RAF loop for smooth movement
fixed it completely.

I learned that grief tech needs restraint
more than features. Every time I added
something, I asked: does this serve the
moment or distract from it? The finite
10-exchange limit, the silence before the
letter, the "X is still here" on the
welcome screen — the emotional impact
came from what I chose NOT to do.

Contact Information

namanaryan002@gmail.comnamanarynamanary

Country/Region

India