Skill 寫法圖鑑

canvas-design

Anthropic | 設計與前端 | 原文 | Apache-2.0

先寫設計哲學,再把它畫成海報或藝術作品的 PNG、PDF

中文翻譯

---
name: canvas-design
description: 運用設計哲學,在 .png 和 .pdf 文件中創作美麗的視覺藝術。當使用者要求製作海報、藝術作品、設計或其他靜態作品時,應該使用這個 skill。創作原創的視覺設計,絕對不要複製既有藝術家的作品,以免侵犯著作權。
license: Complete terms in LICENSE.txt
---

這些指示是用來創造設計哲學,也就是之後會被「視覺化表達」出來的美學運動。只輸出 .md 檔、.pdf 檔和 .png 檔。

分兩個步驟完成:
1. 建立設計哲學(.md 檔)
2. 在畫布上創作來表達它(.pdf 檔或 .png 檔)

先做這個任務:

## 建立設計哲學

一開始,先創造一套「視覺哲學」(不是版型或範本),透過以下方式來詮釋:
- 形式、空間、色彩、構圖
- 影像、圖形、形狀、圖案
- 極少量的文字,當作視覺點綴

### 關鍵的理解
- 收到的是:使用者給的一些細微的輸入或指示,要納入考量,但只當作基礎,不能限制創作的自由。
- 創造的是:一套設計哲學/美學運動。
- 接下來發生的是:同一個版本的你收到這套哲學,然後「用視覺表達它」,創造出 90% 是視覺設計、10% 是必要文字的作品。

可以這樣想:
- 為一個藝術運動寫一份宣言
- 下一階段才是創作藝術作品

這套哲學必須強調:視覺表達。空間傳達。藝術詮釋。極少的文字。

### 如何產生視覺哲學

**幫這個運動取名**(1 到 2 個詞):「Brutalist Joy」 / 「Chromatic Silence」 / 「Metabolist Dreams」

**闡述這套哲學**(4 到 6 段,簡潔但完整):

為了抓住「視覺」的本質,要說明這套哲學如何透過以下面向展現:
- 空間與形式
- 色彩與材質
- 尺度與節奏
- 構圖與平衡
- 視覺層次

**關鍵準則:**
- **避免重複**:每個設計面向只提一次。除非能加進新的深度,否則不要重複講色彩理論、空間關係或字體排印原則。
- **反覆強調工藝**:這套哲學一定要多次強調,最終作品看起來要像花了無數個小時製作、細心琢磨過,而且出自該領域頂尖的人之手。這個框架很重要,要重複使用像「精心打造」、「深厚專業的成果」、「一絲不苟的關注」、「大師級的執行」這類說法。
- **留下創作空間**:美學方向要具體,但要簡潔到讓下一個 Claude 也有空間,以極高的工藝水準做出自己的詮釋選擇。

這套哲學必須引導下一個版本用「視覺」來表達想法,而不是用文字。資訊活在設計裡,不是在段落裡。

### 哲學範例

**「Concrete Poetry」**
哲學:透過紀念碑式的形式和大膽的幾何來溝通。
視覺表達:巨大的色塊、雕塑感的字體排印(超大的單一個字、很小的標籤)、Brutalist 的空間劃分,波蘭海報的能量遇上 Le Corbusier。想法透過視覺重量和空間張力來表達,不靠解釋。文字是罕見而有力的姿態,絕不寫成段落,只有必要的字融入視覺建築裡。每個元素的擺放都有大師級工匠的精準。

**「Chromatic Language」**
哲學:把色彩當成主要的資訊系統。
視覺表達:精準的幾何,色彩區塊創造意義。字體排印極簡,小小的無襯線標籤,讓色域自己說話。想想 Josef Albers 的色彩互動遇上資料視覺化。資訊透過空間和色彩編碼。文字只用來錨定色彩已經顯示的東西。成果來自一絲不苟的色彩校準。

**「Analog Meditation」**
哲學:透過質地和留白帶來安靜的視覺冥想。
視覺表達:紙張紋理、墨水暈開、大片的負空間。攝影和插畫為主。字體排印像耳語(小、克制、為視覺服務)。日本攝影集的美學。影像在頁面間呼吸。文字很少出現,只有短句,絕不是解釋性的大段文字。每個構圖的平衡都像修行般用心。

**「Organic Systems」**
哲學:自然的群聚和模組化的生長模式。
視覺表達:圓潤的形狀、有機的排列、取自自然、透過建築表現的色彩。資訊透過視覺圖解、空間關係、圖像符號來呈現。文字只有懸浮在空間中的關鍵標籤。構圖靠專家級的空間編排來說故事。

**「Geometric Silence」**
哲學:純粹的秩序與克制。
視覺表達:以網格為基礎的精準、大膽的攝影或簡潔俐落的圖形、戲劇性的負空間。字體排印精準但極簡,小小的必要文字,大片安靜的區域。瑞士形式主義遇上 Brutalist 對材質的誠實。靠結構來溝通,不靠文字。每一處對齊都是無數次精修的成果。

*這些是濃縮過的範例。實際的設計哲學應該是 4 到 6 段內容充實的段落。*

### 核心原則
- **視覺哲學**:創造一個要透過設計來表達的美學世界觀
- **極少的文字**:一律強調文字要稀少、只留必要、當作視覺元素融入,絕不冗長
- **空間表達**:想法透過空間、形式、色彩、構圖來傳達,不是靠段落
- **藝術自由**:下一個 Claude 會用視覺詮釋這套哲學,要留給它創作空間
- **純粹的設計**:這是在做藝術品,不是做加了裝飾的文件
- **專家級的工藝**:反覆強調最終作品必須看起來精心打造、細心琢磨,是該領域頂尖的人花了無數小時的成果

**設計哲學應該有 4 到 6 段。** 用富有詩意的設計哲學把核心願景串在一起。避免重複相同的論點。設計哲學要保持通用,不要提到這件作品的用途,好像它可以用在任何地方。把設計哲學輸出成 .md 檔。

---

## 推演出那個細微的參照

**關鍵步驟**:在建立畫布之前,先從原始請求裡找出那條細微的概念線索。

**核心原則**:
主題是一個**嵌在藝術本身裡面、細微而小眾的參照**,不一定是字面的,永遠要精緻。熟悉那個主題的人應該能直覺地感受到,其他人則單純體驗到一幅高明的抽象構圖。設計哲學提供美學語言。推演出來的主題提供靈魂,那是悄悄織進形式、色彩和構圖裡、看不見的概念 DNA。

這件事**非常重要**:這個參照必須精煉,讓它加深作品的層次,卻不張揚。想像爵士樂手引用另一首歌,只有懂的人聽得出來,但每個人都欣賞那段音樂。

---

## 畫布創作

哲學和概念框架都確立之後,就在畫布上表達它。花點時間整理思緒、放空心靈。用你創造的設計哲學和下面的指示,打造出一件傑作,以專家級的工藝體現哲學的每一個面向。

**重要**:不管是什麼類型的內容,就算使用者要的是電影/遊戲/書籍用的東西,做法還是要精緻。永遠不要忘記,這應該是藝術,而不是卡通風或業餘的東西。

要做出博物館或雜誌等級的作品,就以設計哲學為基礎。做出單一頁面、高度視覺化、以設計為導向的 PDF 或 PNG 輸出(除非要求多頁)。一般來說,使用重複的圖案和完美的形狀。把抽象的哲學設計當作一本科學聖經,借用系統性觀察的視覺語言:密集累積的記號、重複的元素,或層層疊加的圖案,透過耐心的重複來建立意義,並且經得起久看。加上稀疏、冷靜的字體排印和系統性的參考標記,讓它看起來可能是某個虛構學科裡的圖表,用通常保留給記錄可觀察現象的那份敬意,來對待這個看不見的主題。用簡單的短句或細節,低調地放置來錨定整件作品,使用有限的色盤,讓它感覺刻意而一致。擁抱這個矛盾:用分析性的視覺語言來表達關於人類經驗的想法。成果應該像一件證物,證明稍縱即逝的東西也能透過細心的關注被研究、描繪和理解。這才是真正的藝術。

**文字是一種視情境而定的元素**:文字永遠極簡、視覺優先,但要讓情境來決定它是耳語般安靜的標籤,還是大膽的字體姿態。龐克演出場地的海報,字體可以比極簡陶藝工作室的識別更大、更有侵略性。大多數時候,字要細。所有字體的使用都必須以設計為導向,並優先考慮視覺傳達。不管文字尺寸多大,都不能有東西掉出頁面,也不能有任何東西重疊。每個元素都必須留有適當邊距,完全包含在畫布範圍內。仔細檢查所有文字、圖形和視覺元素都有呼吸空間和清楚的分隔。要做到專業執行,這一點沒有商量餘地。**重要:如果要寫文字,要用不同的字型。去搜尋 `./canvas-fonts` 目錄。不管用什麼做法,精緻都沒有商量餘地。**

需要什麼字型就下載來用,讓這件事成真。發揮創意,讓字體排印真正成為藝術本身的一部分。如果藝術是抽象的,就把字帶到畫布上,不要用數位排版的方式。

要突破界線,就在以哲學為指導原則的同時,跟隨設計直覺。擁抱最大的設計自由和選擇。把美學和設計推到最前線。

**關鍵**:要達到人手打造的品質(而不是 AI 生成的),就要創作出看起來花了無數小時的作品。讓它看起來像是該領域絕對頂尖的人,一絲不苟地琢磨過每個細節。確保構圖、間距、配色、字體排印,一切都散發專家級的工藝。再三檢查沒有任何東西重疊、格式毫無瑕疵、每個細節都完美。創作出可以拿給別人看、證明專業能力、而且無可否認令人印象深刻的作品。

把最終結果輸出成單一個可下載的 .pdf 或 .png 檔,同時附上所用的設計哲學 .md 檔。

---

## 最後一步

**重要**:使用者「已經」說過:「這還不夠完美。它必須完美無瑕,是工藝的傑作,就像馬上要在博物館展出一樣。」

**關鍵**:要精修作品,不要再加更多圖形;而是精修已經創作出來的東西,讓它極度俐落,完全尊重設計哲學和極簡原則。不要加個有趣的濾鏡或重構字型,而是想想怎麼讓現有的構圖跟藝術更一致。如果直覺是去呼叫一個新函式或畫一個新形狀,停下來,改問自己:「我怎麼讓現在已經有的東西更像一件藝術品?」

再做第二輪。回到程式碼,進一步精修打磨,把它做成一件有哲學設計的傑作。

## 多頁選項

被要求產生更多頁面時,要創作更多與設計哲學一脈相承、但又明顯不同的創意頁面。把這些頁面打包在同一個 .pdf,或是多張 .png。把第一頁當作整本等著被填滿的咖啡桌書裡的其中一頁。讓後面的頁面成為原作獨特的變奏和回憶。讓它們以非常有品味的方式幾乎在說一個故事。盡情發揮創作自由。

英文原文

---
name: canvas-design
description: Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.
license: Complete terms in LICENSE.txt
---

These are instructions for creating design philosophies - aesthetic movements that are then EXPRESSED VISUALLY. Output only .md files, .pdf files, and .png files.

Complete this in two steps:
1. Design Philosophy Creation (.md file)
2. Express by creating it on a canvas (.pdf file or .png file)

First, undertake this task:

## DESIGN PHILOSOPHY CREATION

To begin, create a VISUAL PHILOSOPHY (not layouts or templates) that will be interpreted through:
- Form, space, color, composition
- Images, graphics, shapes, patterns
- Minimal text as visual accent

### THE CRITICAL UNDERSTANDING
- What is received: Some subtle input or instructions by the user that should be taken into account, but used as a foundation; it should not constrain creative freedom.
- What is created: A design philosophy/aesthetic movement.
- What happens next: Then, the same version receives the philosophy and EXPRESSES IT VISUALLY - creating artifacts that are 90% visual design, 10% essential text.

Consider this approach:
- Write a manifesto for an art movement
- The next phase involves making the artwork

The philosophy must emphasize: Visual expression. Spatial communication. Artistic interpretation. Minimal words.

### HOW TO GENERATE A VISUAL PHILOSOPHY

**Name the movement** (1-2 words): "Brutalist Joy" / "Chromatic Silence" / "Metabolist Dreams"

**Articulate the philosophy** (4-6 paragraphs - concise but complete):

To capture the VISUAL essence, express how the philosophy manifests through:
- Space and form
- Color and material
- Scale and rhythm
- Composition and balance
- Visual hierarchy

**CRITICAL GUIDELINES:**
- **Avoid redundancy**: Each design aspect should be mentioned once. Avoid repeating points about color theory, spatial relationships, or typographic principles unless adding new depth.
- **Emphasize craftsmanship REPEATEDLY**: The philosophy MUST stress multiple times that the final work should appear as though it took countless hours to create, was labored over with care, and comes from someone at the absolute top of their field. This framing is essential - repeat phrases like "meticulously crafted," "the product of deep expertise," "painstaking attention," "master-level execution."
- **Leave creative space**: Remain specific about the aesthetic direction, but concise enough that the next Claude has room to make interpretive choices also at a extremely high level of craftmanship.

The philosophy must guide the next version to express ideas VISUALLY, not through text. Information lives in design, not paragraphs.

### PHILOSOPHY EXAMPLES

**"Concrete Poetry"**
Philosophy: Communication through monumental form and bold geometry.
Visual expression: Massive color blocks, sculptural typography (huge single words, tiny labels), Brutalist spatial divisions, Polish poster energy meets Le Corbusier. Ideas expressed through visual weight and spatial tension, not explanation. Text as rare, powerful gesture - never paragraphs, only essential words integrated into the visual architecture. Every element placed with the precision of a master craftsman.

**"Chromatic Language"**
Philosophy: Color as the primary information system.
Visual expression: Geometric precision where color zones create meaning. Typography minimal - small sans-serif labels letting chromatic fields communicate. Think Josef Albers' interaction meets data visualization. Information encoded spatially and chromatically. Words only to anchor what color already shows. The result of painstaking chromatic calibration.

**"Analog Meditation"**
Philosophy: Quiet visual contemplation through texture and breathing room.
Visual expression: Paper grain, ink bleeds, vast negative space. Photography and illustration dominate. Typography whispered (small, restrained, serving the visual). Japanese photobook aesthetic. Images breathe across pages. Text appears sparingly - short phrases, never explanatory blocks. Each composition balanced with the care of a meditation practice.

**"Organic Systems"**
Philosophy: Natural clustering and modular growth patterns.
Visual expression: Rounded forms, organic arrangements, color from nature through architecture. Information shown through visual diagrams, spatial relationships, iconography. Text only for key labels floating in space. The composition tells the story through expert spatial orchestration.

**"Geometric Silence"**
Philosophy: Pure order and restraint.
Visual expression: Grid-based precision, bold photography or stark graphics, dramatic negative space. Typography precise but minimal - small essential text, large quiet zones. Swiss formalism meets Brutalist material honesty. Structure communicates, not words. Every alignment the work of countless refinements.

*These are condensed examples. The actual design philosophy should be 4-6 substantial paragraphs.*

### ESSENTIAL PRINCIPLES
- **VISUAL PHILOSOPHY**: Create an aesthetic worldview to be expressed through design
- **MINIMAL TEXT**: Always emphasize that text is sparse, essential-only, integrated as visual element - never lengthy
- **SPATIAL EXPRESSION**: Ideas communicate through space, form, color, composition - not paragraphs
- **ARTISTIC FREEDOM**: The next Claude interprets the philosophy visually - provide creative room
- **PURE DESIGN**: This is about making ART OBJECTS, not documents with decoration
- **EXPERT CRAFTSMANSHIP**: Repeatedly emphasize the final work must look meticulously crafted, labored over with care, the product of countless hours by someone at the top of their field

**The design philosophy should be 4-6 paragraphs long.** Fill it with poetic design philosophy that brings together the core vision. Avoid repeating the same points. Keep the design philosophy generic without mentioning the intention of the art, as if it can be used wherever. Output the design philosophy as a .md file.

---

## DEDUCING THE SUBTLE REFERENCE

**CRITICAL STEP**: Before creating the canvas, identify the subtle conceptual thread from the original request.

**THE ESSENTIAL PRINCIPLE**:
The topic is a **subtle, niche reference embedded within the art itself** - not always literal, always sophisticated. Someone familiar with the subject should feel it intuitively, while others simply experience a masterful abstract composition. The design philosophy provides the aesthetic language. The deduced topic provides the soul - the quiet conceptual DNA woven invisibly into form, color, and composition.

This is **VERY IMPORTANT**: The reference must be refined so it enhances the work's depth without announcing itself. Think like a jazz musician quoting another song - only those who know will catch it, but everyone appreciates the music.

---

## CANVAS CREATION

With both the philosophy and the conceptual framework established, express it on a canvas. Take a moment to gather thoughts and clear the mind. Use the design philosophy created and the instructions below to craft a masterpiece, embodying all aspects of the philosophy with expert craftsmanship.

**IMPORTANT**: For any type of content, even if the user requests something for a movie/game/book, the approach should still be sophisticated. Never lose sight of the idea that this should be art, not something that's cartoony or amateur.

To create museum or magazine quality work, use the design philosophy as the foundation. Create one single page, highly visual, design-forward PDF or PNG output (unless asked for more pages). Generally use repeating patterns and perfect shapes. Treat the abstract philosophical design as if it were a scientific bible, borrowing the visual language of systematic observation—dense accumulation of marks, repeated elements, or layered patterns that build meaning through patient repetition and reward sustained viewing. Add sparse, clinical typography and systematic reference markers that suggest this could be a diagram from an imaginary discipline, treating the invisible subject with the same reverence typically reserved for documenting observable phenomena. Anchor the piece with simple phrase(s) or details positioned subtly, using a limited color palette that feels intentional and cohesive. Embrace the paradox of using analytical visual language to express ideas about human experience: the result should feel like an artifact that proves something ephemeral can be studied, mapped, and understood through careful attention. This is true art. 

**Text as a contextual element**: Text is always minimal and visual-first, but let context guide whether that means whisper-quiet labels or bold typographic gestures. A punk venue poster might have larger, more aggressive type than a minimalist ceramics studio identity. Most of the time, font should be thin. All use of fonts must be design-forward and prioritize visual communication. Regardless of text scale, nothing falls off the page and nothing overlaps. Every element must be contained within the canvas boundaries with proper margins. Check carefully that all text, graphics, and visual elements have breathing room and clear separation. This is non-negotiable for professional execution. **IMPORTANT: Use different fonts if writing text. Search the `./canvas-fonts` directory. Regardless of approach, sophistication is non-negotiable.**

Download and use whatever fonts are needed to make this a reality. Get creative by making the typography actually part of the art itself -- if the art is abstract, bring the font onto the canvas, not typeset digitally.

To push boundaries, follow design instinct/intuition while using the philosophy as a guiding principle. Embrace ultimate design freedom and choice. Push aesthetics and design to the frontier. 

**CRITICAL**: To achieve human-crafted quality (not AI-generated), create work that looks like it took countless hours. Make it appear as though someone at the absolute top of their field labored over every detail with painstaking care. Ensure the composition, spacing, color choices, typography - everything screams expert-level craftsmanship. Double-check that nothing overlaps, formatting is flawless, every detail perfect. Create something that could be shown to people to prove expertise and rank as undeniably impressive.

Output the final result as a single, downloadable .pdf or .png file, alongside the design philosophy used as a .md file.

---

## FINAL STEP

**IMPORTANT**: The user ALREADY said "It isn't perfect enough. It must be pristine, a masterpiece if craftsmanship, as if it were about to be displayed in a museum."

**CRITICAL**: To refine the work, avoid adding more graphics; instead refine what has been created and make it extremely crisp, respecting the design philosophy and the principles of minimalism entirely. Rather than adding a fun filter or refactoring a font, consider how to make the existing composition more cohesive with the art. If the instinct is to call a new function or draw a new shape, STOP and instead ask: "How can I make what's already here more of a piece of art?"

Take a second pass. Go back to the code and refine/polish further to make this a philosophically designed masterpiece.

## MULTI-PAGE OPTION

To create additional pages when requested, create more creative pages along the same lines as the design philosophy but distinctly different as well. Bundle those pages in the same .pdf or many .pngs. Treat the first page as just a single page in a whole coffee table book waiting to be filled. Make the next pages unique twists and memories of the original. Have them almost tell a story in a very tasteful way. Exercise full creative freedom.