mcpField
C
canvas-design

canvas-design

github.com/sickn33创意与媒体48.7k728 次安装今天更新
代码仓库

关于 canvas-design

将设计理念转化为视觉作品的画布设计流程,面向需要制作独立艺术视觉稿的创作者。流程先撰写视觉哲学,再依据其创作单页 PDF 或 PNG,并提供 Markdown 理念文档。

主要功能

  1. 01撰写 4–6 段视觉哲学
  2. 02从需求提炼隐含概念线索
  3. 03创作单页视觉画布
  4. 04输出 PDF 或 PNG 与 Markdown
  5. 05检查边界、间距和元素重叠

适用场景

  1. 01为创意简报建立视觉方向
  2. 02制作单页海报或艺术作品
  3. 03将抽象主题转化为视觉构图

安装

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

$npx skills add https://github.com/sickn33/agentic-awesome-skills --skill canvas-design

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

包含的文件

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

LICENSE.txt
canvas-fonts/
ArsenalSC-OFL.txt
BigShoulders-OFL.txt
Boldonse-OFL.txt
CrimsonPro-OFL.txt
BricolageGrotesque-OFL.txt
DMMono-OFL.txt
EricaOne-OFL.txt
GeistMono-OFL.txt
IBMPlexMono-OFL.txt
Gloock-OFL.txt
Italiana-OFL.txt
InstrumentSans-OFL.txt
JetBrainsMono-OFL.txt
LibreBaskerville-OFL.txt
Jura-OFL.txt
NothingYouCouldDo-OFL.txt
Outfit-OFL.txt
NationalPark-OFL.txt
Lora-OFL.txt
PoiretOne-OFL.txt
PixelifySans-OFL.txt
SmoochSans-OFL.txt
Tektur-OFL.txt
Silkscreen-OFL.txt
YoungSerif-OFL.txt
WorkSans-OFL.txt
RedHatMono-OFL.txt

详细介绍

以下是用于创建设计理念的说明——也就是将通过视觉方式呈现的美学运动。请按要求输出 .md、.pdf 或 .png 文件。

分两步完成:

  1. 创建设计理念(.md 文件)
  2. 在画布上进行视觉呈现(.pdf 文件或 .png 文件)

首先,完成以下任务:

创建设计理念

首先,创作一种视觉理念(不是版式或模板),并通过以下元素加以诠释:

  • 形式、空间、色彩、构图
  • 图像、图形、形状、图案
  • 作为视觉点缀的少量文字
关键认知
  • 收到的内容:用户的需求说明、必需内容、品牌规范、尺寸、无障碍需求和输出格式。保留这些限制,并在其范围内自由创作。
  • 创作的内容:一种设计理念/美学运动。
  • 接下来要做的事:后续阶段将由同一版本接收此理念,并以视觉方式呈现——创作出视觉设计占 90%、必要文字占 10% 的作品。

可以这样开展:

  • 为一场艺术运动撰写宣言
  • 下一阶段创作艺术作品

理念必须强调:视觉表达、空间传达、艺术诠释、文字精简。

如何构思视觉理念

为这场运动命名(1–2 个词):例如“野性欢愉”/“彩色静默”/“代谢之梦”。

阐述理念(4–6 段,简洁而完整):

为捕捉视觉本质,请说明这一理念如何体现于:

  • 空间与形式
  • 色彩与材质
  • 尺度与节奏
  • 构图与平衡
  • 视觉层级

重要指导原则:

  • 避免重复:每个设计要素只提及一次。除非能带来新的深度,否则不要重复谈论色彩理论、空间关系或字体原则。
  • 反复强调精湛工艺:理念必须多次强调,最终作品应呈现出仿佛耗费无数小时精心打磨的质感,体现细致用心,并出自领域顶尖高手之手。这一要求至关重要;请反复使用“精心制作”“深厚专业功底的结晶”“倾注耐心与专注”“大师级执行”等表述。
  • 留出创作空间:明确美学方向,同时保持简洁,让下一位 Claude 有空间以同样高超的工艺水准进行诠释。

理念应引导下一版本以视觉方式表达思想,而非依赖文字。信息应融入设计,而非写成段落。

设计哲学示例

"具象诗" 哲学:通过纪念碑式的形态与大胆的几何结构进行传达。 视觉表达:大面积色块、雕塑感的字体排版(巨大的单个词语,微小的标签)、粗野主义的空间划分,融合波兰海报的张力与勒·柯布西耶的风格。观念通过视觉重量与空间张力来表达,而非解释。文字是稀少而有力的手势,绝不是段落,只有必要的词语,并融入视觉架构之中。每个元素的位置都如同大师工匠般精确。

"色彩语言" 哲学:色彩是首要的信息系统。 视觉表达:几何精确性,色域承载意义。字体极简,使用小型无衬线标签,让色块场域自行传达信息。可以参考约瑟夫·阿尔伯斯的互动色彩研究与数据可视化的结合。信息以空间和色彩的方式编码。文字只用于锚定色彩已经呈现的内容。成果来自细致入微的色彩校准。

"模拟冥想" 哲学:通过纹理与留白实现安静的视觉沉思。 视觉表达:纸张纹理、墨迹晕染、大面积负空间。摄影与插画占据主导。字体轻柔克制(小巧、节制,服务于视觉)。带有日本摄影集的审美气质。图像在页面间呼吸。文字稀疏出现,只有简短短语,绝不是解释性的文本块。每个构图都以冥想修行般的用心来平衡。

"有机系统" 哲学:自然的聚集与模块化的生长模式。 视觉表达:圆润的形态、有机的排布,色彩源自自然,并经由建筑呈现。信息通过视觉图示、空间关系与图标来展示。文字仅用于漂浮在空间中的关键标签。构图借助精湛的空间编排讲述故事。

"几何寂静" 哲学:纯粹的秩序与克制。 视觉表达:基于网格的精确性,大胆的摄影或简练的图形,戏剧性的负空间。字体精确而极简,只有少量关键文字,配以大片安静的区域。融合瑞士形式主义与粗野主义的材料诚实。结构进行传达,而非文字。每一次对齐都是无数次打磨的成果。

以上为精简示例。正式的设计哲学应包含 4 至 6 段充实的文字。

核心原则
  • 视觉哲学:创造一种通过设计来表达的审美世界观
  • 极简文字:始终强调文字稀少、只保留必要内容,并作为视觉元素融入其中,绝不冗长
  • 空间表达:观念通过空间、形态、色彩与构图来传达,而非段落
  • 艺术自由:下一位 Claude 将以视觉方式诠释该哲学,应给予充分的创作空间
  • 纯粹设计:此举旨在创作艺术物件,而非带有装饰的文档
  • 精湛工艺:反复强调最终作品必须呈现精心打磨、一丝不苟的质感,宛如该领域顶尖的人士耗费无数时日的成果

设计哲学应为 4 至 6 段。 以富有诗意的设计哲学填充内容,汇聚核心愿景。避免重复相同的观点。保持设计哲学的通用性,不提及艺术的具体意图,使其可以用于任何场合。将设计哲学输出为 .md 文件。


推断隐晦的指涉

关键步骤:在创建画布之前,先从原始请求中识别出隐晦的概念线索。

核心原则: 主题是嵌入在艺术作品本身中的、隐晦而小众的指涉,不一定是字面的,但必定是精巧的。熟悉该主题的人应能直观地感受到它,而其他人只会体验到一幅精湛的抽象构图。设计理念提供美学语言,推断出的主题则提供灵魂,即悄然融入形式、色彩与构图之中的安静概念基因。

这一点非常重要:指涉必须经过打磨,以增强作品的深度,而不能刻意张扬。就像爵士乐手引用另一首歌曲的旋律:只有懂的人才会听出来,但所有人都能欣赏音乐本身。


画布创作

既然设计理念和概念框架都已确立,就将其呈现在画布上。花片刻时间整理思绪、清空杂念。运用已确立的设计理念,并遵循以下说明,精心打造一件杰作,以专业技艺体现理念的方方面面。

重要:无论内容类型如何,即使用户要求创作与电影、游戏或书籍相关的作品,也应采用成熟精致的方式。始终牢记,这应该是一件艺术作品,而不是卡通化或业余的作品。

若要创作出博物馆或杂志级别的作品,请以设计理念为基础。制作一份单页、视觉表现力强且以设计为先的 PDF 或 PNG 文件(除非用户要求多页)。通常应使用重复图案和完美几何形状。将抽象的哲学设计视为一部科学圣典,借鉴系统观察的视觉语言——密集累积的笔触、重复元素或层叠图案,通过耐心重复逐步构建意义,并值得观者长久凝视。加入稀疏、冷静的字体排印和系统化的参考标记,让作品仿佛来自某个虚构学科的图表;以记录可观测现象时通常才有的敬意,呈现不可见的主题。以简短的词句或细节作为视觉锚点,巧妙地安置于画面中,并采用有限而协调、体现明确意图的配色。拥抱以分析性的视觉语言表达人类体验的理念悖论:最终作品应像一件实物,证明稍纵即逝之物也能通过细致观察得到研究、绘制和理解。这才是真正的艺术。

文字作为语境元素:文字始终应简洁,并以视觉表现为先,但应根据语境决定文字是低调轻柔的标签,还是大胆醒目的排印设计。朋克演出场地的海报可以采用比极简主义陶艺工作室视觉识别更大、更具冲击力的字体。大多数情况下,字体应纤细。所有字体的使用都必须以设计为先,并优先考虑视觉传达。无论文字大小,都不能超出页面,也不能彼此重叠。每个元素都必须位于画布边界内,并留出适当页边距。仔细检查所有文字、图形和视觉元素,确保周围留有呼吸空间,且彼此清晰分隔。这是专业执行不可妥协的要求。重要:如果要写文字,请使用不同字体。搜索 ./canvas-fonts 目录。无论采用何种方式,精致感都不可妥协。

优先使用相对于此技能安装目录解析的捆绑字体。检查每种字体随附或嵌入的许可证,并在重新分发字体时保留所需的署名信息;有些字体系列的许可证信息仅嵌入在字体元数据中。仅从授权来源下载具有已核实使用权的其他字体。不要在系统范围内安装字体,也不要仅为满足审美选择而获取来源不明的文件。发挥创意,让字体真正成为艺术的一部分——如果作品是抽象的,就将字体融入画布,而不是以数字排版的方式添加。

为了突破边界,在以设计理念为指导原则的同时,遵循设计直觉。充分拥抱设计上的自由与选择。将美学与设计推向前沿。

至关重要:为了达到精致的视觉效果,创作出仿佛耗费无数工时的作品。让作品看起来像是由该领域顶尖人士倾注心血、一丝不苟地打磨每个细节。确保构图、间距、配色、字体排印——一切都展现出专家级的精湛工艺。仔细检查,确保没有任何元素重叠、排版毫无瑕疵、每个细节都尽善尽美。创作出足以向他人证明专业实力、令人无可置疑地赞叹的作品。

将最终成果输出为单个可下载的 .pdf 或 .png 文件,并附上作为 .md 文件的设计理念。

最后一步

重要:根据实际用户简报检查并完善初稿。不要编造此前的用户反馈,也不要暗示作品出自人类之手或耗费了多少时间。

关键:完善作品时,不要添加更多图形;应精修已创作的内容,使其极为清晰利落,并完全遵循设计理念和极简原则。与其添加有趣的滤镜或重新设计字体,不如思考如何让现有构图与艺术风格更加协调。如果你想调用新函数或绘制新形状,请停下来,转而思考:“如何让现有内容更具艺术性?”

再检查一遍。回到代码中进一步打磨,使其成为一件设计理念深刻的杰作。

多页选项

如需创建更多页面,请沿用设计理念创作风格相近但又各具特色的新页面。将这些页面整合到同一个 .pdf 文件中,或输出为多个 .png 文件。把第一页视为一本等待填满的精装艺术书中的单页。后续页面应展现独特的新意,同时保留原作的记忆。以雅致的方式,让它们仿佛共同讲述一个故事。尽情发挥创意。

导出验证

选择当前环境中可用的渲染器,例如 PDF 绘图库或图像画布;不要假定环境中已有打包好的生成器。明确设置页面尺寸和单位,渲染预览,并检查文字是否被裁切、页边距、重叠、对比度和字形覆盖情况,然后提供实际保存文件的链接。对于 PDF,请确认页数和嵌入字体;对于 PNG,请确认像素尺寸和目标用途所需的分辨率。即使稀疏的文字更符合美学,也要保留所有要求的原文措辞。

适用场景

适用于原创海报、视觉构图和设计宣言等静态 PDF 或 PNG 即可满足需求的场景。

局限性

  • 此资源包提供指南和字体,不提供可执行的设计或导出流程。渲染和视觉检查取决于可用工具。
  • 美学判断具有主观性;没有依据时,不要声称作品达到博物馆级水准、出自人工创作、耗费数小时制作,或符合无障碍要求。
  • 检查字体名称/许可证元数据,不能证明所有字形的质量,也不能替代全面的字体渲染和安全验证。
  • 不要将输出视为针对特定环境的验证、测试或专家审查的替代品。
  • 如果缺少必要输入、权限、安全边界或成功标准,请暂停并请求澄清。

评论

支持 Markdown