Halftone UI Collage(网点 UI 拼贴)

SkillMonitoring & ops

Compiles articles, products, or workflow topics into a halftone UI collage banner prompt: foreground seated figure, desk monitor over the shoulder, large headline on the left, flat UI cards on the right. For use in a 5:2 editorial collage banner.

Available today. Use it from your connected AI after setup.

Connect ahel once, and every AI you use reads what you have installed.

Then ask your AI: use the Halftone UI Collage(网点 UI 拼贴) skill

What this skill tells your AI

The instructions your AI receives, as published by fanzr-arch/phil-design-skills in halftone-ui-collage/SKILL.md and read by ahel’s review.

把主题编译为一条可直接出图的提示词。这个 Skill 的固定叙事是:人正在一张真实的桌面工作站前工作,而不是“人物后面摆一台笔记本”或“屏幕挡在人物胸前”。

固定空间关系

  • 一个人坐在前景办公椅上,身体略转,脸和上半身完整可见。
  • 一台无品牌横向桌面显示器放在其身后或侧后方的桌面后段,从一侧肩膀后露出。
  • 显示器必须有薄边框、真实支架和清晰可见的底座;键盘和鼠标平放在它前方的桌面上。
  • 屏幕、支架、底座、键盘和鼠标属于同一张桌面;显示器不能漂浮、不能像独立产品,也不能遮住人物。
  • 默认只用一台桌面显示器。不要笔记本、平板、第二显示器或“屏幕加一条薄键盘”的伪设备。

画幅与风格 DNA

  • 画幅固定为 5:2,建议 3200×1280high
  • 左三分之一:kicker + 两行超大标题;中部:人物与桌面工作站;右三分之一:两张异构白色 UI 卡 + 一枚 chip。
  • 人物、办公椅、显示器外壳和键盘用黑白细网点;人物轮廓内部可加入克制的抽象抖动颗粒、墨点和柔和噪点过渡,但脸部必须清晰。
  • 屏幕和卡片保持扁平干净;背景、桌面和底部有机形状可以铺一层低对比暖纸纤维与印刷颗粒,增强触感,但不能影响文字、图表和轮廓清晰度。
  • 白色贴纸描边只跟人物轮廓,不跟显示器、桌子、键盘或卡片。
  • 五色分工:INK 用于文字/图标/涂鸦,SWASH 只用于人物后方笔刷,ACCENT 只用于状态高亮,ORGANIC 只用于底角色块与植物线,GREY 只用于占位条和细线。
  • 底角有机色块高度低于画面 18%;右侧两张卡必须一张图形卡、一张行列卡,结构不同。

输入与工作流

从用户输入推断主题、标题、人物身份、屏幕内容、两张卡片和配色;不要要求填写表单。

**标题语言规则:**严格继承用户的标题语言。中文输入就输出中文 kicker、标题和卡片标签;英文输入就输出英文。单张图内所有可读文字只能用同一种语言,绝不自行中英混排。

  1. references/module-library.md 选择一套配色、一种人物姿态、一个图形卡、一个行列卡和一种屏幕内容。
  2. 将其填入 references/compile-contract.md 的成品骨架;每条成品 prompt 都必须完整写出“人物前景 + 肩后桌面显示器”的空间关系。
  3. 成组出图时,先列出五张的模块组合,避免配色、屏幕和卡片重复。
  4. 输出一条完整英文 prompt;仅在用户要求时说明选型理由。

质量门槛

  • 人物在前景坐姿,脸和上半身没有被屏幕挡住。
  • 显示器在肩后,支架与底座落在桌面;键盘和鼠标在它前方。
  • 只有一位人物和一台桌面显示器;没有笔记本、平板、浮空屏、重复设备或不可能的接触。
  • kicker、标题和卡片标签与用户输入同语言,且单张图没有中英混排。
  • 网点与人物噪点不爬到屏幕或卡片;白描边不爬到家具。背景、桌面可有极轻微纸张颗粒,不得变脏或发糊。
  • 两张卡异构;屏幕只用占位条,不出现可读句子;没有品牌 logo 或水印。

Read

  • 必读:references/compile-contract.md(固定空间关系与成品提示词骨架)。
  • 选型:references/module-library.md(配色、姿态、卡片与屏幕模块)。
  • 示例:references/examples.md(一个正确构图的完整示例)。

Guardrails

  • 用视觉特征描述风格,不点名艺术家;真实产品一律泛化为无品牌 UI。
  • 人物为虚构泛型人物;若使用真实人物,先确认本人同意。
  • 出图偏差时只改一个变量;优先检查空间关系和设备完整性,不要堆叠风格形容词。

Signals

GitHub stars
78
Forks
4
Last commit
Aug 2026
Advanced
Catalog kind
skill
Gateway key
halftone-ui-collage
Source
github.com/fanzr-arch/phil-design-skills
Halftone UI Collage(网点 UI 拼贴) (halftone-ui-collage) · ahel