棱镜 Prism — AI 创作套件中文 WEB / iOS 双端 UI 套件

技术信息

语言技术
UI系统类型
iOS应用、Web行业分类
内容平台、人工智能演示地址
https://prism-ui-kit.netlify.app/

作品详情

行业场景

在线预览：https://prism-ui-kit.netlify.app/
Prism 棱镜是一个面向独立创作者与小团队的 AI 创作套件概念项目，目标是让一句提示词同时产出图像、视频与可编辑画布。适用场景包括品牌视觉、内容创作、短视频与电商素材；本次交付聚焦中文 WEB 与 iPhone 双端 10 页 UI 套件，强调同一套 IA 在桌面与手机上的重新组织，而不是把网页缩小。

功能介绍

套件覆盖 10 个页面：落地页、引导、首页、AI 对话、创作/生成、画布编辑、素材库、项目展示、用量账单、个人设置。功能包括提示词生成、批量变体、画布帧与批注、素材筛选与再创作、积分与套餐管理、团队与偏好设置。WEB 端为 1440×900 桌面布局，iOS 端为 393×852 原生式布局，含状态栏、底部 Tab、安全区与触控尺寸。

项目实现

我负责产品 IA、10 页界面与双端适配：WEB 端用 10 个本地设计系统各做一屏，再收敛为一套统一单系统；iOS 端按 IA 重建导航、底部 Tab、安全区与触控尺寸，不做网页缩放。技术栈为手写 HTML/CSS、Playwright 截图与像素门禁；亮点是设计 token 可追溯、图像自有、英文母版先行、中文 A 版排版。