SuperAPI AI 工具集

bright-green-tech-system-webgl

设计与创作

查看项目

更新于 10-15 21:09

技能介绍

用途:将亮绿色技术设计系统作为整体方向,应用于布局、边框、字体、控件、元数据以及内嵌的 WebGL 可视化区域。适合需要锐利技术感、实验感与结构感的界面,例如合成控制台或构建系统界面;不适用于通用深色 SaaS 或柔和玻璃拟态风格。

主要能力:以深炭色或近黑为底色,配合高可见结构线、容器边框、角标与内部分隔线;使用亮青柠、酸性绿或信号绿作为主导激活色,用于指示器、进度状态、焦点细节、高亮与重要标签,但仅限信号、焦点文字、强调填充与 WebGL 高亮,避免铺满整个界面。采用分栏构图,一侧承载内容、元数据与说明,另一侧承载 WebGL 或 Three.js 可视化区,使其像通电的仪表盘、合成地球、粒子引擎或实时几何视口。

使用方式:优先使用带细描边、轻微背景模糊、可见角标和中央分隔的强外壳容器;正文用简洁无衬线字体,标签、状态读数、流程步骤、百分比与系统元数据用等宽字体;引入小框模块、提示面板、进度轨或状态块,保持精确间距与清晰边框层级;使用遮罩错位显现、淡入上移或受控序列动画。WebGL 面板应作为核心组件,尽量使用真实 canvas 或 Three.js 渲染,配以发光粒子、合成几何或轨道形态,并染上亮绿强调色;保持氛围感与高级感,可用叠加辉光、轻微雾效、平缓相机运动与温和鼠标响应,避免混乱运动与噪声过载。

推荐模式:左内容右 WebGL 的分屏首屏;带外边框、内嵌分隔线与角标括号的硬边容器;等宽流程导航,用编号阶段、系统标签或编译步骤并仅一个绿色激活态;进度条、微小活动点与状态摘要以亮绿为激活色;WebGL 场景由发光粒子、行星结构、节点场或几何运动构成,呼应界面强调色。

可调项:绿色亮度、结构密度、WebGL 突出程度、动效强度与背景纹理。

限制与避免:不要做成无布局纪律的通用绿黑黑客风;不要用亮绿过度饱和整个 UI 导致层级丢失;不要把 WebGL 当作与设计系统脱节的随机首屏装饰;避免柔和圆角消费级应用风格;避免粒子过噪、运动过快或发光层过多影响可读性。资料未提供具体安装命令、代码示例、收费与平台信息。