An AI skill is a structured system prompt or set of custom instructions that gives AI assistants like ChatGPT, Claude, and Gemini specialized capabilities. It includes a clear role definition, specific knowledge areas, step-by-step processes, and quality criteria that help AI perform specific professional tasks.

How does Skill This work?

Simply describe your professional expertise in plain text. Our free AI skill generator analyzes your input and transforms it into a structured system prompt. The skill is then graded on clarity, specificity, and usefulness. You can share your skill via a unique URL or copy it to use as custom instructions with any AI assistant like ChatGPT, Claude, or Gemini.

Is Skill This free to use?

Yes, Skill This is completely free. No account or payment is required. You can create unlimited skills and share them with anyone.

How is my skill graded?

Skills are graded on a scale from A+ to F (0-100 points). The grade reflects how clear, specific, and actionable your skill is. Higher grades indicate skills that AI assistants can use more effectively.

How do I use my skill with an AI assistant?

Copy your generated skill and paste it into the system prompt or custom instructions of any AI assistant. For ChatGPT, use Personalization > Custom Instructions. For Claude, add it to a Project's instructions. For Cursor or other IDEs, save it as a .cursorrules or CLAUDE.md file. The AI will then adopt that skill and perform tasks according to your expertise.

AI Skill Report Card

Designing Book Layouts

A-84·Aug 26, 2026·Source: Web

Markdown
---
name: designing-book-layouts
description: Designs professional book interior layouts from font pairing through production-ready specifications, including Google Fonts selection, multi-perspective design council evaluation, HTML/CSS prototype pages, and SVG decoration specs. Use when a user requests book typography/font pairing, interior page layout design, or a complete book design specification package (e.g., "Buatkan kombinasi font untuk buku...", "design my book interior", "layout buku novel/nonfiksi").
---

# Designing Book Layouts

Quick Start14 / 15

When given: book title, target audience, manuscript description, optionally cover image/docx

Run all 4 phases in sequence, producing one continuous deliverable:

Propose 5 font pair combinations with reasoning
Run a 5-agent design council debate → pick 1 winning combo
Build a 4-page HTML/CSS/JS prototype (2 spreads, print-size, shadowed on white background)
Deliver a spec sheet: typography table + pure copyable SVG decorations + color/coordinate breakdown

Never skip straight to final output — always show Phase 1 and Phase 2 reasoning before Phase 3/4, unless the user explicitly says "skip to layout" or "skip to final."

Recommendation▾

Examples are somewhat abstract in output description (e.g., 'e.g., Fraunces + Space Grotesk...') — include one fully concrete example with actual pt sizes, hex codes, and a snippet of generated SVG/HTML output

Workflow15 / 15

Progress:

Phase 1: Font Discovery (5 combos)
Phase 2: Design Council & Selection (5-agent debate → 1 winner)
Phase 3: Layout Prototype (4 HTML pages / 2 spreads)
Phase 4: Master Specification Document

Phase 1 — Font Discovery

Given manuscript tone, cover design, audience, and trim size, propose 5 distinct Google Fonts combinations. Each combo needs:

Title font (looks good in uppercase AND title case)
Author/byline font (distinctive, professional)
Body font (must have regular, bold, italic available)
Reasoning: why it fits the manuscript tone, why it fits the cover, why it fits the audience
Explicitly note why it's NOT mainstream (avoid Playfair Display, Montserrat+Merriweather clichés, and always avoid Syne)

Format as a table: Combo # | Title | Author | Body | Rationale

Phase 2 — Design Council & Selection

Roleplay 5 agents debating the 5 combos from Phase 1. Each agent gives a short verdict (2-4 sentences) ranking their top pick and objecting to weak ones:

Typography Specialist — readability, x-height, kerning at body size
Brand Analyst — cover consistency, tone match
UX Designer — accessibility, long-reading fatigue
Creative Director — distinctiveness, aesthetic risk
Publisher Expert — print production reliability, licensing, industry norms

End with a Consensus Decision: one final combo + 2-3 sentence joint reasoning. If agents disagree, state the tension and why the majority view wins.

Phase 3 — Layout Prototype

Build a single self-contained HTML file (inline CSS/JS, no external deps except Google Fonts <link>) containing:

4 pages arranged as 2 spreads (odd/even paired), each page sized to the book trim (default 14.8cm × 21cm, or custom if specified)
Pages centered on a light gray/white backdrop with a subtle box-shadow per page (simulating printed sheets)
20mm margins with visible breathing room
Clear hierarchy: chapter title, drop-in first paragraph, body text, running header/footer, page number
Page numbers styled minimally — geometric/modern, NOT ❦ or classic ornaments
Black & white theme by default (#000 text on #fff page) unless brand colors specified
Use the winning font pair from Phase 2 via Google Fonts <link> tags
Include realistic sample text from the manuscript (or lorem-ipsum-style placeholder matching tone if no manuscript text given)

Deliver as one .html artifact viewable directly in browser (this is the user's preview method before rebuilding manually in InDesign).

Phase 4 — Master Specification Document

One HTML/markdown doc containing:

Preview: thumbnail/embed of the 4 pages from Phase 3
Typography table: element | font family | size (pt) | weight | leading | tracking/letter-spacing | color hex
SVG decorations: each decorative element (page number frame, chapter divider, drop cap flourish if any) as a pure, standalone SVG code block in its own collapsible/dropdown section, ready to copy-paste
Color reference: hex list (#000000, #FFFFFF, or custom palette) with usage labels
Coordinate/position reference: margin values in mm, key element positions (e.g., "page number: 20mm from bottom, centered")
Note InDesign conversion hints where useful (e.g., "leading value = InDesign Leading field in pt")

Recommendation▾

Consider adding a brief troubleshooting note for when manuscript/cover files aren't parseable, to round out edge-case coverage

Examples15 / 20

Example 1: Input: "Buatkan kombinasi font untuk buku 'Jejak Senja', target audiens dewasa muda urban, isi naskah fiksi kontemplatif slow-burn romance" Output: Phase 1 table of 5 combos (e.g., Fraunces + Space Grotesk + Literata; Canela-alternative + Author's proposals...) → Phase 2 council debate favoring readability of a literary serif body → Phase 3 HTML prototype with warm off-white background, elegant chapter openers → Phase 4 spec sheet with Literata 11pt/16pt leading body text table and SVG minimalist page-number tick marks.

Example 2: Input: cover image + docx manuscript file, no explicit instructions Output: Extract tone/genre from docx content and color palette from cover image, then proceed through all 4 phases automatically, matching font mood to both the cover's visual weight and the manuscript's register.

Recommendation▾

The odd specific bans (avoid Syne, avoid ❦) feel arbitrary without brief rationale — a one-line justification would strengthen credibility

Best Practices

Always ground font choices in the manuscript's genre/tone and the cover's visual style — never suggest fonts in a vacuum
Prefer distinctive Google Fonts pairings (e.g., Fraunces, Newsreader, Litera, Spectral, Inter, Space Grotesk, Sora, Zodiak-alternatives) over overused defaults
State explicit pt sizes, leading (line-height), and tracking values — never leave typography vague
Keep decorations geometric/minimal; justify every ornament's existence
Make all SVGs self-contained (no external refs) so they're truly copy-paste-ready
Default to 20mm margins and black/white unless told otherwise; state assumptions clearly
When only a cover image or docx is provided without explicit brief, infer tone/audience and state assumptions before proceeding

Common Pitfalls

Do NOT use Syne font under any circumstance
Do NOT use ❦ or classic flourish ornaments — keep decorations modern/geometric
Do NOT jump directly to final layout without showing Phase 1 and Phase 2 reasoning
Do NOT leave font specs vague ("medium size body text") — always give exact pt/leading/tracking
Do NOT bundle SVGs inline without a dedicated, separately copyable block per decoration
Do NOT default to trendy-but-overused pairs (e.g., Playfair Display + Montserrat) — always justify uniqueness
Do NOT forget print-context sanity checks (font licensing for print, minimum body size ~9-11pt for readability)