🎨 颜色搭配助手 (Color Assistant)

基于 D-S 证据理论的智能颜色搭配评价系统

颜色搭配助手 是一款面向工业设计、家居设计、数据可视化及其他颜色搭配设计场景的专业配色评估桌面应用。软件基于上海电力大学 Huang et al. (2026) 发表于 Expert Systems With Applications 的论文，创新性地将 Dempster-Shafer 证据理论引入颜色可辨别性评价，结合经典色彩搭配理论与 AI 大模型，为设计师提供科学、量化的配色决策支持。

---

📋 目录

• 核心功能
• 应用场景
• 技术架构
• 快速开始
• 理论基础
• 项目结构
• 团队信息
• 开发计划

---

🚀 核心功能

1. 📊 DCC 可辨别性评分

独创的 DCC（Discriminability for Color Combinations）评分系统，基于 D-S 证据理论与 Su et al. 信念熵，量化评价多色组合的可辨别性：

DCC 范围	等级	说明
DCC < 2.5	🔴 不易区分	不建议在高风险场景中使用
2.5 ≤ DCC < 3.2	🟡 可接受	可辨别性尚可，关键场景建议优化
DCC ≥ 3.2	🟢 强烈推荐	颜色区分度高，推荐用于关键界面

⚡ 结合用户颜色敏感度测试结果，DCC 阈值可自适应调整。

2. 🎭 美观度评分

基于经典色彩搭配理论，自动评估配色方案的和谐度：

• 互补色（Complementary）— 色相差 ~180°，强对比
• 邻近色（Analogous）— 色相差 0~60°，柔和统一
• 三角色（Triadic）— 色相差 ~120°，均衡活泼
• 四角色（Tetradic）— 双互补对，丰富层次
• 单色调（Monochromatic）— 同色相不同明度，极简优雅

3. 🤖 AI 心情配色推荐

支持 DeepSeek 等大语言模型的智能配色推荐：

• 🗣️ 自然语言输入 — 如"温暖家庭"、"赛博朋克"、"法式浪漫"
• 🧠 AI 理解氛围与风格，生成协调的 5 色调色板
• 🔄 内置 20+ 关键词匹配方案作为离线兜底
• ⚙️ 支持自定义 LLM API 配置（OpenAI 兼容接口）

4. 🎯 场景预设方案库

内置 25+ 专业配色预设，覆盖四大领域：

类别	预设场景
🏭 工业与安全	工业监控面板、航空仪表盘、核电站控制室、交通调度大屏
📈 数据与图表	数据可视化、热力图、金融终端、企业仪表盘
🏥 医疗与健康	医疗设备界面、患者监护仪、药品管理系统
🖥️ 界面设计	深色模式、浅色模式、品牌主题、儿童教育

5. 👁️ 颜色敏感度测试

科学的色觉辨别力测试模块：

• 🎮 15 轮 test，3 个难度等级（简单/中等/困难）
• 📈 精确测量反应时间与正确率
• 🔧 测试结果反哺 DCC 评估阈值，实现个性化评价
• 📊 21 色标准测试色板

6. 📝 历史记录与导出

• 💾 本地持久化存储配色历史（SQLite）
• 🔍 支持关键词搜索历史配色方案
• 📄 一键导出配色评估报告（文本格式）
• 🌐 中英文双语界面

---

🏗️ 应用场景

工业设计

在工业控制面板、设备仪表盘、生产线监控等场景中，颜色是传递状态信息的关键媒介。本软件帮助工业设计师：

• 科学评估告警色组合的可辨别性
• 确保在疲劳、远距离、低光照等恶劣条件下的视觉区分度
• 符合人因工程学规范，降低操作失误风险

家居设计

在家居软装、墙面配色、家具搭配等场景中，和谐的颜色组合是美学基础：

• AI 心情推荐：输入"日式简约"、"北欧极简"、"摩洛哥风情"获取配色灵感
• 美观度评分：量化评估配色方案的和谐程度
• 场景预设：快速浏览 25+ 成熟配色方案

数据可视化

图表、仪表盘、大屏展示中的数据颜色编码直接影响信息传达效率：

• 确保数据系列颜色之间充分可辨
• 适配色盲友好需求（通过敏感度测试发现个体差异）
• 支持热力图渐变配色评估

UI/UX 界面设计

从深色模式到品牌主题，界面配色决定了产品的第一印象：

• 预设深色/浅色/品牌配色方案
• 评估前景色与背景色的对比可辨性
• 支持多色功能按钮/标签的区分度验证

---

🛠️ 技术架构

graph TD
    subgraph Frontend["🖥️ 渲染进程 (React + TypeScript)"]
        A[App.tsx] --> B[LoginPage]
        A --> C[ChoosePage]
        A --> D[MainPage]
        A --> E[ColorTestPage]
        D --> F[LeftPanel]
        D --> G[RightPanel]
        F --> H[ColorPicker]
        F --> I[ScenePresets]
        F --> J[AIRecommend]
        F --> K[SearchHistory]
        G --> L[DCCScore]
        G --> M[HarmonyScore]
        G --> N[Recommendations]
        G --> O[ExportReport]
    end

    subgraph Shared["🧠 共享算法层"]
        P[evidence-theory.ts]
        Q[color-theory.ts]
        R[mood-matcher.ts]
        S[llm-recommend.ts]
        T[scene-presets.ts]
    end

    subgraph Backend["⚙️ 主进程 (Electron)"]
        U[main.ts]
        V[database.ts / SQLite]
        W[preload.ts]
    end

    subgraph External["🌐 外部服务"]
        X[DeepSeek API]
    end

    Frontend --> Shared
    Frontend --> Backend
    Shared --> X

层级	技术栈
桌面框架	Electron 28
前端	React 18 + TypeScript 5
构建工具	Vite 5
数据库	SQLite（better-sqlite3）
AI 接口	DeepSeek API（OpenAI 兼容）
包管理	npm
打包分发	electron-builder（NSIS 安装包）

---

⚡ 快速开始

环境要求

• Node.js ≥ 18
• npm ≥ 9

安装与运行

# 1. 克隆项目
cd color-assistant

# 2. 安装依赖
npm install

# 3. 开发模式启动（同时启动 Vite + Electron）
npm run dev

# 4. 生产构建
npm run build

# 5. 打包为 Windows 安装包
npm run package

配置 AI 推荐

在应用的设置页面中配置 LLM API：

{
  "apiKey": "sk-your-api-key",
  "apiUrl": "https://api.deepseek.com/v1/chat/completions",
  "model": "deepseek-chat"
}

---

📚 理论基础

本软件核心算法基于以下学术论文：

Huang, X., Hong, Z., & Su, X. (2026). Towards perception-driven evaluation of discriminability for HMI color combinations: An evidential modeling framework. Expert Systems With Applications, 313, 131456.

六步评估框架

Step 1: 构建自然光谱面板
  Θ = {IR, R, O, Y, G, C, B, P, UV}
  每色 → 三角模糊数 (a_l, a_m, a_u)

Step 2: 收集用户感知数据
  问卷标记感知颜色位置

Step 3: 构建颜色模糊数
  (a₁, a₂, a₃) from questionnaire data

Step 4: 生成 BBA（基本信念分配）
  模糊数与光谱面板相交 → focal elements → mass

Step 5: 融合颜色组合 BBA
  算术平均融合多色 BBA

Step 6: 信念熵评估可辨别性
  DCC = -Σ m(V) log₂( Σ m(F)·D(V,F) / (2^|V|-1) )

关键创新

1. 首次将 D-S 证据理论引入颜色可辨别性评价
2. 不依赖 RGB 数值，基于人类感知数据建模
3. 支持多色组合一次性评价（传统 ΔE 只能两两比较）
4. 利用 Su et al. 信念熵捕捉命题间不确定性

---

📁 项目结构

color-assistant/
├── index.html                    # 入口 HTML
├── package.json                  # 项目配置
├── tsconfig.json                 # TypeScript 配置
├── tsconfig.main.json            # 主进程 TS 配置
├── vite.config.ts                # Vite 构建配置
├── README.md                     # 项目说明（本文件）
├── SPECS.md                      # 技术规格文档
├── push.ps1                      # 部署脚本
├── public/
│   └── llm-config.js             # LLM 配置注入
└── src/
    ├── main/                     # Electron 主进程
    │   ├── main.ts               # 窗口 & IPC 通信
    │   ├── database.ts           # SQLite 数据库
    │   └── preload.ts            # 预加载脚本
    ├── renderer/                 # React 前端
    │   ├── App.tsx               # 根组件 & 路由
    │   ├── main.tsx              # React 入口
    │   ├── pages/                # 页面
    │   │   ├── LoginPage.tsx     # 登录页
    │   │   ├── ChoosePage.tsx    # 功能选择页
    │   │   ├── MainPage.tsx      # 配色助手主页
    │   │   └── ColorTestPage.tsx # 颜色敏感度测试
    │   ├── components/           # UI 组件
    │   │   ├── LeftPanel.tsx     # 左侧控制面板
    │   │   ├── RightPanel.tsx    # 右侧评估面板
    │   │   ├── ColorPicker.tsx   # 色盘选择器
    │   │   ├── DCCScore.tsx      # DCC 可辨别性评分
    │   │   ├── HarmonyScore.tsx  # 美观度评分
    │   │   ├── Recommendations.tsx # 配色推荐
    │   │   ├── ScenePresets.tsx  # 场景预设
    │   │   ├── AIRecommend.tsx   # AI 心情推荐
    │   │   ├── SearchHistory.tsx # 历史搜索
    │   │   └── ExportReport.tsx  # 报告导出
    │   ├── i18n/                 # 国际化
    │   │   └── I18nProvider.tsx
    │   └── assets/               # 静态资源
    │       └── global.css
    └── shared/                   # 共享算法模块
        ├── evidence-theory.ts    # 证据理论核心（DCC 计算）
        ├── color-theory.ts       # 色彩搭配理论（和谐度）
        ├── mood-matcher.ts       # 心情关键词配色匹配
        ├── llm-recommend.ts      # AI 大模型推荐引擎
        └── scene-presets.ts      # 25+ 场景预设方案库

---

👥 团队信息

角色	说明
算法顾问	Xuying Huang, Ziying Hong, Xiaoyan Su — 提供 D-S 证据理论颜色评价方法论
软件开发	Color Assistant Team
领域顾问	工业设计 / 人因工程领域专家

致谢

本项目核心算法基于上海电力大学 Huang, Hong & Su 发表于 Expert Systems With Applications (2026) 的研究成果。感谢作者团队在颜色可辨别性评价领域的开创性工作。

---

📅 开发计划

v1.0（当前版本）✅

• DCC 可辨别性评分系统
• 美观度评分（5 种经典配色方案）
• AI 心情配色推荐（DeepSeek + 离线兜底）
• 25+ 场景预设方案库
• 颜色敏感度测试
• 历史记录与搜索
• 报告导出
• 中英文双语界面
• Windows 桌面应用打包

v1.1（规划中）🔜

• 色盲模拟模式（红绿色盲 / 蓝黄色盲）
• 配色方案对比功能
• 批量导入颜色（CSV/JSON）
• 自定义场景预设编辑器
• 更多 AI 模型支持（GPT-4 / 智谱 GLM / 文心一言）
• 配色方案社区分享

v2.0（远期规划）💡

• Web 在线版（PWA）
• macOS / Linux 跨平台支持
• 插件系统（自定义评分算法）
• 团队协作与云同步
• 移动端适配（React Native）
• 与设计工具集成（Figma 插件）

---

📄 License

本项目仅供学术研究与学习使用。核心算法引用自 Huang et al. (2026)，版权归原作者所有。

---

_{Built with ❤️ for designers and researchers}