DESIGN:OS Studio là ứng dụng thiết kế giao diện chạy native trên máy, viết bằng Rust, vẽ canvas bằng GPU (wgpu). File nằm trên ổ đĩa của bạn: mở, chỉnh và lưu lại file .fig. Miễn phí, không telemetry, source-available theo giấy phép PolyForm Shield 1.0.0 (dùng cho dự án có thu phí được, chỉ không được bán lại sản phẩm cạnh tranh).
Một quy trình trọn vẹn (ví dụ)
1. Mở file .fig của bạn trong Studio (bộ kit 336 MB, 207.601 node vẫn mở được thành một tài liệu).
2. Mở bảng Agents bằng Cmd+` (Ctrl+` trên Windows/Linux), chọn Claude Code, Codex, Grok, Antigravity hoặc Gemini CLI, dùng tài khoản của chính bạn, Studio không cần API key.
3. Chọn một frame, gõ yêu cầu, ví dụ: "đổi màu cứng sang biến màu của design system". Mặc định agent hỏi trước khi làm.
4. Xem lại thay đổi của lượt đó, giữ hoặc hoàn tác bằng một lần undo.
5. Chạy Check designs để soát contrast, màu chưa gắn biến, rồi Fix all.
6. Mở bảng code (Shift+D) để lấy code CSS, Tailwind, React, SwiftUI, UIKit, Compose, Android XML hoặc HTML; lưu lại .fig hoặc xuất PNG/JPG/SVG/PDF/WebP.
Kết nối MCP cho người không quen dòng lệnh
- Cách dễ nhất: không cần cài gì thêm. Bảng Agents tự đăng ký MCP server của Studio cho CLI bạn chọn; chỉ cần CLI đó đã được cài và đăng nhập (danh sách hiện trạng thái cài/đăng nhập và link cài đặt nếu thiếu).
- Dùng với Cursor, Windsurf, OpenCode…: thêm vào phần mcpServers trong cài đặt MCP của công cụ:
"design-os-studio": { "command": "/ĐƯỜNG/DẪN/designos-mcp", "args": ["--workspace", "/ĐƯỜNG/DẪN/thư-mục-thiết-kế"] }
designos-mcp được cài kèm Studio (trên macOS chạy install-cli.command trong file .dmg để cài các lệnh).
- Kiểm tra: chạy `designos-mcp --version`.
Yêu cầu hệ thống
- macOS (Apple Silicon và Intel, bản universal .dmg) — đã kiểm chứng trên Apple Silicon.
- Windows x64 (.zip, cài cho user, không cần quyền admin) và Linux x64 (.deb, .tar.gz) — đã build nhưng chưa kiểm chứng trước khi phát hành. Linux cần glibc bằng hoặc mới hơn máy build, và zenity hoặc xdg-desktop-portal cho hộp thoại file.
- GPU: Metal (macOS), Direct3D 12/Vulkan (Windows), Vulkan/OpenGL ES (Linux); không có GPU thì tự chuyển sang renderer CPU.
Định dạng hỗ trợ
- Mở/lưu: .fig, .designos (định dạng gốc).
- Ảnh: dán hoặc kéo thả PNG, JPEG, WebP vào canvas.
- Biến: nhập/xuất JSON và W3C Design Tokens (DTCG).
- Xuất: PNG, JPG, SVG, PDF (vector), WebP lossless, code 8 ngôn ngữ.
Hạn chế: lưu .fig hiện bỏ mất định dạng danh sách đánh số (issue #834).