126 lines
6.4 KiB
Markdown
126 lines
6.4 KiB
Markdown
|
|
# 🎨 THIẾT KẾ HỆ THỐNG PRESET MÀU CHUYÊN SÂU (GIẢ LẬP PHIM INSTAX)
|
|
|
|
Mục tiêu: Định nghĩa một cấu trúc dữ liệu chuẩn hóa (JSON Schema) chứa đầy đủ các thông số xử lý ảnh nâng cao để áp dụng trực tiếp lên kính ngắm Camera thời gian thực và cho phép người dùng tự thiết kế custom preset.
|
|
|
|
---
|
|
|
|
## 📁 1. Cấu Trúc Dữ Liệu Tổng Hợp (JSON Schema)
|
|
|
|
Mọi tệp cấu hình Preset (nằm trong thư mục hệ thống `assets/presets/` hoặc do người dùng tự lưu trong bộ nhớ máy) sẽ tuân theo định dạng chuẩn hóa dưới đây. Các giá trị số được quy ước trong khoảng từ `-1.0f` đến `1.0f` để tối ưu cho việc tính toán đồ họa phần cứng.
|
|
|
|
```json
|
|
{
|
|
"id": "instax_faded_warm_01",
|
|
"name": "Instax Nắng Chiều",
|
|
"theme_category": "Retro Vintage",
|
|
"is_editable": true,
|
|
"basic_adjustments": {
|
|
"brightness": 0.05,
|
|
"contrast": -0.15,
|
|
"saturation": -0.20,
|
|
"vibrance": 0.25,
|
|
"temperature": 0.18,
|
|
"tint": -0.02
|
|
},
|
|
"advanced_effects": {
|
|
"clarity": -0.20,
|
|
"dehaze": -0.15,
|
|
"vignette_amount": 0.35
|
|
},
|
|
"tone_curve_emulation": {
|
|
"faded_black_level": 0.12,
|
|
"shadows_tint_r": 0.0,
|
|
"shadows_tint_g": 0.04,
|
|
"shadows_tint_b": 0.08
|
|
},
|
|
"film_grain": {
|
|
"grain_amount": 0.28,
|
|
"grain_size": 0.15
|
|
}
|
|
}
|
|
|
|
```
|
|
|
|
---
|
|
|
|
## ⚙️ 2. Giải Thích Ý Nghĩa Các Thông Số Trong Nhiếp Ảnh Chân Dung/Photobooth
|
|
|
|
Để giả lập chính xác chất ảnh Instax/Polaroid hoài cổ, ba thông số mới đóng vai trò quyết định cấu trúc của bức ảnh:
|
|
|
|
* **Vibrance (Bão hòa thông minh):** Khác với *Saturation* tăng màu đồng đều dễ làm cháy da người, *Vibrance* chỉ tăng cường các màu còn nhạt và chủ động né tông màu da. Công thức tạo màu phim luôn là: **[Giảm Saturation (-20%) + Tăng Vibrance (+25%)]** để màu bối cảnh trong trẻo mà da mặt nhân vật vẫn hồng hào tự nhiên.
|
|
* **Clarity (Độ rõ nét vùng Midtone):** Đối với phong cách Vintage/Instax mờ ảo, thông số này thường được đặt giá trị **Âm (Negative Clarity từ -15% đến -30%)**. Việc giảm Clarity sẽ làm dịu các vùng chuyển góc gắt, tạo hiệu ứng mịn da tự nhiên và làm bức ảnh có cảm giác "mềm mại", mơ màng giống ống kính nhựa của máy phim cổ.
|
|
* **Dehaze (Điều chỉnh độ trong suốt/Khói mù):** Khi đặt giá trị **Âm (Negative Dehaze từ -10% đến -25%)**, bộ lọc sẽ cố tình bơm thêm một lớp "sương mờ" nhẹ vào bức ảnh. Hiệu ứng này mô phỏng hiện tượng lọt sáng nhẹ (Light leak) hoặc sự suy giảm hóa chất của các tấm phim lấy liền theo thời gian.
|
|
|
|
---
|
|
|
|
## 💻 3. Lập Trình Lớp Đối Tượng Trên Android Native (Kotlin)
|
|
|
|
Tạo file `ColorPreset.kt` để quản lý các thông số này trong code logic ứng dụng:
|
|
|
|
```kotlin
|
|
package com.photobooth.app.model
|
|
|
|
data class ColorPreset(
|
|
val id: String,
|
|
var name: String,
|
|
val themeCategory: String,
|
|
val isEditable: Boolean,
|
|
val basic: BasicAdjustments,
|
|
val advanced: AdvancedEffects,
|
|
val toneCurve: ToneCurveEmulation,
|
|
val grain: FilmGrain
|
|
)
|
|
|
|
data class BasicAdjustments(
|
|
var brightness: Float, // -1.0f đến 1.0f
|
|
var contrast: Float, // -1.0f đến 1.0f
|
|
var saturation: Float, // -1.0f đến 1.0f
|
|
var vibrance: Float, // -1.0f đến 1.0f -> Bảo vệ màu da người
|
|
var temperature: Float, // -1.0f đến 1.0f -> Ấm (vàng) / Lạnh (xanh)
|
|
var tint: Float // -1.0f đến 1.0f -> Xanh lá / Hồng dâu
|
|
)
|
|
|
|
data class AdvancedEffects(
|
|
var clarity: Float, // -1.0f đến 1.0f -> Giảm để làm mịn thơ mộng
|
|
var dehaze: Float, // -1.0f đến 1.0f -> Giảm để tạo lớp sương hoài cổ
|
|
var vignetteAmount: Float // 0.0f đến 1.0f -> Bo tối 4 góc ảnh
|
|
)
|
|
|
|
data class ToneCurveEmulation(
|
|
var fadedBlackLevel: Float, // Nâng đáy màu đen thành xám sờn
|
|
var shadowsTintR: Float,
|
|
var shadowsTintG: Float,
|
|
var shadowsTintB: Float // Ám màu xanh rêu/xanh biển vào vùng tối
|
|
)
|
|
|
|
data class FilmGrain(
|
|
var grainAmount: Float, // Độ đậm hạt nhiễu
|
|
var grainSize: Float // Kích thước hạt nhiễu phim
|
|
)
|
|
|
|
```
|
|
|
|
---
|
|
|
|
## 🔄 4. Quy Trình Xử Lý Tương Tác Tùy Biến (Custom Workflow)
|
|
|
|
1. **Bước 1: Người dùng tinh chỉnh bộ thông số nâng cao:** Giao diện Slider.
|
|
Trong chế độ chỉnh sửa, ứng dụng hiển thị một danh sách các thanh cuộn dọc hoặc ngang (SeekBars/Sliders) tương ứng với: *Vibrance, Clarity, Dehaze, Grain...* Người dùng kéo chỉnh thay đổi giá trị trực tiếp.
|
|
|
|
|
|
2. **Bước 2: Áp dụng Real-time qua OpenGL ES / Vulkan:** Render Shader.
|
|
Mỗi khi Slider thay đổi, giá trị float mới được đẩy thẳng vào một chương trình đồ họa phần cứng (Custom Fragment Shader). GPU sẽ xử lý tính toán màu sắc, độ mịn (Clarity), và độ mờ (Dehaze) trên luồng Surface của CameraX ở tốc độ 60 khung hình/giây.
|
|
|
|
|
|
3. **Bước 3: Đóng gói và Ghi tệp JSON cá nhân:** Serialization.
|
|
Khi người dùng ấn "Lưu làm Preset của tôi", đối tượng `ColorPreset` chứa các thông số tùy biến mới sẽ được serialize sang chuỗi JSON bằng thư viện GSON. File này được ghi vào thư mục `context.filesDir` (bộ nhớ riêng an toàn của app).
|
|
|
|
|
|
---
|
|
|
|
## 📅 5. Danh Sách Các Việc Cần Làm Tiếp Theo (Checklist)
|
|
|
|
* [ ] **Xây dựng Custom Slider View:** Thiết kế các thanh trượt có phong cách tối giản với con trỏ (thumb) màu cam bám sát theo triết lý UX mới.
|
|
* [ ] **Tích hợp GPUImage cho Android:** Sử dụng thư viện `GPUImage` (hoặc viết OpenGL Shader thuần) để hiện thực hóa các bộ lọc toán học cho `VibranceFilter`, `ClarityFilter` (chuyển đổi dựa trên thuật toán Unsharp Mask) và `VignetteFilter`.
|
|
* [ ] **Đồng bộ hóa sang iOS:** Đảm bảo cấu trúc JSON này khi đưa sang iOS sẽ được phân tích (Parse) bằng giao thức `Decodable` của Swift thành một struct tương đương nhằm gọi các filter chuẩn của Apple như `CIVibrance` và `CILinearToSRGBToneCurve`. |