Ümit Tunç
142 lines
7.6 KiB
Markdown
142 lines
7.6 KiB
Markdown
<p align="center">
|
|
<img src="build/icon.png" alt="Dekupai logo — stylized letter D with orange and red wing elements" width="180" />
|
|
</p>
|
|
|
|
<p align="center"><em>Logo: Stylized “D” mark with vibrant orange and red wing motifs — glossy 3D finish.</em></p>
|
|
|
|
# Dekupai 🍊
|
|
### *Premium Glassmorphic AI Background Remover & Decoupage Studio*
|
|
|
|
Developed by **Trunçgil AI**, **Dekupai** is a state-of-the-art desktop application built on **ElectronJS** that leverages the cutting-edge **BiRefNet** (Bilateral Reference Network) deep learning model for extremely high-resolution, pixel-perfect background extraction and image matting.
|
|
|
|
With a beautiful, modern **Glassmorphic interface** themed with glowing neon citrus accents, **Dekupai** bridges the gap between complex AI segmentation workflows and elite creator utilities, enabling instant edge-accurate transparent subject isolation, visual cropping, auto-trimming, custom background compositing, and professional asset exporting.
|
|
|
|
---
|
|
|
|
## ✨ Features
|
|
|
|
- 🍊 **Trunçgil Brand Accentuation**: Stunning glassmorphic dark theme styled with heavy back-filters (`backdrop-filter: blur(28px)`) and organic glowing neon orange and golden orbs.
|
|
- 🧠 **BiRefNet Neural Engine**: State-of-the-art segmentation that handles intricate visual details (e.g. hair, thin lines, translucent materials) using a lightweight CPU-optimized local inference pipeline.
|
|
- ⚙️ **Integrated Environment Setup**: An automated initial setup overlay that checks, builds, and configures an isolated Python virtual environment (`.venv`) and downloads requirements automatically.
|
|
- 📐 **Interactive Cropper Studio**: Full integration with `Cropper.js` enabling precise bounding boxes, standard aspect presets (Square, Story, Cinema, Portrait), 90-degree rotations, and horizontal/vertical mirroring.
|
|
- ⚡ **Native Auto-Trim**: A high-performance client-side pixel iteration algorithm that scans the active transparent alpha borders and instantly snaps the crop boundaries tight around your subject.
|
|
- 🎨 **Creative Background Compositor**:
|
|
- **Transparent Mode**: Keeps alpha transparency (perfect for png stickers and web assets).
|
|
- **Solid Colors**: Burns clean flat fills with quick-selection swatches and a custom color wheel picker.
|
|
- **Premium Gradients**: Composes gorgeous, pre-curated linear gradients behind your isolated subject in real-time.
|
|
- 💾 **Lossless Export Studio**: Composite and save final assets to **PNG (transparent)**, **JPEG**, or **WebP** formats with configurable quality parameter sliders using native system dialogs and helpful "Show in Folder" explorer shortcut notifications.
|
|
|
|
---
|
|
|
|
## 📂 Directory Tree
|
|
|
|
The project structure is organized cleanly as follows:
|
|
|
|
```text
|
|
Dekupai/
|
|
├── backend/
|
|
│ ├── requirements.txt # Python dependency library list (torch, transformers, timm, einops, etc.)
|
|
│ ├── setup.py # Automated virtual environment builder and dependency installer
|
|
│ └── process.py # BiRefNet background segmentation processor (runs local AI inference)
|
|
├── node_modules/ # Electron & frontend packages (Ignored in Git)
|
|
├── .git/ # Git tracking files
|
|
├── .venv/ # Python isolated environment (Ignored in Git)
|
|
├── .gitignore # Git ignore instructions
|
|
├── package.json # Node project scripts, metadata, and dependencies
|
|
├── package-lock.json # Node dependency lock file
|
|
├── main.js # Electron main process (IPC handlers, dialogs, python executors)
|
|
├── preload.js # Secure sandbox context bridge mapping IPC communications
|
|
├── index.html # Main HTML5 layout and inline SVG vectors
|
|
├── styles.css # Glassmorphism styling variables, colors, and layout configurations
|
|
├── renderer.js # Renderer logic, drag-drop loops, cropper lifecycles, and export generators
|
|
└── README.md # Project documentation (This file)
|
|
```
|
|
|
|
---
|
|
|
|
## 🚀 Getting Started
|
|
|
|
### Prerequisites
|
|
|
|
Ensure you have the following installed on your machine:
|
|
* [Node.js](https://nodejs.org/) (v18 or above recommended)
|
|
* [Python](https://www.python.org/) (v3.10 to v3.12 recommended)
|
|
* [Git](https://git-scm.com/)
|
|
|
|
### Installation & Run
|
|
|
|
1. **Move into the project directory**:
|
|
```bash
|
|
cd dekupai
|
|
```
|
|
|
|
2. **Install Node Dependencies**:
|
|
```bash
|
|
npm install
|
|
```
|
|
|
|
3. **Boot the Application**:
|
|
```bash
|
|
npm start
|
|
```
|
|
|
|
4. **Automatic AI Configuration**:
|
|
On your very first launch, the **DEKUPAI Initialization Wizard** will display. Click **Configure Engine (Automatic)**. The system will build a local virtual environment (`.venv`), upgrade pip, and install PyTorch CPU version, Hugging Face transformers, and runtime model dependencies.
|
|
|
|
*All progress is streamed in real-time straight to your dashboard progress bar and system terminal window!*
|
|
|
|
### Packaging & Building
|
|
|
|
To package and compile **Dekupai** into standalone production binaries or installers for Windows and macOS, we use the integrated `electron-builder` engine:
|
|
|
|
* **Build for Windows (NSIS Standalone Installer .exe)**:
|
|
```bash
|
|
npm run build:win
|
|
```
|
|
*Compiles a single-file executable setup installer inside the `dist/` directory.*
|
|
|
|
* **Build for macOS (Standalone DMG Volume .dmg)**:
|
|
```bash
|
|
npm run build:mac
|
|
```
|
|
*Compiles the installer package for Apple Systems inside the `dist/` directory. (Note: You can compile macOS builds on Windows using target overrides, but native signed builds are best run on a macOS host).*
|
|
|
|
* **Compile for Both Platforms Simultaneously**:
|
|
```bash
|
|
npm run build:all
|
|
```
|
|
|
|
---
|
|
|
|
## 📖 Operational Guide
|
|
|
|
### 1. Load an Image
|
|
* Drag and drop any `PNG`, `JPG`/`JPEG`, or `WebP` file directly onto the large glowing dragzone.
|
|
* Or, click **Browse Local Files** and pick an image from your explorer.
|
|
|
|
### 2. Extract Background
|
|
* Click **Extract Subject** in the right-side control tower.
|
|
* The loader box will show real-time progress (`[STATUS] Loading model...`, `[STATUS] Running background removal...`).
|
|
* *Note: During the first extraction, the system will download the BiRefNet model weights (~200MB) from Hugging Face. This occurs only once and is cached for instant future runs.*
|
|
|
|
### 3. Crop & Edit
|
|
* Toggle between the **Drag Mode** (navigate) and **Crop Selection** buttons at the bottom.
|
|
* Apply aspect constraints, rotate, or flip your image.
|
|
* Click **Auto-Trim** to instantly snap the bounding box securely around your transparent subject's non-empty pixels!
|
|
|
|
### 4. Style & Export
|
|
* Select your background fill in Section 3: **Transparent**, **Solid**, or **Gradient**.
|
|
* In Section 4, pick your export format (PNG, JPEG, WebP) and adjust the quality slider.
|
|
* Click **Export Masterpiece**, choose your directory, and save.
|
|
* Click **Show in File Explorer** in the success toast to find your exported file instantly!
|
|
|
|
---
|
|
|
|
## 🍊 Credits & Acknowledgments
|
|
|
|
**Dekupai** is developed under the corporate vision of **Trunçgil Teknoloji** by the software engineering and design expertise of **Ümit Tunç**.
|
|
|
|
**Logo & Brand Identity:** The Dekupai app icon features a stylized capital “D” combined with wing-like elements in orange and red gradients, rendered with a glossy three-dimensional finish — representing speed, precision, and creative elevation.
|
|
|
|
It integrates state-of-the-art AI-powered image segmentation, combining the deep-learning capabilities of **BiRefNet** with high-end glassmorphic client-side controls to deliver professional desktop matting pipelines directly to local workstations.
|