FaceAnalysis · AI 颜值分析

一个移动端优先、单文件、零后端的 AI 颜值评分网页。拍照或选图后，调用多模态大模型对面部做六维分项打分，总分在本地按权重汇总，生成一份暖米金风格的颜值分析报告，可保存为图片或导出文本。

当前版本：FaceAnalysis v1.0.0

---

✨ 功能特性

• 极简流程：选择照片 → 分析 → 查看报告，三步到位，无冗余步骤。
• 调用系统相机/相册：一个「选择」按钮直接唤起原生选择器，可拍照或从相册选取。
• 隐私优先：照片在本机 Canvas 重绘剥离 EXIF / GPS / 时间戳等元数据后再上传；API URL / Key / 模型名仅存于浏览器 localStorage，不经过任何第三方服务器。
• 分项打分 + 本地汇总：模型只返回六个维度的分数，总分由前端本地加权计算，模型不参与总分。
• 演示模式：无需接口即可「跳过」，本地生成随机示例评分，并在报告页醒目标注「非真实结果」。
• 横竖屏自适应：竖屏单栏堆叠，横屏自动切换为左右两栏布局。
• 结果导出：一键保存报告为 PNG 图片（基于本地 html2canvas，离线可用），或导出纯文本。
• 克制专业的文案：中性、非评判性语言，仅给拍照/光线/角度建议，不涉及医美。

🧱 技术栈

• 纯 HTML + CSS + JavaScript，单文件 index.html，无构建、无框架、无后端。
• 大模型通过 OpenAI 兼容的 /chat/completions 视觉接口访问（任意支持图像输入的模型均可）。
• 图片导出依赖本地 html2canvas.min.js（与 index.html 同目录，离线可用）。

🚀 快速开始

1. 保持 index.html 与 html2canvas.min.js 在同一目录。
2. 用浏览器打开 index.html（建议用本地服务器或 HTTPS 以获得最佳相机体验）：

   # 任选一种本地预览方式
   python -m http.server 8000        # 然后访问 http://localhost:8000
   npx serve .                        # 或

3. 首次打开会弹出「接口设置」，填入你的 API 信息（见下），或点「跳过」体验演示模式。
4. 点「选择」拍照/选图 → 「分析」→ 查看报告 → 「保存图片 / 导出文本」。

提示：file:// 直接双击打开时，系统相机/相册选择通常仍可用；但部分浏览器对本地文件调用摄像头有限制，推荐用上面的本地服务器方式。

🔌 接口配置（OpenAI 兼容）

在设置弹框填写三项，全部保存在本机：

字段	说明	示例
API Base URL	接口基址（自动补 /v1/chat/completions）	https://api.deepseek.com
API Key	访问密钥	sk-...
模型名称	必须支持图像输入（vision）	deepseek-flash

已实测可用：DeepSeek deepseek-flash（支持图像输入）。注意 DeepSeek deepseek-v4-pro 不支持图像输入，请勿选用。其他 OpenAI 兼容多模态网关（如通义千问 VL、GPT-4o 等）同理可用。

📊 评分维度与权重

六个维度，每项满分 100，由模型分项打分；总分由本地按下表权重加权求和后四舍五入。

维度	字段	权重	分析依据
面部比例	proportion	25%	三庭是否三等分；五眼（眼距/眼长/脸宽）是否接近标准
对称性	symmetry	20%	左右眉高差、眼位高低差、嘴角倾斜、下颌角左右差异
轮廓骨相	contour	15%	下颌线清晰度、颧骨突出度、面部折叠度
五官协调	harmony	20%	眼/鼻/唇相对大小与面部留白比例是否协调
肤质状态	skin	12%	照片中可见的肤色均匀度、光泽、瑕疵（非皮肤诊断）
气质表现	vibe	8%	眼神放松度、表情自然度（仅小幅加分，不扣分）

评分锚点：70–85 为普通照片集中区间，90+ 接近典型审美模板，60 以下为明显偏离。详见 docs/评分标准.md。

🎭 演示模式

点设置弹框底部「跳过 · 体验演示评分」，即可在无接口情况下随机生成一份示例报告；报告页顶部会显示醒目的「⚠ 演示评分 · 非真实结果」横幅，导出文件也会带演示标注。保存真实接口配置后自动退出演示模式。

🖼 结果导出

• 保存图片：用本地 html2canvas 把整页报告栅格化为 PNG（2 倍清晰度），自动排除操作按钮。
• 导出文本：生成含总分、六维、建议的 .txt。
• 两者文件名均带版本号后缀（如 _v1.0.0）。

📐 横竖屏适配

• 竖屏（portrait）：报告为单栏自上而下堆叠。
• 横屏（landscape，≥820px）：报告切换为「左栏：照片 + 总分 + 分项条 / 右栏：分项详情 + 建议 + 点评」两栏布局。

📁 项目结构

faceanalysis/
├── index.html            # 应用本体（单文件）
├── html2canvas.min.js    # 图片导出依赖（本地，离线可用）
├── DetectFace.png        # 测试样本人脸图
├── README.md
├── CHANGELOG.md
├── LICENSE
├── note.md               # 提示词设计稿 v1（六维扣分制）
├── note2.md              # 提示词设计稿 v2（六维加权制）
├── 效果图原型.html         # 可交互界面原型（竖屏/横屏预览）
└── docs/
    ├── 评分标准.md         # 分项标准与权重、锚点说明
    └── 使用说明.md         # 详细使用与常见问题

⚠️ 已知限制

• CORS：浏览器直连依赖接口开启跨域；DeepSeek 等主流网关已支持，个别自建网关若未开 CORS 会被浏览器拦截。
• 图片导出兼容性：html2canvas 在主流移动浏览器稳定；极少数旧 WebView 可能异常，此时自动回退到文本导出。
• 评分仅针对「单张照片中的面部呈现」，受光线、角度、镜头畸变影响。

🧾 免责声明

本分析仅基于单张照片的视觉呈现，不构成对个人价值或绝对颜值的评价，亦非皮肤或医疗诊断。请仅上传你本人或已获授权的照片。

📄 许可与版本

• 版本策略：语义化版本，修 bug 进补丁位、加功能进次版本位。当前 v1.0.0。
• 许可：MIT License（见 LICENSE）。

👤 作者

yt3000 · github.com/yt3000