Khairi OS

Overview

A digital headquarters designed as a personal OS. Features a glassmorphism command dock, Steam-inspired project library, gaming stats dashboard, and an Obsidian-inspired public wiki. Built to create an immersive experience that goes beyond a typical portfolio.

Challenges

• 1Designing a cohesive OS-like experience across all pages
• 2Implementing smooth page transitions with Framer Motion
• 3Building a responsive glassmorphism sidebar that works on mobile
• 4Creating a performant search command palette across all content types

Learnings

• ✓Advanced CSS glassmorphism and backdrop-filter techniques
• ✓Zustand state management patterns for complex UI state
• ✓Next.js App Router with dynamic routes and layouts
• ✓Keyboard shortcut handling in React applications