Cluck o' Clock - Egg Timer App 🐣

Tired of guessing when your eggs are perfectly cooked? Meet Cluck o' Clock – the pixel-perfect timer that hatches precision into every egg dish!
Cluck o’ Clock is a desktop application built with Electron, designed to add joy and precision to your egg-cooking. Whether you're a breakfast enthusiast or a culinary beginner, this delightful app helps you time your eggs—hard-boiled, fried, soft-boiled, or scrambled eggactly on time.

Featuring a cute pixelated interface, animated art, and sound effects, Cluck o’ Clock brings fun to your kitchen routine. it ensures your eggs are cooked "eggactly" right—every time.

Features

• 4 Egg Cooking Modes:
  • Soft Boiled – 5 minutes
  • Hard Boiled – 10 minutes
  • Fried Egg – 3 minutes
  • Scrambled – 4 minutes
• sound effects
• egg hatching animation
• pixel art design
• countdown timer
• Completion notification

Screenshots

Prerequisites

Before you begin, ensure you have the following installed:

• Node.js (v14 or higher recommended)
• npm (comes with Node.js)
• Git (optional, for cloning the repository)

Installation

1. Clone the Repository (or download the ZIP file):

   git clone https://github.com/abhiramiramadas/clucko-clock.git
   cd clucko-clock
   
   

2. Install Dependencies:

   npm install
   
   

3. Run the App:

   npm start
   
   

Usage

1. Start Page: Launch the app to see the start page. Click the "Start" button to begin.
2. Menu Page: Choose your egg type (e.g., Hard Boiled, Fried Egg). Each option has a pre-set cooking time.
3. Timer Page: Watch the timer count down with a cute chick animation.
4. Ending Page: When the timer finishes, you'll hear a sound and see an egg animation. Choose "Snooze" to add 1 more minute or "Done" to return to the start page.

File Structure

• index.js: Main Electron process script to create the window and handle navigation.
• preload.js: Preload script for secure IPC communication between renderer and main processes.
• startpage.html: Start page with the initial welcome screen.
• menupage.html: Menu page for selecting egg types.
• timerpage.html: Timer page with countdown and pause/resume functionality.
• endingpage.html: Ending page shown when the timer completes.
• styles.css: Consolidated CSS file for styling all pages.
• assets/: Folder containing images (e.g., bg.png, chick1.png, egg1.png) and audio files (click.wav, timer.wav).

Project Details

🛠Techstack

Creative Tools

Design System

Typography

Color Palette

Design Process

• UI/UX mockups: created in Figma
• Code implementation: using Figma Dev Mode
• Assets: Pixel art crafted in LibreSprite
• Animation: Sprite sheets exported as PNG sequences

Contributing

Contributions are welcome! If you'd like to contribute:

1. Fork the repository.
2. Create a new branch (git checkout -b feature/your-feature).
3. Make your changes and commit (git commit -m "Add your feature").
4. Push to your branch (git push origin feature/your-feature).
5. Open a pull request.

License

This project is licensed under the MIT License - see the LICENSE file for details.

Acknowledgments

• Built with Electron for cross-platform desktop app development.
• Fonts provided by Google Fonts.
• Inspired by the joy of cooking eggs perfectly!

---