Past Mirror »» learn from past

By (@moh) · · Websites

Learning from the past isn't just about memorizing history books. It means looking at your own actions, figuring out why you stumbled, and making sure you don't repeat the same mistakes. Smart people always look back to adjust their path forward.

That's exactly what the Past Mirror website is for. Think of it as your own totally private decision-making diary. Here's how it works:

First, you write down a decision you're about to make along with all the details—what you were thinking, what you expected to happen, and how confident you felt. Later, you come back and log what actually happened. That's when your eyes open to your blind spots, and you realize which of your assumptions were dead wrong.

You can even compare your situation with real, documented history to see how others handled similar stuff. The best part? It's 100% private. There are no social feeds, no comments, and no sharing. Everything stays on your device, and you can lock it all up with a password so it's just for your eyes.

Tech stack

  • Vercel
  • Cursor

Prompt

I want you to build a website called "Past Mirror". It is a completely private, personal tool for "learning from the past". There should be absolutely no community features, comments, public profiles, or sharing. Everything is saved locally (Local Storage), and the user can lock their data with a passphrase (using AES-GCM encryption). There is no server involved.

Important Constraint: Please do NOT use any emojis anywhere in the UI, buttons, or code. Use plain text or custom SVG icons instead.

Here are all the specific details:

1. UI & Visuals:
- The overall style must be "Solid 3D Clay". This means buttons and panels should look thick with heavy bottom shadows, and they should physically "press down" when clicked (press physics).
- Colors must be vibrant, energetic, and highly chromatic. Use a wide variety of colors for fonts, buttons, and backgrounds. Assign specific colors to different topics (e.g., money, health, work, etc.).
- In the header, ONLY show the logo and the name "Past Mirror". Completely remove any taglines or extra text.
- Add a catchy SVG favicon (something that looks like a gem or an eye with cyan, gold, and black colors).
- For the background, create a "Live motion wallpaper" using Canvas—smooth, colorful geometric shapes that slowly float around the screen.

2. Sound Design:
- Use the Web Audio API to create warm, soft sounds for the buttons.
- Crucial: Every button must have its own unique sound! (e.g., Record Decision = soft marimba, Log Assumption = kalimba, Add Outcome = soft drum, Save Lesson = gentle chime, Lock Vault = deep descending tone). No harsh or loud noises.

3. Sidebar & Sections:
- Dashboard: Colorful stat cards showing totals (Decisions, Assumptions, Outcomes, Lessons).
- Decisions: A form to record a decision (Title, Topic, Situation, Options, Main Assumption, Expected Outcome, Confidence %, Review Date).
- Assumptions: A list of assumptions with their statuses (open, confirmed, falsified).
- Outcomes: Check-ins where users record what actually happened.
- Reviews: Decisions whose review date is due.
- Pattern Radar: Personal analytics (average confidence, topic distribution, assumption autopsies).
- Counterfactual: A sandbox for "What if..." scenarios.
- History: Contains documented historical examples. Very Important: Do NOT show these samples by default. Put a big, colorful button that says "Open samples". Only when the user clicks it should the list open.
- Lessons: A list of personal takeaways the user has learned.
- Timeline: A vertical "river" visual showing decisions, outcomes, and lessons in chronological order.

4. Extras & Settings:
- A "Vault" button in the header to set a passphrase and encrypt all data.
- A "Settings" button in the header to toggle Sound, Motion Wallpaper, Reduced Motion (accessibility), and to Export/Import data as JSON.

Please write clean, dependency-free code for all of this.

Comments (3)

  1. Jack Herzlich · · 1 like

    Wow this is really cool. I've never seen something like this, but this would be extremely useful to many people including myself. A website to take accountability and to log your thoughts and decisions, I love it. Going to start adding some assumptions I have and see if they change over time. Very creative, great build!

    1. mohan · · 1 like

      thank you sir, i am very proud you liked it. <div>when I am here i really learn a lot of new things, <span>my build is not comparable to other legends yet. </span></div><div>i will try to make something more plractical next time.. </div>

    2. Jack Herzlich ·

      It's still an amazing build and you should be proud of that. Everyone gets better as time goes on, that's completely normal. You're doing great. After signing up and exploring Prompted, as a builder using AI is there anything you'd like to see added or improved on Prompted? I'd love to hear your feedback if you have any

  2. Enayatullah ·

    This is one of amazing builds

  3. Hadi ·

    legend🔥
    you made an amazing website man

6 likes · 5 comments · 2 views

Explore more on Prompted

Loading