🎨🧩 ColorBlockJam

A challenging puzzle game where players strategically align colorful puzzle pieces with matching colored blocks to clear the board. Built with Unity, featuring custom shaders, hand-crafted assets, and a strong, scalable game architecture.

---

🎮 About the Game

ColorBlockJam is a grid-based puzzle game where players solve increasingly challenging puzzles by grabbing the pre-placed puzzle pieces from the tiles and dragging them toward the matching color blocks. The goal is to align each piece’s color with the color blocks on the frame, triggering a dissolve effect that clears the piece from the board and opens space for new ones.

🎥 Gameplay Video

ColorBlockJam_.mp4

🖼️ Screenshots

---

✨ Game Features

🧩 Core Mechanics

• 🎛️ Grid-Based Puzzle System: Precisely position puzzle pieces on a tile-based grid.
• 🎨 Color Matching: Align puzzle piece colors with the matching colored blocks on the frame.
• 🌫️ Exit Animation System: Smooth dissolve and exit animations when a correct match is made.
• 🚧 Obstacle Detection: If another puzzle is blocking the exit direction, the piece cannot leave the board.
• 🖱️ Drag & Drop Controls: Intuitive touch/mouse-based movement.
• 📌 Snap-to-Grid: Puzzle pieces automatically snap to the nearest tile.

🌈 Visual Features

• 🔥 Dissolve Shader: Custom dissolve shader for puzzle exit animations.
• ✨ Particle Effects: Dynamic particle feedback systems.
• 🎞️ Smooth Animations: DOTween-powered fluid animations.
• 🎚️ Material System: Dynamic color and material management for puzzle pieces.

🧠 Technical Features

• 🧱 Component-Based Architecture: Modular, SOLID-compliant structure.
• ♻️ Object Pooling: Efficient particle and effect management.
• 🔄 State Management: Robust game state handling.
• 🔊 Audio & Haptics: Integrated feedback systems.
• 📂 Level System: Flexible level loading and flow control.

---

🛠️ Tools & Packages Used

📦 Unity Packages

• ⚙️Unity Engine : 6000.0.58f2
• 🔄 DOTween: Tweening & animations
• 🧰 TriInspector : Enhanced Inspector UI
• 🎨 URP Simple Toon Shader : Stylized toon shading
• ✨ Quick Outline — Outline effect for interactable objects

---

🧩 Custom Framework

• 🧱 SerapKeremGameKit – A personal development template featuring:

  • 📝 Logging system
  • 🔊 Audio management
  • 📳 Haptic feedback
  • ✨ Particle system with pooling
  • ♻️ Level system
  • 🖼️ UI framework
  • 🔄 State management

---

🎨 Custom Assets

🧱 3D Models

All 3D models were fully crafted from scratch using **Blender 4.0.

• 🧩 Puzzle pieces (various shapes and sizes)
• 🎨 Colored frame blocks
• 🧱 Frame segments
• 🔲 Grid elements

🟣 Shaders

Custom Dissolve Shader — entirely written by me, featuring:

• 🌫️ Smooth alpha-based transitions
• ➡️ Directional and percentage-driven dissolve behavior
• ⚡ Optimized using Material Property Blocks for high performance

---

🎯 How to Play

📘 Basic Rules

1. 🧩 Puzzle Alignment: At the start, all puzzles already sit on top of the tiles. Simply drag them to the correct Colored Block position.
2. 🎨 Match Colors: Align the puzzle's colors with the colored blocks on the frame edges.
3. 🚧 Clear the Path: Ensure no other puzzle blocks the exit direction. If the path is blocked, the piece cannot exit.
4. 🌫️ Puzzle Exit: When matched successfully, the puzzle dissolves and exits the board.
5. 🏆 Win Condition: Clear all puzzle pieces to complete the level.

🕹️ Controls

• 🖱️ Mouse / Touch: Drag to move puzzle pieces.
• ✋ Release: The piece automatically snaps to the nearest tile.
• 🎯 Auto Snap: Pieces lock into the closest valid tile position.

---

📦 Project Structure

Assets/
├── _Game/
│   ├── Scripts/
│   │   ├── Puzzle/          # Puzzle system scripts
│   │   ├── ColoredBlock/    # Colored block system
│   │   ├── Frame/           # Frame system
│   │   └── Shared/          # Shared helpers
│   ├── Resources/           # Game prefabs and levels
│   │   ├── Levels/         # Level prefabs
│   │   ├── PuzzleTypes/    # Puzzle type prefabs
│   │   ├── ColoredBlock/   # Colored block prefabs
│   │   └── Tile/           # Tile prefabs
│   ├── Scenes/              # Game scenes
│   ├── Materials/           # Materials
│   ├── Shaders/             # Custom shaders
│   ├── Audio/               # Audio files
│   ├── Data/                # ScriptableObject data
│   ├── ParticleEffects/     # Particle effect prefabs
│   └── Sprites/             # Sprites
└── SerapKeremGameKit/       # Custom framework
    ├── Scripts/
    │   ├── _Audio/          # Audio management
    │   ├── _Haptics/        # Haptic feedback
    │   ├── _Logging/        # Logging system
    │   ├── _Particles/      # Particle system
    │   ├── _Pools/          # Object pooling
    │   ├── _LevelSystem/    # Level management
    │   └── _UI/             # UI framework

---

🚀 Getting Started

📥 Installation

git clone https://github.com/SERAP-KEREM/ColorBlockJam.git

1. Open the project in Unity
2. Load the main scene
3. Press Play

🛠️ Build

1. File → Build Settings
2. Choose platform
3. Click Build

---

📜 License

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