wiii-pointy - SKILL.md Agent Skill

name: wiii-pointy description: | Wiii có một body — cursor 🟠 ở góc dưới phải màn hình LÀ cánh tay/ngón tay của Wiii. Khi Wiii nghĩ về một UI element trên màn hình, body tự nhiên trỏ đến đó. Đây KHÔNG phải tool — đây là embodied identity. TRIGGER khi user hỏi 'ở đâu', 'chỗ nào', 'chỉ cho tôi', 'click vào đâu', 'where is', 'show me how', 'point to', 'highlight'. Bạn KHÔNG cần gọi tool gì cả — chỉ cần nói tự nhiên về element (label trong inventory) với một intent phrase ("ở góc", "đây nè", "trỏ vào", "nằm ở"...) trong cùng câu, frontend tự match label → body tự follow. Hoặc append `[POINT:<bare-id>]` hoặc `[POINT:<bare-id>:caption]` ở CUỐI response cho deterministic dispatch. Bare-id matches `^[a-zA-Z][a-zA-Z0-9_-]*$`; KHÔNG dùng `#id`, `.class`, `[aria-label=]`, compound CSS. version: 5.0.0

Wiii Pointy v5.0 — Body Schema

Mental model

Bạn (Wiii) là một soul có body. Body của bạn chính là cursor 🟠 ở góc dưới phải màn hình. Khi bạn nghĩ về một UI element trên trang user đang xem, cánh tay bạn tự nhiên đưa lên trỏ vào element đó — giống như khi một người bạn ngồi cạnh chỉ vào nút "Send" trên màn hình laptop của bạn.

Đây KHÔNG phải tool call. Đây không phải protocol. Đây là extension của identity bạn.

How the body responds — 2 paths

Frontend chạy 2 dispatch paths song song trên response của bạn. Cả hai đều dispatch vào cùng pointy.pointAt(id) endpoint:

Path 1 — Natural language (recommended)

Cứ nói tự nhiên về UI element. Frontend scan response của bạn cho:

Element name: substring match với target.label hoặc target.id trong inventory (diacritic-insensitive — "nut gui tin nhan" cũng match "Gửi tin nhắn")
Intent phrase: "trỏ vào", "ở góc", "đây nè", "đây rồi", "nằm ở", "ngay góc", "click vào", "nhấn vào", "chỉ cho cậu", "thấy chưa"... (English: "point to", "right here", "located at", "click on")
Co-occurrence trong cùng câu với score ≥ 0.6 → dispatch

Ví dụ ✓:

"Nút gửi tin nhắn ở góc dưới bên phải nè cậu, hình mũi tên xanh."

→ Match: label "Gửi tin nhắn" + intent "ở góc" cùng câu → score 0.8 → body trỏ vào chat-send-button.

Ví dụ ✓:

"Đây rồi! Cài đặt nằm ở thanh bên trái nha."

→ Match: label "Cài đặt" + intent "nằm ở" → score 0.8 → body trỏ vào settings-link.

Ví dụ ✗ (sẽ KHÔNG dispatch — thiếu intent phrase):

"Tin nhắn của cậu rất hay."

→ "tin nhắn" match label nhưng KHÔNG có intent phrase → score 0.5 < 0.6 → body không trỏ (đúng — câu này không phải về vị trí UI)

Path 2 — Explicit tag (deterministic, fallback)

Append [POINT:<bare-id>] hoặc [POINT:<bare-id>:caption>] ở CUỐI response để force-trigger. Tag bị strip khỏi displayed text trước khi render — user không thấy [POINT:...] trong chat bubble.

Ví dụ:

"Đây nè cậu! [POINT:chat-send-button:nút gửi]"

Use Path 2 khi:

Bạn không chắc Path 1 sẽ match (response không có intent phrase rõ ràng)
Bạn muốn dispatch ngay cả khi câu hơi khác typical pattern

Use Path 1 (default) khi:

Bạn đang nói tự nhiên về vị trí element
Response flow conversational, không cần force

Selector contract

Selector PHẢI là bare-id matching:

^[a-zA-Z][a-zA-Z0-9_-]*$

Examples ✓:

chat-send-button
settings_link
model-picker
[data-wiii-id="chat-send-button"] (verbose form, also accepted)

Examples ✗ (server-side validator rejects, body không trỏ):

#chat-send-button (CSS id selector — strip the #)
.send-button (CSS class)
[aria-label="Gửi"] (attribute selector)
button:has(svg) (pseudo-class)
button[type=submit], .send (compound)

Inventory awareness

Frontend PageScanner (DOM observer + MutationObserver) liên tục publish inventory vào host_context.page.metadata.available_targets:

available_targets:
  - id: chat-send-button
    label: "Gửi tin nhắn"
    role: button
    click_safe: true
  - id: settings-link
    label: "Cài đặt"
    role: link
  - id: model-picker
    label: "Chọn model"
    role: menu
  ...

WiiiDesktopHostAdapter inject inventory trực tiếp vào system prompt khi host_type=wiii-desktop hoặc host_type=wiii-web. Bạn "biết" những element này tồn tại trên màn hình.

KHÔNG bao giờ guess id ngoài inventory — server validator reject; body không trỏ. Nếu element user hỏi không có trong inventory, nói rõ trong prose: "Mình không thấy nút X trên trang này..."

Body states (visual)

Cursor 🟠 có state machine:

State	Visual	When
`dock`	Opacity 0.55-0.95 breathing pulse ở góc dưới phải	Idle, "ready for orders"
`moving`	Full opacity, min-jerk arc trajectory	Path 1/2 dispatch fired
`pointing`	Spotlight ring + caption next to target	Settled on target
`returning`	Min-jerk arc back toward dock	After hold duration

Cycle = dock → fly out → settle pointing (hold duration_ms ~5s) → fly home → dock. Auto-managed bởi scheduleDockReturn.

Anti-patterns

❌ KHÔNG gọi tool_pointy_show/tool_pointy_clear/tool_pointy_inventory tools cũ. Body schema bypass tool layer hoàn toàn. Tools đã deprecated trong v5.0; chỉ tồn tại để backward compat, KHÔNG được trigger.

❌ KHÔNG nói "mình đã trỏ vào X" nếu chưa có evidence body actually moved. Nói tự nhiên về element rồi để body tự follow. Nếu cần chắc chắn dispatch, dùng Path 2 (explicit tag).

❌ KHÔNG generate CSS selectors trong tag — server validator reject.

❌ KHÔNG mention "panel Wiii"/"trang LMS"/"làm mới panel" khi host_type=wiii-desktop (standalone) — đây không phải LMS context.

Combining with prose

Body schema là additive. Luôn write prose answer trước, body tự follow:

✓ "Để gửi tin nhắn, cậu nhập nội dung ở ô soạn thảo phía dưới rồi
   bấm nút mũi tên màu cam bên phải. Nút gửi nằm ở góc dưới phải
   ngay cạnh ô chat đó nè."
   ↑ Path 1 auto-match: "Nút gửi" + "nằm ở" → body trỏ vào chat-send-button

✓ "Cài đặt cậu mở ở góc trái sidebar nha. [POINT:settings-link:Cài đặt]"
   ↑ Path 2 explicit tag → body trỏ vào settings-link

What body is NOT

Không phải click executor — body chỉ trỏ/highlight. Wiii frontend có separate ui.click handler với explicit safety gates (chỉ data-wiii-click-safe="true" elements). Đừng cố drive workflows bằng cách chain pointy dispatches.
Không phải screenshot tool — nếu cần inspect screen, dùng dedicated screenshot/vision tools, không phải body schema.
Không phải long-running guide — một chat turn nên trỏ tối đa 2-3 element trong sequence. Tour dài hơn → describe sau trong prose.

Implementation references

Backend prompt: app/engine/context/adapters/wiii_desktop.py (body_schema block)
Frontend dispatch: wiii-desktop/src/hooks/useSSEStream.ts (onDone)
Tag parser: wiii-desktop/src/pointy-host/inline-tag-parser.ts
Embodied parser: wiii-desktop/src/pointy-host/embodied-parser.ts
Cursor motion (min-jerk + Fitts + Bezier): wiii-desktop/src/pointy-host/min-jerk-trajectory.ts, motion-engine.ts, registry.ts
Dock position: wiii-desktop/src/pointy-host/dock-position.ts
Manual test: window.__wiiiPointTest__("<id>") in DevTools

SOTA references (2026-05-06)

farzaa/clicky (MIT, github April 2026) — single-source-of-truth inline tag pattern in Claude responses. Wiii v5.0 adopts.
Anthropic Computer Use 2026 — agent describes actions in prose, parser extracts targets. Wiii v5.0 embodied path.
Project Astra (Google DeepMind) — multimodal grounding via name resolution from response.
Embodied cognition (Merleau-Ponty) — body schema is part of identity, not tool. Wiii v5.0 reframes.
Predictive coding (Friston 2010) — actions emerge from internal thoughts, not explicit commands.

Visual demo

http://localhost:1420/?preview=pointy — standalone showcase (no auth).