> ## Documentation Index
> Fetch the complete documentation index at: https://docs.daydream.live/llms.txt
> Use this file to discover all available pages before exploring further.

# Vibe Code a Scope Node

> Build a complete Scope node using AI-assisted development with Claude Code

# Building a Scope node with AI-assisted coding

In the [Build a Video Effects Node](/scope/tutorials/build-video-effects-node) tutorial you learned how every Scope node is put together - the project structure, schema, pipeline class, and effect functions. Now you are going to build one without writing most of the code yourself.

This tutorial walks you through two ways to **vibe code** a complete Scope node using [Claude Code](https://docs.anthropic.com/en/docs/claude-code/overview). You describe what you want in plain English and let Claude handle the scaffolding, schemas, and GPU effect code. By the end you will have a working **Film Noir** node installed in Scope - high-contrast black and white with vignette and grain.

Watch the full walkthrough:

<iframe className="w-full aspect-video rounded-xl" src="https://www.youtube.com/embed/pUqF010u-zQ" title="Vibe Code a Scope Node" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerPolicy="strict-origin-when-cross-origin" allowFullScreen />

***

## Prerequisites

* [Claude Code](https://docs.anthropic.com/en/docs/claude-code/overview) installed and authenticated
* Daydream Scope installed and running ([desktop app or local install](/scope/getting-started/quickstart))
* Basic familiarity with the terminal
* Completed (or at least read through) the [Build a Video Effects Node](/scope/tutorials/build-video-effects-node) tutorial

You do **not** need to know Python or PyTorch. That is the whole point.

If you want to understand the node system in more depth before diving in, check out the [Developing Nodes](/scope/guides/node-development) guide and the [Node Architecture](/scope/reference/architecture/nodes) reference.

***

## Choose your approach

Both approaches produce the same result: a fully functional Scope node with live UI controls. Pick the one that fits your style.

<CardGroup cols={2}>
  <Card title="Context7 MCP" icon="globe">
    **Explore and build.** Claude fetches the latest Scope docs on-the-fly via an MCP server and generates your node from the official patterns. Most flexible - you can go off-script and explore any part of the API.
  </Card>

  <Card title="Node Skill" icon="terminal">
    **Answer questions and ship.** A purpose-built Claude Code skill walks you through a structured flow - concept, specs, file generation, testing. Faster and more predictable, with the full node reference baked in.
  </Card>
</CardGroup>

***

## Build your node

<Tabs>
  <Tab title="Context7 MCP" icon="globe">
    This approach uses [Context7](https://context7.com), an MCP server that gives Claude access to up-to-date library documentation. You point Claude at the Scope docs, describe the effect you want, and it generates everything from scratch using the official node patterns.

    ### Why this approach?

    Context7 pulls the latest Scope documentation into Claude's context on-the-fly. This means Claude always works from the current node API - even if it has changed since Claude's training data was last updated. It is the most flexible approach because you are not limited to a predefined workflow. You can ask Claude to build any kind of node, explore the docs interactively, and iterate on the design in conversation.

    ### Setup

    <Steps>
      <Step title="Install the Context7 MCP server">
        The fastest way to add Context7 to Claude Code is with a single CLI command:

        ```bash theme={null}
        claude mcp add context7 -- npx -y @upstash/context7-mcp@latest
        ```

        For higher rate limits, grab a free API key from [context7.com/dashboard](https://context7.com/dashboard) and pass it in:

        ```bash theme={null}
        claude mcp add context7 -- npx -y @upstash/context7-mcp@latest --api-key YOUR_API_KEY
        ```

        Alternatively, you can add it manually to your Claude Code settings file (`~/.claude.json` or your project's `.claude/settings.json`):

        ```json theme={null}
        {
          "mcpServers": {
            "context7": {
              "command": "npx",
              "args": ["-y", "@upstash/context7-mcp@latest"]
            }
          }
        }
        ```

        Restart Claude Code. You should see Context7 listed when Claude starts up.

        <Note>
          Context7 is built by [Upstash](https://github.com/upstash/context7). If you run into `ERR_MODULE_NOT_FOUND` issues with `npx`, try using `bunx` instead: `claude mcp add context7 -- bunx @upstash/context7-mcp@latest`
        </Note>
      </Step>

      <Step title="Verify it works">
        Ask Claude to look up the Scope node docs:

        ```
        Can you use Context7 to look up how Daydream Scope nodes work?
        ```

        Claude will call `resolve-library-id` to find Scope, then `query-docs` to pull the node development documentation. If you see schema examples and pipeline code in the response, you are good to go.
      </Step>
    </Steps>

    ### Build the node

    Start a new Claude Code session in an empty directory and walk through this conversation:

    <Steps>
      <Step title="Ask Claude to research the node system">
        ```
        I want to build a Scope node that creates a film noir effect - classic black
        and white, high contrast, dark vignette around the edges, and subtle film grain.
        Can you look up how Scope nodes work and tell me what we need to build?
        ```

        Claude will query Context7 for the Scope node documentation and come back with the full picture: project structure, `pyproject.toml` entry points, schema patterns, pipeline class interface, and effect function conventions. It is essentially reading the same docs you read in the previous tutorial, but doing it in real time.
      </Step>

      <Step title="Generate the entire node">
        Once Claude has the context, tell it to build:

        ```
        Go ahead and build the complete node for me. Include all the files -
        pyproject.toml, schema with UI controls for each effect parameter, pipeline
        class, and the individual effect functions. Make the effects GPU-accelerated
        with PyTorch.
        ```

        Claude will generate the full project structure:

        ```
        scope-film-noir/
        ├── pyproject.toml
        └── src/
            └── scope_film_noir/
                ├── __init__.py
                ├── schema.py
                ├── pipeline.py
                └── effects/
                    ├── __init__.py
                    ├── desaturate.py
                    ├── contrast.py
                    ├── vignette.py
                    └── grain.py
        ```

        Each file will follow the exact patterns from the Scope documentation - Pydantic schema with `ui_field_config` for automatic UI controls, lazy imports in `__init__.py`, `torch.Tensor` operations for GPU-accelerated processing, and the `Pipeline` base class with `prepare()` and `__call__()` methods.
      </Step>

      <Step title="Review and iterate">
        This is the vibe coding part. Read through what Claude generated and ask for changes in plain English:

        ```
        Can you make the grain more like actual film grain - luminance-dependent so
        bright areas get less grain than shadows? Also bump the default contrast up
        a bit, it should feel dramatic out of the box.
        ```

        Claude will update the effect code and schema defaults. Keep iterating until the parameters feel right. You can also ask Claude to explain any part of the code:

        ```
        How does the vignette effect work? What does the radial gradient do?
        ```

        Since Claude has the Scope docs in context, its explanations will be grounded in how the framework actually works.
      </Step>

      <Step title="Install and test">
        Once you are happy with the code, install it in Scope:

        <ul>
          <li><strong>Desktop app</strong>: Open <strong>Settings > Nodes</strong>, click <strong>Browse</strong>, and select the <code>scope-film-noir</code> folder</li>
          <li><strong>Server</strong>: Enter the path to the node directory and click <strong>Install</strong></li>
        </ul>

        Select **Film Noir** from the pipeline selector, connect a camera, and you should see your feed transformed into a moody black-and-white scene with dramatic shadows and subtle grain.
      </Step>
    </Steps>

    <Tip>
      You can ask Claude to query specific parts of the Scope docs mid-conversation. For example: "Can you look up how post-processors work in Scope? I want to chain this after a generative model." Claude will fetch the relevant documentation and adapt your node accordingly.
    </Tip>
  </Tab>

  <Tab title="Node Skill" icon="terminal">
    This approach uses a purpose-built [Claude Code skill](https://docs.anthropic.com/en/docs/claude-code/skills) that guides you through node creation with a structured, interactive flow. Instead of an open-ended conversation, the skill asks you specific questions about your node and then generates all the files in one go.

    ### Why this approach?

    The skill encodes the full Scope node reference and a complete working example (the VFX Pack from the previous tutorial) directly in its prompt. Claude does not need to look anything up - it already has everything it needs. This makes the process faster and more predictable. The structured question flow also ensures you do not forget anything (like setting up the `pyproject.toml` entry point or choosing between main pipeline and post-processor modes).

    If Context7 is the "explore and build" approach, the skill is the "answer questions and ship" approach.

    <Card title="Scope Node Skill source code" icon="github" href="https://github.com/viborc/scope-plugin-skill">
      Browse the skill source to see how it works under the hood - includes the full Scope node reference and a complete working example baked into the prompt
    </Card>

    ### Setup

    <Steps>
      <Step title="Install the skill">
        Clone the skill repository and symlink it into your Claude Code skills directory:

        ```bash theme={null}
        git clone https://github.com/viborc/scope-plugin-skill.git
        cd scope-plugin-skill
        mkdir -p ~/.claude/skills
        ln -s "$(pwd)" ~/.claude/skills/create-scope-node
        ```

        <Note>
          For project-specific installation, copy the skill folder into your project's `.claude/skills/` directory instead of symlinking to the global location.
        </Note>
      </Step>

      <Step title="Verify it works">
        Open Claude Code and type:

        ```
        /create-scope-node
        ```

        Claude should respond by asking about your node concept. If it does, you are set.
      </Step>
    </Steps>

    ### Build the node

    <Steps>
      <Step title="Invoke the skill with your idea">
        You can start with just the slash command, or give it a head start with a description:

        ```
        /create-scope-node a film noir black and white effect with vignette and grain
        ```

        The skill kicks off a **four-phase workflow**:

        1. **Concept Exploration** - Claude discusses your idea, suggests effects and parameters, and confirms the creative direction
        2. **Specification Gathering** - Structured questions about naming, pipeline settings, UI parameters, and technical details
        3. **File Generation** - Claude creates every file: `pyproject.toml`, schema, pipeline, effects, and `__init__.py`
        4. **Testing Support** - Installation instructions and validation steps
      </Step>

      <Step title="Answer the questions">
        The skill will walk you through questions like:

        * What should the node be called?
        * Which effects do you want? (desaturation, contrast, vignette, grain, etc.)
        * What parameters should be exposed as sliders? What are the defaults and ranges?
        * Should this be a main pipeline or a post-processor?
        * Any third-party dependencies beyond what Scope provides?

        You can answer in as much or as little detail as you want. For anything you skip, the skill uses sensible defaults based on the Scope node patterns.
      </Step>

      <Step title="Review the generated files">
        Once the questions are done, Claude generates all the files at once. You will get the complete project structure with production-ready code following every Scope convention - entry points, lazy imports, Pydantic schemas with `ui_field_config`, GPU-accelerated tensor operations, the works.

        Review the output and ask for any changes:

        ```
        Can you add a sepia tone option as a toggle? When enabled it should add a
        slight warm tint instead of pure black and white.
        ```
      </Step>

      <Step title="Install and test">
        The skill provides installation instructions at the end. Follow them to install the node in Scope, select it from the pipeline dropdown, and start tweaking the sliders.
      </Step>
    </Steps>
  </Tab>
</Tabs>

***

## Comparing the two approaches

|                 | **Context7 MCP**                     | **Node Skill**                       |
| :-------------- | :----------------------------------- | :----------------------------------- |
| **Best for**    | Exploration, unusual nodes, learning | Quick builds, standard node patterns |
| **Setup**       | Add MCP server to config             | Clone repo + symlink                 |
| **Workflow**    | Open-ended conversation              | Structured question flow             |
| **Docs access** | Fetches latest docs on-the-fly       | Reference baked into the skill       |
| **Flexibility** | Ask anything, go off-script          | Follows a defined 4-phase flow       |
| **Speed**       | Slightly slower (doc fetching)       | Faster (no external lookups)         |

You can also **combine them**. Start with the skill to get a working node quickly, then use Context7 in a follow-up session to explore advanced patterns like post-processors, custom model loading, or chaining multiple pipelines.

***

## Tips for better results

Regardless of which approach you use, these tips will help you get better nodes out of the conversation:

* **Be specific about the visual effect.** "Film noir" is good. "Film noir with crushed blacks, a radial vignette that is stronger in the corners, and grain that is heavier in the shadows" is better. The more detail you give, the closer the first generation will be to what you want.

* **Reference real-world examples.** "Make the contrast curve look like a classic S-curve from Lightroom" gives Claude a concrete target. "Make it look like the movie Sin City" works too.

* **Iterate on the parameters.** The schema defaults are just a starting point. Ask Claude to adjust them: "The vignette is too subtle at 0.3, make the default 0.6 and cap the max at 1.0."

* **Ask for explanations.** If you want to understand what the generated code is doing, just ask. Both approaches can explain the GPU operations, the tensor shapes, and how each parameter maps to a visual change.

* **Test incrementally.** Install the node after the first generation, see how it looks, then come back to Claude with feedback. "The grain looks too uniform - can you make it more organic?" is much easier to act on once you have seen the output on screen.

***

## What's next

You now have two AI-assisted workflows for building Scope nodes without writing code from scratch. Here are some ideas for nodes you could vibe code next:

* **Cyberpunk neon glow** - Edge detection with colorful bloom and scanlines
* **Watercolor painting** - Bilateral filtering with color quantization for a painted look
* **Thermal camera** - Map luminance to a heat color palette
* **Tilt-shift miniature** - Selective blur to make real scenes look like tiny models
* **Glitch art** - Random block displacement, color channel splitting, and data moshing

Each of these follows the same pattern. Describe the effect, let Claude generate the code, install it, and iterate. The node system handles the rest.

<CardGroup cols={2}>
  <Card title="Build a Video Effects Node" icon="wand-magic-sparkles" href="/scope/tutorials/build-video-effects-node">
    The manual tutorial - understand every line of code in a Scope node
  </Card>

  <Card title="Scope Node Skill" icon="github" href="https://github.com/viborc/scope-plugin-skill">
    Install the Claude Code skill for guided node scaffolding
  </Card>

  <Card title="Developing Nodes" icon="code" href="/scope/guides/node-development">
    Full reference for node project setup, schemas, and pipeline types
  </Card>

  <Card title="Node Architecture" icon="sitemap" href="/scope/reference/architecture/nodes">
    Technical deep-dive into how the node system works under the hood
  </Card>
</CardGroup>
