Visual story direction
Skill twk0672005/sentence-to-site/skills/visual-story-direction
One sentence in, a verified website out. Agent skills that close the gap between vibe coding and software engineering - so people with no coding background can build a website that holds up.
npx -y skills add twk0672005/sentence-to-site --skill visual-story-directionAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
2 things to look at
- 19 days oldThe repository was created 19 days ago. New is not bad, but a brand new repository carrying a familiar-sounding name is the shape a typosquat arrives in, and there has been no time for anyone else to find a problem with it.
- 5 stars5 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
What its author says it does
Copied from the file, not written here
Use when a landing page, portfolio, product story, or editorial site lacks a clear visual premise, hierarchy, material direction, or meaningful critique target.
SKILL.md
1.0 KB, as published. Nobody here has run it
Visual Story Direction
Before proposing libraries or effects, decide what a visitor must understand and feel in the first viewport. A visual system needs a premise, not a pile of components.
- State audience, one-sentence promise, desired first impression, and dominant contrast.
- Turn that into hierarchy, type scale/density, material, whitespace, and one interaction or motion job.
- Build or inspect a real browser view.
- Repair the single weakest visible problem before adding another feature.
Avoid generic bento layouts, decorative gradients, stock “cinematic” effects, and animation before a page has a story. A restrained page is valid when restraint supports the premise.
Use ../../references/visual-direction.md for the critique grid and ../../templates/motion-brief.md only when motion has an actual purpose.