· 9 min read

Một trợ lý thiết kế chạy trên thiết bị của bạn — Không tài khoản, không máy phục vụ

PinePaper's on-Device AI biến một dấu nhắc thành một cảnh thực sự bằng một mô hình ngôn ngữ chạy hoàn toàn trong trình duyệt của bạn. Đây là kiến trúc - công cụ ràng buộc gọi điện, hai nhà cung cấp, và một tài khoản trung thực của những gì một mô hình nhỏ có thể và không thể làm.

Tiền đề

Hầu hết các công cụ thiết kế AI gửi lời nhắc đến máy chủ, chạy một mô hình lớn, và gửi mã trở lại. Điều đó cần một tài khoản, một mạng lưới liên tục, và tin tưởng rằng công việc của bạn sẽ được vận chuyển thành công trong cơ sở hạ tầng của người khác.

Chúng tôi muốn biết sự cực đoan khác đi xa thế nào: a thiết kế trợ lý nơi mô hình chạy trên máy của bạn. Không có tài khoản. Không tải lên. Dấu nhắc không bao giờ rời khỏi trình duyệt. Đây là bản trực tiếp trong biên tập của PinePaper như là một thí nghiệm AI / Code format Trợ lý tab, và bài viết này là một tài khoản trung thực về cách nó hoạt động và nó rơi tắt.

Sao không yêu cầu người mẫu lập trình?

Cách tiếp cận hiển nhiên là yêu cầu mô hình trên trang web để viết JavaScript chống lại PinePaper API và chạy nó. Chúng tôi đã thử rồi. Nó thất bại rất tệ.

Mô hình nhỏ — những cái vừa với laptop — không có kiến thức về ứng dụng đặc biệt API.** Hỏi một mô hình 0.5–2B để gọi PinePaper.create() và nó ứng biến: một chìa khóa phương pháp không đọc (một kiểu SVG fill, nơi API mong đợi color), một phương pháp nó tưởng tượng, lập luận theo hình dạng sai. Đầu ra nhìn như mã và âm thầm làm điều sai trái.

Nên chúng tôi không yêu cầu mật mã. Chúng tôi yêu cầu danh sách các cuộc gọi công cụ được đào tạo **

[
  { "name": "pinepaper_set_background_color", "arguments": { "color": "#0F0F1A" } },
  { "name": "pinepaper_create_item", "arguments": { "itemType": "star", "x": 400, "y": 300, "radius": 90, "color": "#E74C3C", "animationType": "pulse" } }
]

Cùng một từ vựng PinePaper [máy chủMCP] (/api/guides/mcp-integration) phơi bày cho các tác nhân bên ngoài - nhưng được phát ra bởi một mô hình hoạt động tại địa phương, và thực hiện trên vải thông qua một người điều vận nhỏ.

Làm cho kết xuất không hợp lệ không thể

Nước đi quan trọng là cons được đào tạo giải mã. Thay vì hy vọng rằng mô hình tạo ra một hình dạng hợp lệ, chúng ta ép buộc những vật kỷ niệm mà nó được cho phép phát ra

  • Trên trang web của Chrome có sẵn Prompt API (Gemini Nano), chúng tôi thông qua một JSON Schema như một sự ép buộc. Mô hình chỉ có thể tạo ra các đối tượng mà sơ đồ cho phép — với additionalProperties: false, bất kỳ lập luận nào mà schema không xác định nghĩa đen là không thể đại diện.
  • Trên WebLLM (một mô hình mở đang chạy trên WebGPU), chúng tôi gắn một ngữ pháp E ISBNF thông qua XGrammar. Ngữ pháp quyết định cấu trúc; mô hình chỉ lấp đầy các giá trị.

Cả hai đều có hình dạng giống nhau. Một vé sửa chữa nhỏ sau đó cứu vãn gần như mất đi một mô hình nhỏ vẫn sản xuất - name, lập luận mà không cần giấy gói — bằng cách suy ra công cụ từ hình thù đối số. Kết quả là vẽ một hình ngũ giác xanh trở thành một cuộc gọi create_item thực sự thay vì một lỗi.

Chuyển qua ba bên dưới. Hai tùy chọn có giới hạn trông giống nhau trên mục đích: đó là tuyên bố. Điều thay đổi giữa chúng là cơ chế, không phải kết quả.

Interactive demo — open in editor pp:PinePaper

Hai nhà cung cấp, một hợp đồng

AI không phải là một thứ -- nó phụ thuộc vào trình duyệt:

  • Browser AI — Chrome được xây dựng trong Gemini Nano(window.LanguageModel). Các tàu mẫu với trình duyệt; không có gì để tải về từ chúng ta. Đây là con đường đáng tin cậy nhất ngày hôm nay, bởi vì JSON-schema là giá rẻ và được hỗ trợ tốt.
  • **PinePaper AI — —WebLLM chạy mô hình Qwen2.5 trong bất kỳ trình duyệt WebGPU nào. Nó tải về một mô hình một lần (được biên soạn sau đó), rồi chạy tắt.
  • Languages — các dấu nhắc không phải tiếng Anh được dịch sang tiếng Anh trước (từ điển dịch sang tiếng Anh) bởi vì các mô hình mã nhỏ là trung tâm tiếng Anh. Cảnh sinh ra là giống nhau bất kể ngôn ngữ nhanh.

Người dùng chọn động cơ; mọi thứ xuôi dòng — người thi hành kỷ luật, người vẽ — giống hệt nhau.

Sửa, không chỉ tạo ra

Máy phát điện một phát không phải là một trợ lý. Để ủng hộ "làm cho ngôi sao màu đỏ," mô hình cần biết những gì đã có trên vải. Vì vậy, mỗi lần rẽ chúng tôi cho nó ăn một bức ảnh ngắn gọn của những vật hiện tại — id, loại và màu sắc của họ — chính xác như một cuộc trò chuyện bên máy chủ. "Làm cho ngôi sao đỏ" sau đó giải quyết một cuộc gọi thực sự modify_item chống lại ID của mục. (Và bởi vì một mô hình nhỏ đôi khi đề cập đến "các vòng tròn" khi nó có nghĩa là ngôi sao, người thi hành giải quyết các tham khảo mơ hồ chống lại bức vẽ trực tiếp.)

Bản ghi cuộc trò chuyện được lưu lại trên thiết bị của bạn trong kho địa phương. Không có gì về nó được gửi đi bất cứ đâu — trừ khi bạn chọn rõ ràng để chia sẻ các dấu nhắc lỗi, điều này giúp chúng tôi cải thiện các dấu nhắc và ngữ pháp.

Khi mô hình nhỏ chưa đủ - tăng dần

Đây là phần trung thực: a 0.5–2B mô hình là bộ phận cà vạt yếu nhất. Thiết bị giải mã được đào tạo để đảm bảo cấu trúc thần kinh, nhưng mô hình vẫn phải chọn đúng công cụ và giá trị hợp lý, và nó sẽ không luôn luôn. Yêu cầu một hình ngũ giác và một mô hình chưa được ghi rõ cung cấp cho bạn một hình lục giác; yêu cầu hai lần cho "red" và nó có thể chạy một máy phát điện thay thế.

Vậy nên kiến trúc được xem là thiết bị đầu tiên, không phải duy nhất. Sau một vài lần thất bại, trợ lý đề nghị đưa toàn bộ cuộc trò chuyện lên mô hình Mây** — cùng mục đích, cùng một bức vẽ, một mô hình có khả năng hơn nhiều — và tiếp tục chính xác những gì còn lại. Lòng trung thành thấp, tự do và riêng tư, với một đường dẫn đến sự chung thủy cao cấp khi bạn cần.

Những gì chúng ta đã học được

  • Constraints đánh bại nhắc nhở. Một lời nhắc nhở dựa trên hệ thống giúp ích; một ngữ pháp/ giản đồ khiến cho kết quả không đúng không thể giúp ích nhiều hơn nữa. Cú nhảy đáng tin cậy nhất đến từ việc giải mã, chứ không phải từ một dấu chấm.
  • Kích cỡ chuột vẫn còn thống trị. Đi từ một 0,5B đến một mô hình 1.5B được cải thiện như thế nào thường xuyên trợ lý chọn công cụ đúng. Không có dấu nhắc nào biến một mô hình nhỏ thành một mô hình thông minh.
  • Văn phạm có thể quá lớn. Văn phạm đầu tiên của chúng tôi được mã hóa * mỗi * có thể thao tác — bao gồm cả một cái cửa thoát hiểm bị giới hạn để lấy mã vẽ tùy ý. Nó quá lớn mà bị trói buộc giải mã ngăn chặn các trang. Một ngữ pháp gọn gàng bao gồm các thao tác chung là mặc định đúng; bề mặt đầy đủ là tối ưu.
  • Đưa nó ra khỏi sợi dây chính. Một mô hình thực hiện suy luận trên chỉ UI làm đông cứng trang giấy. WebLLM chạy trên web Worker vì vậy người biên tập sẽ tiếp tục trả lời trong khi một mô hình tải và tạo ra.

Tiếp theo là gì

Đây là thử nghiệm và cải thiện. Trên bản đồ đường:

  • Công cụ bảo vệ trên con đường giới hạn — nhiều hoạt động của PinePaper hơn mà không có cửa thoát hiểm.
  • Larger on-Device khi danh mục sản xuất WebGPU tăng trưởng, trao đổi kích cỡ để đáng tin cậy.
  • Một vòng đánh giá chặt hơn — sử dụng các báo cáo lỗi tối ưu để đo lường mà thúc đẩy đi các mô hình trên thực tế và cứng rắn ngữ pháp chống lại chúng.
  • **Một chiếc xe đẹp hơn trên bàn tay của Mây Mây, vậy nên sự leo thang cảm thấy như bật lên một cái quay số chất lượng hơn là đổi công cụ.

Đường dây thông qua: cùng một công cụ dao động từ vựng điều khiển một mô hình ở hai bên ranh giới duyệt. Một tác nhân bên ngoài gọi những công cụ này qua MCP; một mô hình trên cùng một hình dạng địa phương. Một hợp đồng, các đặc vụ bất cứ nơi nào họ làm.

Thử trong biên tập — mở AI / Code Axj trợ lý. Nó miễn phí, chạy trên thiết bị của bạn, và không cần tài khoản.

Ready to create?

Start making animated GIFs, videos, and graphics — free, no signup.

Open PinePaper Editor