Sources and provenance
Architecture precedents, illustration references, and the source material behind examples.
The SVG references in this project are original drawings created for this exploration. The sources below informed architectural choices, general illustration principles, and the factual content of project examples. Individual tone recipes and example briefs retain their relevant links.
Architecture and workflow precedents
zudo-doc: the zfb-based documentation system used by this project's documentation website.
create-zudo-doc source: the small generated host and package-owned configuration precedent.
zudo-sg: a related initializer and shared-engine approach for styleguide work.
zudo-sg engine architecture: separation between engine-owned preview behavior and host content.
design-visual-gen skill: SVG help-illustration authoring and candidate exploration context.
protodev skill: the user's established visual prototype-and-feedback workflow.
Claude Code skill-creator instructions: the requested reference for the later installable skill work.
The first app version implements a content and command interface that a skill can drive. Referencing these skills does not mean that any of them was installed or modified as part of the app handoff.
Illustration references
IBM Design Language: line illustration, flat illustration, hybrid UI illustration, isometric illustration, and technical diagrams.
Atlassian illustration foundations: use and construction of product illustration.
GitLab Pajamas illustration guidance: illustration construction and presentation considerations.
Indeed's scalable illustration system: an example of organizing a reusable illustration system.
Rough.js: a reference for sketch-like vector contours and hatching.
Stripe Connect front-end experience: product explanation and interface representation context.
The collection does not contain copied branded illustration assets. A reference's presence explains an influence or principle, not an affiliation or endorsement.
Project example content
The worked examples were grounded in the following project material. An example snapshot illustrates the behavior described in its accompanying brief; check the current project sources before adapting it for production.
| Project | Source material | Example focus |
|---|---|---|
| zudo-pattern-gen | Composer manual | Combining pattern and text layers into an exported image. |
| zudo-text | Layout manual | Splitting a frame creates an empty frame; choosing its content is a separate action. |
| zudo-doc-cloud | Project hierarchy specification | Moving selected Workbench changes into a draft while other changes remain. |
| zudo-ez-host | Status, save, and publish guide | Local files, saved cloud checkpoints, and the live site as distinct states. |
| zzmod | Synth SVG package | A basic signal path with audio and control relationships distinguished. |
Tone examples use a shared explanation to support visual comparison. The second-round example is a constructed demonstration of refinement lineage, not a historical record of a user's selection.
Browser behavior reference
MDN's localStorage documentation describes browser-origin storage. This project uses browser storage for review convenience and explicit copy/download actions for transfer. Browser-local state is not a write into the session's source directory.