More room for your next idea. Membership from $9.99/month.Take a look

Portfolio Case Study Studiov1.0.0

Build a complete portfolio that explains the thinking behind the work. Create separate evidence-linked case pages, original before/after interface studies, honest metric boundaries, a profile and a contact-draft handoff in a warm editorial design.

See what you can make

Skip the interactive example

Loading the working example…

Open example
Interact with the sample. Scroll inside to explore.
Made with this SkillA complete case-study portfolio and public handoff

Eight complete pages · three full cases · real filters and comparison controls

Open full example

What you get

A complete case-study portfolio and public handoff

What you can make

  • Build a complete portfolio with separate work, case, profile and contact pages.
  • Show evidence-linked decisions and original before/after interface studies.
  • Use working filters, themes and keyboard comparison controls with a local contact draft.
Explore delivered files6 groups
  • index.html + work.html + about.html + contact.html + 404.html
  • cases/<id>.html + case-briefs/<id>.md
  • assets/<id>-before.svg + <id>-after.svg
  • resume.md + metrics.csv + sources.csv
  • publish-checklist.md + input.json + quality.json
  • delivery-manifest.json

Good fit

Designers and developers who want their portfolio to explain the thinking behind the work.

Know the limits

Demo identities and outcomes are fictional; contact exports a draft rather than sending a message.

About this skill

Capabilities: full home/work/case/about/contact/404 routes, category filters and search with empty states, two themes preserved across navigation, keyboard comparison sliders, permission assertions, source-kind validation, descriptive metric changes and a validated local contact draft.

Deliverables: eight-route fictional Nia Rowan portfolio with three full cases, six original SVG interface studies, case briefs, public profile Markdown, metric and source CSVs, editable input, publication checklist, quality notes and a SHA-256 manifest. All files work without remote fonts, images or a build system.

Read the full workflow

First run: Python 3.10+ standard library. Run scripts/build-portfolio.py --input examples/portfolio.json --demo --output ./portfolio-site. Inspect every case, search and filter work, compare designs with the keyboard, switch theme and download an actual contact draft.

Validation: actual eight-page generation, local route and SVG loading, independent percentage-point/decrease/zero-baseline calculations, permission and source-kind rejection, category and empty-result views, keyboard sliders, theme continuity, form error/recovery and actual draft download, narrow layout and reproducible hashes.

Version 1.0.0: original Skillrove narrative workflow, implementation and interface artwork under MIT. Public competitor features informed the scope; no paid package or assets were reused. All sample identities and outcomes are fictional. The static form sends no email; a reviewed backend is a separate integration. $4.99 one-time; active Premium memberships cover this package.

FROM PACKAGE TO FIRST RESULT

Your first portfolio that shows the thinking.

Generate the fictional Nia Rowan portfolio with three complete product, brand and web cases. Replace its identities, source records and illustrative metrics with permitted real material before publication.

View example result
US$4.99 · MIT licensePython 3.10+ · static HTML + SVG · offlineNo API key or paid provider
  1. 01

    Choose your agent

    These steps use a project folder. Open the project in your agent and run terminal commands from its root.

    Codex directory guide

    Package folder .agents/skills/portfolio-case-study-studio

  2. 02

    Add the package

    Download and unzip the package into the folder above. Keep all its files together, with SKILL.md directly inside that folder.

    Downloads require a verified account and purchase access. Choose a new folder if this Skill is already installed.

  3. 03

    Run the included sample

    Manual sample commands and technical details

    Read SKILL.md, review the generator and check its runtime requirements before running:

    cd .agents/skills/portfolio-case-study-studio
    python3 scripts/build-portfolio.py --input examples/portfolio.json --demo --output ./portfolio-site
    Your first result

    Filter Product/Brand/Web and search for an empty result. Open a full case, use the range control with arrow/Home/End keys, follow the next case and preserve the night theme. Review the evidence and metric boundaries, recover from contact errors, then download a real local draft.

    Python 3.10+ standard library, offline. Interface studies and demo outcomes are fictional. Approval flags and source IDs require human review; the generator does not redact confidential input. Contact creates a downloadable draft and sends no message. Public hosting and domain-specific SEO need the included handoff review.

    If portfolio-site already exists, change the output to ./portfolio-site-2. Existing files are never overwritten.

    Prefer to ask your agent?

    Use Portfolio Case Study Studio at .agents/skills/portfolio-case-study-studio. Read SKILL.md and review scripts/build-portfolio.py. Run examples/portfolio.json into a new output folder and show me all generated files. Keep fictional sample content clearly labeled.

Ready to use your own facts?

Copy examples/portfolio.json to a new input file, replace all fictional facts, and generate into a new folder. Review the content before using or publishing it; the generator does not independently verify claims.

Reviews0

Share your first result

Tried this workflow? Help others decide with an honest review.

Before you choose this Skill

How do I get Portfolio Case Study Studio?

The listed individual package price is USD 4.99. Premium downloads require a confirmed purchase or active membership. Your agent subscription, model access and external provider credits are separate.

Which agents can use this skill?

This release lists Codex, Claude Code, Cursor as intended installation hosts. Check the package’s dependencies and permissions before running it. These labels do not certify that every workflow has been tested in every agent.

What files can this workflow generate?

The documented 1.0.0 workflow lists: index.html + work.html + about.html + contact.html + 404.html; cases/<id>.html + case-briefs/<id>.md; assets/<id>-before.svg + <id>-after.svg; resume.md + metrics.csv + sources.csv; publish-checklist.md + input.json + quality.json; delivery-manifest.json. Some files or exports are optional; follow the package’s setup and inspect the delivered result.

What should I check before using the result?

Python 3.10+ standard library, offline. Interface studies and demo outcomes are fictional. Approval flags and source IDs require human review; the generator does not redact confidential input. Contact creates a downloadable draft and sends no message. Public hosting and domain-specific SEO need the included handoff review.

$4.99One-time purchase