mcpField
D
design

design

github.com/doodledood设计与 UI78103 次安装1 天前更新
代码仓库

关于 design

design 是围绕人的目标、情境和注意力塑造视觉体验的技能。它通过分析使用旅程、选择创意方向和聚焦设计重点来指导工作,同时遵循明确要求与现有设计系统。

主要功能

  1. 01围绕使用者时刻与旅程设计
  2. 02为每一步分配注意力重点
  3. 03选择相关的作品与风格指南
  4. 04用提问或方案变体确定选择
  5. 05遵循明确要求和设计系统

适用场景

  1. 01规划新的视觉作品
  2. 02改进现有设计
  3. 03比较不同体验方案
  4. 04面向不同使用场景设计

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/doodledood/manifest-dev --skill design

安装后在 Claude Code 中输入/design确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

references/artifacts/
apps.md
collections.md
explanations.md
exploration.md
graphics.md
guided-flows.md
index.md
landing-pages.md
presentations.md
reference.md
workspaces.md
references/directions/
campaign.md
cinematic.md
demonstrative.md
editorial.md
human.md
index.md
playful.md
precision.md
quiet-luxury.md
sensory.md
references/instruments/
basis.md
calibration.md
index.md
usage.md
scripts/
appearance-profile.json
appearance.py
artifact-input.py
design-tools.mjs
measurements.mjs

详细介绍

为某一刻的人设计:此刻谁在这里,他们来做什么,要停留多久——只是匆匆一瞥、参加一场会议,还是工作一天。也要清楚我们希望他们做什么——理解某件事、采取行动、信任我们、再次回来——并让设计同时服务于双方。让他们强烈感受到这一刻所需要的情绪,无论是平静还是惊艳,除非请求另有说明。到主题及其所处的世界中寻找视觉创意,从中汲取配色、字体和质感,而不是套用固定的品牌风格。

人的注意力就是预算。在每个时刻——首屏、一张幻灯片、任务中的一个步骤——判断对方此行的目的和我们对他们的期望中,什么最重要,并大胆地把最多的注意力留给它,只要这一刻需要;其他一切都为它服务,或暂且靠后。先走一遍这个人的旅程,找出这些时刻:他们带着的每种情境而来——初次使用、日常任务、出了问题——以及完成任务所需的步骤。每一步都体现该步骤的需求;其他内容则留待下一步。设计最常见的错误,往往是注意力分配不当,或创意呈现得太单薄。以下是应避免的默认做法,而非规则:若请求如此要求,或主题与时刻确有需要,就采用它。

  • 用文字说明,包括操作指示,而视觉呈现、一句话或设计本身就足以表达要点。
  • 重复表达同一内容:再加一张图表、一项计数、一个按钮或一个版块,重复已有内容。
  • 动效在效果呈现后还继续播放、自行播放而非回应用户,或把视线从重点上引开。
  • 页面完全静止,或变化生硬:内容出现时没有过渡,视图、数值或状态突然跳变,而不是平滑过渡,或触摸、悬停后毫无反馈。
  • 使用让内容更难看清的效果(辉光、纹理、叠加层)。
  • 用绘制的图像代替真实图像:用矢量形状构建人物、植物、物品或场景,看起来像剪贴画。景深与丰富感应来自摄影、3D 模型、光线和材质,或仅凭字体与留白来呈现。
  • 组成部分超出这一刻的需要:设计师本应删掉的版块、卡片、徽章、胶囊标签和小图表。
  • 一次展示所有内容:将每个面板、筛选器、统计数据和操作同时摆上屏幕,而不是只展示当前步骤所需的内容,把其余内容放在点按后可见之处。
  • 用装饰代替层级:每一行都放彩色胶囊标签、图标块、表情符号、头像和着色徽章,取代本应由字号、字重、位置和留白来实现的效果。
  • 所有表面都处在同一平面:权重相同的面板并排摆放,没有层叠、光线或景深来表明哪个在前、处于激活状态或次要。
  • 每次都用同一种底色:奶油色、亚麻色、暖棕色或赤陶色,或将它们反转成深浓咖啡色,只是出于习惯,而非源自主题。
  • 对初来乍到或正在轮班工作的人来说,先炫技,再说重点。

设计完成的标志是:当他们以当事人的视角,分别看过这些时刻后,能得到自己想要的,我们也能达成目标,设计传达出这一刻所需的感受,而且删掉任何内容都不会让他们觉得可惜。眯起眼睛看,或将画面模糊、缩小,再来审视:视线首先落在哪里,接着如何移动——这就是这一刻对他们和我们的需要,次要内容绝不能更抢眼。到此为止;之后的修改属于润色,需求方可以再提出。 根据请求、对话和项目,确定预期用途、支持的主张、可用素材和约束。在证据明确时补全这些信息。若缺失信息或尚未解决的选项会实质性影响设计,请提出有针对性的问题,并为创意选择提供具体选项;在收到答案前,不要敲定受影响的选择,同时继续处理其他部分。如果未决选项属于体验选择——例如内容放在哪里、用户如何浏览、每个步骤要求什么——请展示两到三个在该选择上有所不同的方案,并基于产品现有模式制作,让请求者通过查看来选择,而不是用文字询问。如果现场没有人可以回答或选择,例如无人查看的运行调用了此技能,请依据请求、项目和产品现有模式,自行决定每个此类问题和选择;在报告中先逐项说明所选方案及未采用的备选方案。对细微的信息缺口,说明合理假设并继续推进。选择适合概念和约束的视觉技法。

明确要求和现有设计系统优先。任何拟议的偏离都要明确说明。优化现有成果时,保留有效部分,只修改反馈指出的内容;对范围有限的优化,保持现有方向,仅查阅与变更相关的指导。

构思前先做选择

在创作新成果或大幅重新设计之前,先明确其用途,并选择能实现目标的创意方向或组合。根据请求和上下文推断这些选择,并尊重明确表达的偏好。通过索引选择并阅读相关指南。对于重要工作,简要说明所选方案及理由。

问题索引
人们会如何使用这项成果?成果指南
什么样的感受和视觉特征适合这种用途?创意方向

这些只是非穷尽的参考选项,并非必须采用的类别。简报需要时,可以组合或创造方法。融合不同方向时,应为设计确立连贯的核心,并在有帮助时采用辅助特质;不要把每份指南的说明都当作独立要求叠加起来。成果的不同部分可以服务于不同场景,同时保持一致的视觉形象。

在有帮助时参考工具

如需解答有关设计的具体问题,可选工具索引提供对所提供成果的测量数据和观察结果。在此类证据有帮助时阅读;只选择适合相关用户、场景和主题的内容,并对结果保持判断。

评论

支持 Markdown