Claws · 包晴天 海外版 · prototype

Counsel without borders.

Four surfaces, one product. China-mainland clients hire US & Japan lawyers (King & Wood Tokyo / NY / Silicon Valley) through an AI-led consultation, purchase a service, then collaborate in a shared project workspace. Lawyers work inside the AI WorkDeck IDE — a three-panel workbench powered by Bu Er, our legal AI agent.

🎬 Each surface has its own Play tour button. Click to auto-play through the flow · click the demo at any time to take control · resume from where you left off.

30 · iOS client 16 · iOS lawyer 8 · Web lawyer + IDE 8 · Web client updated 2026-05-19
01 Client · iOS 02 Lawyer · iOS 03 Lawyer · Web + IDE 04 Client · Web 62 Flat key-page grid ↓
Surface · 01

01 / 04Client · iOS

The full client mobile journey — start at onboarding, get matched to a K&W lawyer, book, collaborate, then try the AI features (Contract Review, Overseas Setup Report) and browse the content + services tabs.

Auto-tour · 16 steps · ~50 s — / 16
Click the phone to take control

Path · click any step to jump

  1. client-onboarding — welcome / language
  2. consult-ai — Query tab (default landing)
  3. services-mall — Marketplace tab
  4. discover — Clip / Insights tab
  5. client-me — Me tab
  6. consult-ai — back to Query to start the journey
  7. search-lawyers — matched K&W lawyers
  8. lawyer-profile — Yuki Tanaka (AI Shop tab)
  9. lawyer-reviews — 5-axis radar breakdown
  10. product-purchase — service detail
  11. checkout — Apple Pay · format tier
  12. project-started — workspace opens
  13. im-chat — privileged thread
  14. consult-ai — Query (back to try contract review)
  15. contract-upload — AI contract review
  16. contract-result — AI redlines
  17. overseas-report — premium playbook
Open standalone ↗
Click to take control
Surface · 02

02 / 04Lawyer · iOS

The lawyer mobile app — onboarding (bar admission verification → K&W identity → approval) → daily ops (inbox · projects · calendar) → income (wallet · payouts).

Auto-tour · 16 steps · ~50 s — / 16
Click the phone to take control

Path · click any step to jump

  1. lawyer-onboard-profile — bar info · step 1
  2. lawyer-onboard-cred — credential upload · step 2
  3. lawyer-onboard-review — under review · step 3
  4. lawyer-approved — 审核通过 · welcome aboard
  5. lawyer-inbox — Inbox tab (default landing)
  6. lawyer-projects — Projects tab
  7. lawyer-products — Products tab
  8. lawyer-notes — Notes tab
  9. lawyer-me — Me tab
  10. lawyer-inbox — back to Inbox to start the day
  11. lawyer-project-detail — open a matter
  12. im-chat — reply to client
  13. call-incoming — client calls
  14. video-call — live consult
  15. lawyer-product-editor — manage shelves
  16. lawyer-calendar — week + open slots
  17. lawyer-wallet — earnings + payouts
Open standalone ↗
Click to take control
Surface · 03 · flagship

03 / 04Lawyer · Web with AI WorkDeck IDE

The lawyer's primary workbench. A VS Code-style three-panel IDE: project tree (left), Office-integrated editor (center) with inline AI redlines, and the Bu Er AI agent (right) with Chat / Skills / Sources tabs.

"事不二做、人无二过" — Bu Er, the agent that learns the lawyer's house style and never repeats a mistake. Skill Marketplace turns capabilities into installable extensions; MCP Servers connect Bu Er to live data (Westlaw, e-Gov JP, EDGAR, 裁判文书网).

Auto-tour · 8 steps · ~25 s — / 8
Click the demo to take control

Path

  1. signin — lawyer login
  2. projects-dashboard — pick a matter
  3. workdeck — three-panel IDE opens
  4. skill-marketplace — install a Skill
  5. mcp-servers — connect data sources
  6. inbox — client messages
  7. calendar — Bu Er focus time
  8. me — bar admissions / skills
  9. workdeck — back to drafting
Open WorkDeck ↗ From signin ↗
workdeck.claws.com/signin
Click to take control
Surface · 04

04 / 04Client · Web

The desktop client — for in-house counsel / GC users at mainland-China companies managing multiple active matters. Same lawyer-matching engine, but a real desk-screen workspace.

The shared project workspace mirrors what the lawyer is doing in WorkDeck: clients see the lawyer's finished deliverables, never the AI workshop floor — the asymmetry is the product.

Auto-tour · 7 steps · ~22 s — / 7
Click the demo to take control

Path

  1. signin — client login
  2. home — AI consult + tiles
  3. find-lawyer — filter + results
  4. lawyer-profile — 5-axis radar
  5. checkout — purchase
  6. projects — matter list
  7. project-workspace — shared with lawyer
  8. me — account
Open standalone ↗
claws.com/signin
Click to take control

Key pages — every screen, flat.

No version sectioning. Click any thumbnail to open the screen in a new tab. The live demos above use the same files, so changes here propagate everywhere.

NEW 律所即品牌 — 新增屏 (8) MOD 律所即品牌 — 改动屏 (8) 标记于 2026-05-20 firm-as-brand pivot · 改造对应 P0 8 项
Client · iOS31
Lawyer · iOS16
Lawyer · Web + IDE15
Client · Web8
Client onboarding
3-step welcome · jurisdiction
Auth
AI consult — chat
Tiffany AI dot · cross-border prompt
AI
AI consult — empty
First-time hero · example prompts
AI
Marketplace
AI Products · Courses · Human Services
Tab
Insights
Lawyer notes · waterfall · going-abroad rail
Tab
Note detail
Edge-to-edge hero · AI 3-line summary
AI
Find lawyer
Filter chips · 4-lawyer results
Lawyer filter
11 sections · live match counter
Lawyer profile
AI Shop · Courses · Human · peer + verified recommendations
K&W
Firm profile
K&W brand page · offices · firm SKUs
K&W
Lawyer reviews
5-axis breakdown · individual reviews
Saved lawyers
Bookmarked profiles
Product purchase
Service detail · price tiers
Checkout
Apple Pay · JPY + USD/EUR
Project started
Receipt · privacy notice
Client project detail
Status · timeline · files
IM chat
Sendbird · privileged · system events
Call · incoming
Lawyer ringing screen
Video call
Live consultation
Contract — upload
Drop zone · privacy
AI
Contract — AI redlines
Severity chips · escalate to lawyer
AI
Overseas — intake
Destination + business
Overseas — step 1
Identity · jurisdiction
Overseas — step 3
Risk & constraints
Overseas — step 4
Review & submit
Overseas — processing
Multi-agent progress
AI
Overseas — final report
Setup playbook · CTA to K&W
Premium
Client me
Account · settings · projects
Tab
Notifications
Activity timeline
Refund request
Privilege-safe reason picker
Review & rating
Private to Claws
Lawyer onboard — profile
Bar info · K&W signup
Auth
Lawyer onboard — credentials
Document upload
Auth
Lawyer onboard — review
Approval pending state
Auth
Lawyer inbox
Bu Er pre-screen card · refined mobile
Tab
Lawyer projects
Stats strip · urgent / open / closed
Tab
Lawyer project detail
Client · SLA · attachments
Lawyer calendar
Day agenda · consults
IM chat
Bidirectional thread
Call · incoming
From client
Video call
Consultation in progress
Lawyer products
My services list
Product editor
Service · pricing · SLA
Lawyer notes
My published notes
Note editor
Compose · attachments
Lawyer me
Storefront customization · open slots · payouts
Tab
Lawyer wallet
Earnings · Stripe payouts
Firm onboarding — identity
Step 1/3 · firm name · jurisdictions
Firm
Firm onboarding — brand
Step 2/3 · logo · offices · partners
Firm
Firm onboarding — compliance
Step 3/3 · conflict · payout · engagement
Firm
Firm admin · dashboard
KPIs · activity · top performers
Firm
Firm admin · members
Lawyer roster · invite · roles
Firm
Firm admin · SKUs
Firm packages vs lawyer SKUs
Firm
Firm admin · conflict check
Bu Er pre-screen · partner decision
AI
Sign in
Email + password · K&W SSO
Auth
Projects dashboard
Active · awaiting client · completed
AI WorkDeck IDE
3-panel · Bu Er · Office editor
Flagship
Skill marketplace
9 skills · contract review · cite-check
AI
MCP servers
Westlaw · e-Gov · 裁判文书 · EDGAR
AI
Inbox
Conv. list · open in WorkDeck
Calendar
Week view · Bu Er focus blocks
Lawyer account
Bar admissions · skills · privacy
Sign in
Split brand panel · email + phone
Auth
Home
AI consult hero · service tiles
AI
Find a lawyer
Filter sidebar · 2-col results
Lawyer profile
5-axis SVG radar · services
K&W
Checkout
JPY primary · CNY/USD · Apple Pay
Projects list
6 cards · status tabs · progress
Project workspace
File tree + chat · shared with lawyer
Flagship
Account
Profile · privacy · sign out
Claws · prototype · prototype/ = static HTML; no build step. Tokens in assets/claws.css, runtime in assets/claws-init.js.
Brand Claws · 包晴天 海外版 · 主席 + Morris · visual system locked 2026-05-19 · code-name BQT_Global.