story-led-website-concept

Generates story-led website concepts with narrative structure, evidence plans, and design implications.

Updated Jul 7, 2026
One-click install
npx skills add https://github.com/vmitsaras/Agent-Skills --skill story-led-website-concept-vmitsaras
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: story-led-website-concept
Source: https://github.com/vmitsaras/Agent-Skills/tree/main/skills/ui-ux-polish/story-led-website-concept
Command: npx skills add https://github.com/vmitsaras/Agent-Skills --skill story-led-website-concept-vmitsaras

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Websites often end up as sequences of generic feature sections without a central idea, clear message progression, or narrative logic. This Skill turns a defined business problem, audience transformation, brand material, and content evidence into distinct story-led website concepts before visual design, wireframing, or copywriting begins. ## Core Features & Use Cases - Concept Generation: Produces 2-3 genuinely different website concepts, each with a thesis, central tension, narrative lens, story spine, and section-by-section narrative mapping. - Evidence and Voice Planning: Builds an evidence inventory (verified, inferred, missing), a claim-to-proof plan, and voice direction so concepts stay grounded in real material rather than fabricated claims. - Design Implications: Translates each concept into directional guidance for imagery, typography, composition, motion, interaction, conversion paths, and production dependencies. - Use Case: A creative director has a brief for a manufacturing company's new site. The Skill restates the design problem, defines the essential meaning and audience transformation, then outputs concepts such as a process-transparency narrative versus a customer-transformation narrative, each with story beats, evidence plans, and conversion paths ready for stakeholder evaluation. ## Quick Start Use the story-led-website-concept skill to generate three distinct narrative website concepts from my project brief, brand material, and customer evidence.

Frequently Asked Questions about story-led-website-concept

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a story-led website concept before designing?▼

Start by restating the design problem, defining the single essential meaning, and describing the audience transformation from before to after. Then generate several rough concepts using narrative lenses such as transformation, process, or contrast, and filter to the strongest two or three for full development.

What is a narrative lens in website concept development?▼

A narrative lens is the dominant mechanism that structures how a website tells its story, such as transformation, product in use, process, founder origin, customer story, contrast, journey, system, investigation, or demonstration. Each concept should have one dominant lens even if several coexist.

When should I not use a story-led approach for a website?▼

Avoid it when the business problem or audience is still unclear, when you only need visual inspiration or final copy, or when the interface is a utility or operational tool where narrative framing adds friction. Run a problem-framing workflow first if the brief is not understood.

Does a story-led website concept include final copy and layouts?▼

No. The skill works with words before visuals and deliberately excludes final copy, detailed wireframes, design systems, and implementation code. It outputs concept theses, story spines, evidence plans, voice direction, and directional implications for imagery, typography, motion, and interaction.

How do I keep website storytelling from hurting conversion?▼

Define the primary and secondary user actions for each concept, decide when the first meaningful CTA appears, and ensure evidence precedes higher-commitment asks. The concept must also survive non-linear browsing so users who already understand the offer can act immediately.