Interaction

Type a message; Enter sends locally and Shift+Enter inserts a line. Add attachments with Plus, toggle Search/DeepMind and select a saved model. The initial model must belong to the list; default toggles set the next initial state. Reply text and delay are editable local demos, with no AI call; delay uses milliseconds (1000 is one second). Changing settings cancels pending old replies; the next send uses current settings. Catalog hover, focus and mobile Preview share a demonstration; the title opens the editor.

Effect notes

Placeholder: "Ask Anything"；Watermark text: "Skiper llm 0.3"；Show watermark: true；Composer width: 744；Input font size: 16；Composer radius: 16；Canvas background: "#f1f1f1"；Input background: "#f9f8f8"；Button background: "#f9f8f8"；Text color: "#121212"；Selection color: "#0ea5e9"；Models (one per line): "GPT-4o\nClaude 3.5 Sonnet\nGemini Pro\nLlama 3.1"；Initial model: "GPT-4o"；Start with Search: false；Start with DeepMind: false；Local demo reply: "I dunnoo 😭"；Demo reply delay: 1000；Demonstration text: "Plan a studio"

States

The configured initial state uses the saved content above. Logical preview canvas 768 × 440; saved scale 1, offset (0, 0).

Timing

Response basis 500 ms, delay 0 ms. Observation speed is runtime only.

Enter and exit

A multiline composer with attachments, Search, DeepMind and model selection. Submission stays in the local demo. Native controls retain their current local state after the demonstration ends.

Repeated input and interruption

Leaving the catalog with focus outside, going offscreen and switching to the background stop the demonstration. Manual input, live selection and playback progress never replace the saved defaults.

Effect notes

The controls, preview, JSON, Motion adapter, prompt project and HTML export use this same saved settings object and renderer. Catalog cards always show project defaults.

Reduced motion

No automatic demonstration; transitions settle immediately. Native text input, buttons, selection and keyboard controls remain available.

Default configuration

These values come from the maintained default configuration. Editor drafts and exported changes can differ.

{
  "schemaVersion": 2,
  "recipeId": "skiper-81",
  "durationMs": 500,
  "delayMs": 0,
  "easing": [
    0.22,
    1,
    0.36,
    1
  ],
  "offsetX": 0,
  "offsetY": 0,
  "scale": 1,
  "loop": false,
  "interruption": "retarget",
  "tracks": [],
  "skiper": {
    "placeholder": "Ask Anything",
    "watermark": "Skiper llm 0.3",
    "showWatermark": true,
    "inputWidth": 744,
    "fontSize": 16,
    "cornerRadius": 16,
    "background": "#f1f1f1",
    "inputColor": "#f9f8f8",
    "buttonColor": "#f9f8f8",
    "textColor": "#121212",
    "accent": "#0ea5e9",
    "models": "GPT-4o\nClaude 3.5 Sonnet\nGemini Pro\nLlama 3.1",
    "initialModel": "GPT-4o",
    "searchDefault": false,
    "deepDefault": false,
    "replyText": "I dunnoo 😭",
    "replyDelay": 1000,
    "demoText": "Plan a studio"
  }
}

Reference and reuse

This effect references Skiper UI. Public source was reviewed when available; Pro examples were independently implemented from their public demonstrations. Use the editor to export the current configuration and runnable renderer. Keep Skiper UI attribution and media notices.

Using it in your own project

Open the editor to run the actual preview and compare changes. This document does not run a separate imitation. Recheck content, input, focus and layout after integrating an export.

Catalog provenance label: Skiper UI. Third-party examples retain their own license and attribution; all current effect renderers are public; the full editor is maintained separately.