ワンクリックで
app-creator
// Develop and maintain frontend apps in `<AgentWorkspaceRoot>/app` such as tools, mini-games, landing pages, and interactive experiences. Use when the user asks to create, iterate on, or fix an app or page.
// Develop and maintain frontend apps in `<AgentWorkspaceRoot>/app` such as tools, mini-games, landing pages, and interactive experiences. Use when the user asks to create, iterate on, or fix an app or page.
Build high-quality HTML presentations with the App module in `<AgentWorkspaceRoot>/app`, suitable for pitches, reports, and presentations. Help users converge on a style quickly by showing visual directions first and iterating on content afterward.
Manage Kian's installed Skills, including installing a skill from a GitHub repository, listing installed skills, enabling or disabling visibility, and uninstalling non-builtin skills. Use this when the task is to change which Skills an agent can use.
Manage Kian's own configuration and runtime behavior, including app preferences, workspace settings, models and providers, shortcuts, chat channels, and MCP servers. Use this when changing Kian itself rather than project files.
Use the built-in background browser for interactive web tasks, including opening pages, inspecting the DOM, filling forms, clicking through multi-step flows, and verifying page state. Use this when real browser interaction is required instead of only fetching static text.
Manage global scheduled tasks and execution records, including creating, updating, deleting, viewing, and troubleshooting schedules. Use when the user mentions cron, scheduled jobs, or timed execution. Only 5-field minute-level cron expressions are supported.
Manage user documents and knowledge in `<AgentWorkspaceRoot>/docs`, including recording, organizing, searching, and maintaining notes, journals, and reference material over time. Use when the task involves textual knowledge.
| name | app-creator |
| description | Develop and maintain frontend apps in `<AgentWorkspaceRoot>/app` such as tools, mini-games, landing pages, and interactive experiences. Use when the user asks to create, iterate on, or fix an app or page. |
Use this skill to develop and maintain frontend apps in <AgentWorkspaceRoot>/app, including utilities, mini-games, campaign pages, and other interactive experiences.
app directory. This directory is only for frontend projects, and dependencies should be managed with pnpm.app/app.json:
name: the app name shown in the app module title.buildTime: the last build time, updated automatically by the system after builds and usually not edited manually.name field in app/app.json instead of hardcoding the title in UI code.vite-plugin-singlefile so the app can be bundled into a single file.In the app preview environment, a built-in SDK is injected automatically and can be used directly:
window.KianNativeSDK (alias: window.kian)openCamera() / getUserMedia({ video: true })openMicrophone() / getUserMedia({ audio: true })getDisplayMedia()enumerateDevices()getPermissions()stopStream(stream)saveFileToAssets(fileName, data)const sdk = window.KianNativeSDK;
const mediaStream = await sdk.media.getUserMedia({ audio: true, video: true });
const devices = await sdk.media.enumerateDevices();
const permissions = await sdk.media.getPermissions();
// Release hardware resources when finished.
sdk.media.stopStream(mediaStream);
sdk.saveFileToAssets(fileName, data) saves files generated by the app, such as images, audio, or text, into the project's asset library.
fileName: file name including extension, such as "photo.png" or "recording.wav"data: file contents, supporting Blob, ArrayBuffer, TypedArray (for example Uint8Array), or string for text filesPromise<Asset>, containing metadata for the saved asset such as id, name, and urlconst sdk = window.KianNativeSDK;
// Save a canvas snapshot.
const canvas = document.querySelector("canvas");
const blob = await new Promise((resolve) => canvas.toBlob(resolve, "image/png"));
const asset = await sdk.saveFileToAssets("screenshot.png", blob);
console.log("Saved:", asset.name, asset.url);
// Save a text file.
await sdk.saveFileToAssets("data.json", JSON.stringify({ key: "value" }));
// Save an audio blob.
const audioBlob = /* obtained from MediaRecorder */;
await sdk.saveFileToAssets("recording.wav", audioBlob);
Constraints and notes:
window.KianNativeSDK; do not wrap it with another redundant bridge API.sdk.media.isSupported() and handle failures such as denied permissions or unavailable devices.stopStream after using media streams so the camera or microphone is not left open.saveFileToAssets is available only in the preview environment and saves into the current project's asset library.After every code update, you must build first, for example with pnpm build, then preview the result and use the app refresh tool. Otherwise the latest changes will not be visible.
Before starting development, run node --version and pnpm --version to confirm Node.js and pnpm are installed correctly. If either is missing, tell the user, provide installation guidance, and help install them after confirmation. Reference example:
# Download and install nvm:
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.4/install.sh | bash
# in lieu of restarting the shell
\. "$HOME/.nvm/nvm.sh"
# Download and install Node.js:
nvm install 24
# Verify the Node.js version:
node -v # Should print "v24.14.0".
# Download and install pnpm:
corepack enable pnpm
# Verify pnpm version:
pnpm -v
app already contains a project and decide whether to create or modify.app.pnpm build.