Contenu du pack

Un fichier SKILL.md (le guide pratique) + un modèle de départ. Aperçu :

Paper-Texture Resume Site

When to use

• A designer, writer, illustrator, or craftsperson wants a resume site that feels handmade rather than templated
• You need a one-page personal site: name, what you do, selected work, experience, contact
• A job seeker wants a link to send instead of a PDF, with the same care a printed resume gets
• A portfolio that should print beautifully — the site doubles as the printable resume
• You want a personal site with a strong tactile identity but no heavy images, frameworks, or build step

Workflow

1. Write the resume first (input: career facts → output: plain-text resume)
   Write the content as plain text before any design: name, one-line positioning ("Product designer who ships boring tools people love"), 3–5 selected projects with one-line outcomes, work history (role, org, dates, one line each), skills, education, contact. Cut ruthlessly — a resume site is not a CV dump; anything that would not survive on one printed page does not survive here. Every project line states an outcome, not a duty: "Redesigned onboarding; trial-to-paid rose from 12% to 19%" beats "Responsible for onboarding." This text is the whole site; the design only dresses it.
2. Set the paper system (input: plain-text resume → output: design tokens)
   Define a small token set: two paper tones (a warm off-white base and a slightly darker deckle edge), one ink color (near-black, never pure black), one accent (a muted stamp red or pencil blue), and two typefaces (a serif for headings, a clean sans for body). Texture comes from a lightweight repeating grain — a tiny tiled image or a CSS noise pattern — applied at low opacity over the background, never from a huge photographic scan. Torn and deckle edges are drawn with small SVG masks or border-radius tricks, not heavy images. Every token gets a name and a hex value so the site stays consistent across sections.
3. Lay out the page like a printed sheet (input: tokens + resume text → output: page structure)
   Structure the page as a single sheet of paper: a header block (name, positioning line, contact), then sections in print order — Selected work, Experience, Skills, Education, Contact. Use generous margins, a single column with a maximum width around 720px, and rules (thin horizontal lines) between sections like a letterpress resume. Work samples sit as small captioned figures with paper-frame borders, not a masonry gallery — this is a resume that shows work, not a gallery that happens to have a resume. Keep the total page weight light: text first, a handful of small images, no carousels.
4. Make it behave like a website (input: page structure → output: working site)
   Build it as a single static HTML file with inline or one linked stylesheet — no framework, no build step, no JavaScript required for the core page. Make it responsive: the sheet narrows to the phone screen, type scales down one step, and the deckle edges simplify rather than breaking. Add the web behaviors a PDF cannot offer: a working mailto: contact link, anchor navigation to sections, and semantic HTML (header, main, section, h1/h2) so screen readers and search engines read it as a resume. Add a print stylesheet so printing the page yields a clean one-or-two-page resume with the texture toned down and backgrounds removed.
5. Proof, test, and ship (input: working site → output: live resume site)
   Proofread every word — a resume site with a typo is worse than no site — and check every date, link, and email address by clicking it. Test on a phone, a desktop, and in print preview; test with images off to confirm the text alone still reads as a complete resume. Check contrast: ink on paper tones must pass a basic contrast check, and the grain must never sit behind body text at an opacity that hurts reading. Ship as a single page on any static host, then send the link to one honest friend and fix whatever confuses them before sending it to anyone who hires.

Aperçu du modèle

Paper-Texture Resume Site — Template

Fill in the resume text first, then the tokens, then build the single page.

Resume text (write this before any design)

Name: {full name} Positioning line (one line): {e.g. Product designer who ships boring tools people love} Contact: {email} | {city} | {portfolio/social link}

Selected work (3–5 projects, outcome per line)

1. {Project name} — {one-line outcome, e.g. "Redesigned onboarding; trial-to-paid 12% → 19%"} — {link or image}
2. {Project name} — {one-line outcome} — {link or image}
3. {Project name} — {one-line outcome} — {link or image}

Experience

Skills

Le pack de compétence lui-même (SKILL.md + modèle) est rédigé en anglais.

Acheter le pack complet — $4.99 Pro — les 511 compétences