YanLiu Desktop OS

August 14, 2025 · View on GitHub

A creative desktop operating system interface built with HTML, CSS, and JavaScript featuring interactive applications and smooth animations.

✨ Features

🖥️ Desktop Interface

  • Interactive desktop OS with taskbar and system time
  • Draggable windows with minimize/maximize functionality
  • Beautiful glassmorphism design with dynamic wallpapers

🎭 Mood Tracker

  • Daily mood tracking with 6 emoji options
  • Dramatic flying emoji animations with smooth arc motion
  • Monthly and yearly mood analytics with statistics
  • Calendar view showing mood history
  • Smooth cross-fade transitions

🎨 Creative Applications

Avatar Creator

  • Customizable avatar system with multiple options
  • Hair, clothing, and accessory categories
  • Download your created avatars
  • Random avatar generation

Sticker Library

  • Categorized sticker collections (AI Art, LOL, Panda, Work, etc.)
  • Searchable sticker interface
  • Full-screen sticker preview

My Camera

  • Live camera feed with photo capture
  • Photo filters (Retro 70s, Dreamy, Vibrant Pop)
  • Photo gallery with saved captures
  • Decorative camera overlays

My Notebook

  • Sticky notes system for quick thoughts
  • Drag and drop note positioning
  • Persistent note storage

🎮 Games & Entertainment

Five in a Row

  • Classic strategy game
  • AI opponent
  • Win detection and scoring

Music Player

  • Audio visualization with canvas
  • Multiple track support
  • Volume controls and progress tracking

🚀 Getting Started

  1. Clone this repository
  2. Open index.html in your web browser
  3. Enjoy the desktop experience!
git clone https://github.com/yourusername/yanliudesktop.git
cd yanliudesktop
open index.html

🎯 Highlights

  • Smooth Animations: Buttery-smooth flying emoji animations with GPU acceleration
  • Responsive Design: Works on desktop and tablet devices
  • Local Storage: All your data is saved locally in your browser
  • Performance Optimized: Efficient memory management and resource cleanup

🛠️ Technical Stack

  • Frontend: HTML5, CSS3, JavaScript (ES6+)
  • Animations: CSS transitions with cubic-bezier easing
  • Storage: LocalStorage for data persistence
  • APIs: Camera API, Web Audio API

📱 Browser Support

  • Chrome (recommended)
  • Firefox
  • Safari
  • Edge

🎨 Design Philosophy

This project celebrates creativity and smooth user experiences. Every interaction is crafted to feel delightful, from the dramatic mood tracker animations to the intuitive window management system.

📄 License

This project is open source and available under the MIT License.

Built with ❤️ and lots of smooth animations

🤖 Generated with Claude Code