Figma tích hợp GitHub vào canvas thiết kế. Cursor đặt cược vào hướng ngược lại

Tính năng mới Code Layers của Figma làm được điều mà hai năm trước có lẽ chỉ là ước mơ: cho phép nhân bản một repository GitHub trực tiếp lên canvas thiết kế. Khi repository đã ở đó, bạn có thể trích xuất các design frame có thể chỉnh sửa từ code hiện có, thay đổi trực quan và đồng bộ hóa lại về repository — tất cả trong một tệp Figma duy nhất, với tính năng cộng tác thời gian thực vẫn nguyên vẹn. Thiết kế và lập trình trong cùng một cửa sổ.

Với các nhà thiết kế đã dành nhiều năm viết ghi chú bàn giao, sao chép thông số kỹ thuật vào ticket Jira hoặc gửi link Zeplin cho nhóm kỹ thuật, Code Layers thay đổi nơi diễn ra cuộc hội thoại giữa thiết kế và code. Thay đổi trong Figma cập nhật code nền; thay đổi trong code cập nhật lớp thiết kế. Cây cầu giữa hai lĩnh vực luôn đòi hỏi phải chuyển đổi ngữ cảnh — giờ đây khoảng cách chuyển đổi đó đã nhỏ hơn.

Figma Motion biến hoạt ảnh thành code sẵn sàng xuất xưởng

Figma cũng công bố Motion — một timeline hoạt ảnh dựa trên keyframe được tích hợp trực tiếp vào canvas. Nhà thiết kế có thể tạo các transition, trạng thái hover và hoạt ảnh cuộn với timeline và thư viện preset, sau đó xuất ra bảy định dạng: CSS, JSON, React, MP4, WebM, Animated SVG và GIF. Một animation loading được thiết kế trong Figma không còn là tài liệu tham khảo để lập trình viên diễn giải — đó chính là bản animation hoàn chỉnh.

Thông báo lớn thứ ba là Shader Effects — các lớp tô màu được tăng tốc GPU bởi WebGPU (tiêu chuẩn đồ họa mới nhất của trình duyệt) cho phép nhà thiết kế áp dụng các kết cấu hình ảnh phức tạp, được tạo theo phương pháp toán học trực tiếp lên các layer Figma. Tác nhân AI của Figma có thể tạo ra các lớp tô màu shader tùy chỉnh từ mô tả văn bản hoặc hình ảnh tải lên. Nhập một cụm từ như ‘kính mờ với các mẫu giao thoa màu xanh nhạt’, canvas sẽ tạo ra thứ gì đó hiển thị trực tiếp và có thể tinh chỉnh tương tác.

Tác nhân AI bổ sung kỹ năng, công cụ và kết nối bên ngoài

Bản thân tác nhân AI đã mở rộng đáng kể. Nó có thể xây dựng các ‘kỹ năng’ có thể tái sử dụng từ các câu lệnh ngôn ngữ tự nhiên — công cụ tùy chỉnh tự động hóa các tác vụ thiết kế lặp đi lặp lại mà không cần kiến thức API — và kết nối trực tiếp với các dịch vụ bên ngoài bao gồm Notion, GitHub và Microsoft Excel. Một bản cập nhật vào cuối năm 2026 sẽ thêm Weavy, một công cụ xây dựng workflow mà Figma mua lại năm ngoái, cho việc tự động hóa dựa trên nút bên trong các tệp thiết kế.

Không phải tất cả đều có sẵn ngay hôm nay. Code Layers đang trong giai đoạn truy cập sớm, với đơn đăng ký mở vào tháng 7 năm 2026; yêu cầu ghế Full trên gói Figma trả phí. Shader Effects và tác nhân AI được cải tiến đã hoạt động trên các gói trả phí. Figma Motion hiện đã có sẵn cho người dùng ghế Full, với sự ra mắt đại trà của Code Layers dự kiến vào cuối năm 2026.

Tham vọng của Figma trong việc hấp thụ một phần quy trình làm việc của trình soạn thảo code vấp phải một câu hỏi thực tế: viết code và thiết kế giao diện là hai hoạt động nhận thức khác nhau, và Cursor — trình soạn thảo code AI mà SpaceX mua lại với 60 tỷ đô la tuần trước — đã xây dựng lượng người dùng trong cộng đồng kỹ sư, không phải nhà thiết kế. Liệu hai cộng đồng đó có hội tụ quanh một canvas chung hay không vẫn còn là câu hỏi bỏ ngỏ.

Thẻ: GitHub, Code Layers, Config 2026, công cụ thiết kế, Cursor, Figma