Easter Eggs & Micro-Interactions

Discover hidden features, delightful animations, and secret achievements in Jorge's cyberpunk website.

Your Progress

Easter Eggs Found

0 / 5
Konami Code
Tron Word
Triple Click
Corner Sequence
Shift Hover

Achievements

0 / 5
Grid Explorer
Time Traveler
System Hacker
Speed Demon
Grid Master

How to Activate Easter Eggs

Konami Code

Type: ↑ ↑ ↓ ↓ ← → ← → B A

Effect: Activates Matrix Rain

Type 'tron'

Type the word 'tron' anywhere

Effect: Grid pulse animation

Triple Click Logo

Triple-click on any logo

Effect: Glitch effect animation

Corner Sequence

Click corners: TL → TR → BR → BL

Effect: System Access Mode

Shift Hover

Hold Shift for 2 seconds

Effect: Reveals hidden stats

Visit All Pages

Explore every section

Effect: Explorer Achievement

Interactive Demos

Loading States

Activating digital presence...

Tron Loader

Grid Loader

Transmitting...

Transmitting

Scanning

Scanning

Neon Progress Bar

0%

Glitch Effects

GLITCH TEXT

DECRYPT ME

Hover Effects

Hover Me!

Pulsing Badge

I Float!

Scan Line Buttons

Developer Notes

All effects respect user preferences for reduced motion and are optimized for performance. Easter eggs are stored in localStorage and persist across sessions.

Implementation Details:

  • Built with Framer Motion for smooth animations
  • CSS animations for performance-critical effects
  • LocalStorage for achievement persistence
  • Respects prefers-reduced-motion
  • Mobile-optimized (cursor effects disabled on touch)
  • Zero impact on page load performance

File Structure:

  • /src/hooks/useKonamiCode.ts
  • /src/hooks/useEasterEggs.ts
  • /src/components/effects/*
  • /src/components/effects/tron-effects-provider.tsx