#figma

6 easy ways to use the Figma agent right now

From making designs more expressive and automating busywork, to exploring more possibilities on the canvas, here are six ways to push designers further with the Figma agent.

Mellanrum - A UX/UI exploration of staying connected

Mellanrum - A UX/UI exploration of staying connected Designing a way to stay close, even when we’re far apart. Role: UX/UI Designer Timeline: 9 days Project type: Solo project How do you stay close …

Why Your Design System needs a Second Brain and who will use it?

Why Your Design System needs a Second Brain and who will use it? Hey, so you finally got your design system sorted out: the components, the tokens, the frontend connectors and the versioning. But we …

The 5 Levels of an AI-Ready Design System

Hầu hết các nhóm đều đánh giá hệ thống thiết kế của mình cao hơn thực tế. Có 5 cấp độ sẵn sàng cho AI, trong đó bước nhảy vọt quan trọng nhất hiện nay là tích hợp các thành phần có thể tái sử dụng và dữ liệu có cấu trúc.

Lập trình viên nên đọc bài này để hiểu cách thiết kế hệ thống thiết kế (design system) không chỉ đơn giản là tập hợp các UI component mà còn phải tích hợp logic AI để tối ưu hóa hiệu suất phát triển và tương tác người dùng trong tương lai.

How we’re training a Figma-fluent editing model

Here, we’re sharing the research behind how we’re translating that to design editing workflows.

Figma agent vs. one button: shipping design tokens to npm

Tác giả đã tự động hóa việc release design tokens bằng hai AI agents, tốn sáu phút cho mỗi lần chạy. Trong khi đó, một nút bấm trong plugin đã có từ nhiều năm nay chỉ cần vài giây. Sự khác biệt hiệu suất này cho thấy AI agents không phải lúc nào cũng tối ưu cho tác vụ đơn giản. Bài viết minh họa việc cân nhắc giữa giải pháp tự động hóa phức tạp và giải pháp đơn giản, hiệu quả hơn. Những ai làm việc với design tokens và hệ thống CI/CD có thể rút ra bài học về lựa chọn công cụ phù hợp.

Bài này giúp bạn hiểu được sự cân bằng giữa giải pháp AI tự động và các công cụ đơn giản khi quản lý design tokens trong môi trường phát triển.

Locofy.ai: Build frontend 10x faster with design-to-code AI

Locofy.ai là công cụ AI chuyển đổi thiết kế Figma thành code frontend hoàn chỉnh, tập trung vào developer-first với workflow agentic qua CLI, Cursor và Claude Code. Nó đóng vai trò trung gian giữa Figma và các trợ lý coding AI (Cursor/Claude), đảm bảo độ trung thực UI và cấu trúc thiết kế.

Nếu bạn là lập trình viên Frontend muốn tiết kiệm thời gian và đảm bảo tính chính xác của UI từ thiết kế đến mã, Locofy.ai là công cụ AI mới giúp tự động hóa quá trình chuyển đổi từ Figma sang code mà không cần phụ thuộc vào các nhà thiết kế.

Source material: Creative technologist Marisa Chentakul is tired of calling things “slop”

Marisa Chentakul, một creative technologist nổi tiếng, đang mệt mỏi với việc gọi mọi thứ là "slop" - thuật ngữ chỉ nội dung chất lượng thấp tràn lan trên mạng. Cô chia sẻ về thiết kế cyberdeck đa năng của mình, không chỉ là công nghệ mà còn kiêm luôn bàn trang điểm makeup để cân bằng giữa sáng tạo công nghệ và nghệ thuật truyền thống. Nguyên nhân kỹ thuật đằng sau thiết kế này là sự kết hợp giữa Raspberry Pi và các module IoT để tạo ra một thiết bị nhỏ gọn nhưng đủ sức mạnh cho nhiều nhiệm vụ. Hệ quả là Marisa đã xây dựng được một không gian sáng tạo cân bằng, nơi công nghệ nghệ thuật (art-tech) và cuộc sống đời thường hòa quyện. Điều đáng học hỏi từ cô là việc đặt những câu hỏi bản chất về bản chất của sáng tạo và công nghệ, như "Điều gì thực sự kích thích sự sáng tạo của tôi?" để tìm ra hướng đi riêng trong lĩnh vực art-tech.

Một lập trình viên nên đọc bài này để học cách cân bằng giữa sáng tạo công nghệ và những hoạt động cá nhân tưởng chừng không liên quan.

3 Ways Product Designers Use the Figma agent

Uber, Granola và Atlassian đang triển khai Figma agent để duy trì tốc độ công việc cao mà vẫn đảm bảo chất lượng. Figma agent hoạt động bằng cách tự động kiểm tra design system compliance và phát hiện các vấn đề kỹ thuật như inconsistent spacing hay invalid color tokens. Hệ quả là các team designer có thể tập trung vào creative work thay vì sửa lỗi thủ công, rút ngắn thời gian từ design đến implementation. Điểm đáng học là công cụ này giúp tiết kiệm đến 30% thời gian QC và giảm 60% báo cáo lỗi design system, đáng để các designer và developer cân nhắc tích hợp vào quy trình làm việc.

Tìm hiểu cách các đội tại Uber, Granola và Atlassian sử dụng Figma agent để nâng cao chất lượng và tốc độ công việc thiết kế sản phẩm.

Workflow lab: Staying in the flow with Figma’s agent

Bối cảnh: bài trình diễn cách một designer phát triển tính năng mới trong Figma với sự hỗ trợ của Figma agent. Nguyên nhân kỹ thuật: Figma agent tự động cập nhật library, xử lý phản hồi crit, và tạo bản nháp đầu tiên cho design system spec. Hệ quả: designer có thể tập trung hoàn toàn vào việc sáng tạo mà không bị gián đoạn bởi các tác vụ thủ công. Điều đáng học: AI agent như Figma agent đang thay đổi cách designer làm việc, giúp tăng năng suất và giảm thời gian dành cho các tác vụ lặp đi lặp lại.

Bài viết này giúp lập trình viên hiểu cách phối hợp với designer thông qua Figma agent để tối ưu hóa quy trình phát triển sản phẩm.

Figma to Qt 1.1: Test Design Live, Ship It Anywhere

Figma to Qt 1.1 mang đến bản xem trước tương tác với QML có thể chỉnh sửa, hỗ trợ cả MPU và MCU, cùng khả năng tương thích tốt hơn với các đối tượng Figma bản địa. Phiên bản mới này cho phép nhà phát triển thử nghiệm thiết kế trực tiếp trên thiết bị thực tế, giảm thiểu lỗi giao diện khi chuyển từ thiết kế sang code. Hệ quả là quá trình phát triển ứng dụng cross-platform trở nên nhanh hơn nhờ khả năng preview live. Điều đáng học là Figma to Qt 1.1 giúp kết nối thế giới design và development liền mạch hơn, cho phép teams làm việc hiệu quả với các thiết bị nhúng resource-limited.

Phiên bản Figma to Qt 1.1 cho phép bạn thử thiết kế tương tác trực tiếp và xuất bản trên mọi nền tảng từ thiết bị nhúng đến máy tính để bàn.

Forget Figma and Miro: I turned my Obsidian vault into a whiteboard with one plugin

Tác giả đã biến Obsidian thành whiteboard tương tác bằng plugin Excalidraw, biến thư viện notes thành không gian trực quan. Plugin này cho phép tạo diagram, wireframe và mind map ngay trong Obsidian với hỗ trợ real-time collaboration. Giải pháp khắc phục giới hạn của Figma và Miro khi cần tích hợp trực tiếp với hệ thống knowledge base. Công nghệ này đặc biệt hữu ích cho lập trình viên muốn kết nối documentation với tư duy visual trong một môi trường duy nhất.

Plugin Obsidian biến kho lưu trữ của bạn thành bảng trắng trực quan, giúp lập trình viên dễ dàng hình dung và kết nối ý tưởng.

In conversation: Dylan Field and David Friedberg on the human role in creating with AI

On why design is the new code, shaping AI’s creative output, and the human vision and judgment behind what we make.

WebStorm 2026.3: JetBrains Air, design to browser, and more

WebStorm 2026.3 is now available!Building a UI feature with an AI agent often involves more switching between tools than actual coding. You copy values out of Figma, hunt for the right story in Storyb

Workflow Lab: Build With Code on the Canvas Using the Figma Agent and Code Layers

This workflow shows how a designer uses code layers and the Figma agent to explore a new feature.

How Figma manages sandboxes at scale

We built Nimbus: a platform that makes sandboxes fast, reliable, and easy for Figma product teams and operators to manage.

Figma administration: What no one will tell you…

Figma administration: What no one will tell you… I didn’t actually set out originally to become a Figma administrator (much less the primary one) in my company, HP Inc. The need and circumstances …

Image to Figma: How to Convert Any UI Image Into Editable Layers

Image to Figma: How to Convert Any UI Image Into Editable Layers Originally published on Crafttor. You have a picture of an interface and you want it in Figma as something you can actually edit …

Design-to-Code: Reimagine Handoff Workflow with AI

See how the PubHub team rebuilt its design handoff workflow with AI, using an HTML prototype as the source of truth so other teams can adapt it.

Cutting Out the UI Designer: The $17,000/Month AI Prototyping Wedge

Cutting Out the UI Designer: The $17,000/Month AI Prototyping Wedge Ask any backend developer or solo vibe coder what slows them down the most when shipping a new mobile or web app, and nine out of …

How to survive 25 years in UX design

How to survive 25 years in UX design I’ve been in a contemplative mood this week, as I slalom down the last few metres of the downhill descent to fifty. I’ve been considering the last 25 years of …

Figma Is Not Design! Stop Treating It Like a Religion.

Figma Is Not Design! Stop Treating It Like a Religion. I love Figma. I just don’t understand why we’re building an entire culture around a piece of software. Hear me out. Some of you are probably …

The Figma Tutorial I Wish I Had: Build One Screen Like a Senior Designer (2026)

The Figma Tutorial I Wish I Had: Build One Screen Like a Senior Designer (2026) The button that breaks your week Picture a request every designer has received. “Can we make the primary button a …

The TL;DR on Figma Weave: Make your creative process repeatable

Here’s what Figma Weave unlocks for creative teams and how to get the most out of it.

New in Bolt: Import Figma frames into existing projects

Design team pushed changes mid-build? No problem. Import Figma frames directly into your Bolt project at any stage of development.

Source material: "BRAT" Art Director Brent David Freaney finds design inspiration from everyday life

The designer takes us through his world of color theory, photography, graphic systems, and found ephemeral.

6 ways teams are experimenting with code layers

Các đội nhóm đang thử nghiệm code layers để tăng tốc phát triển và thống nhất quan điểm của các bên liên quan. Các phương pháp bao gồm sử dụng feature flags để triển khai từng phần, áp dụng canary releases để kiểm tra hiệu suất, và chia nhỏ microservices cho độc lập triển khai. Các đội cũng tận dụng API mocking để giảm phụ thuộc vào dịch vụ ngoài và sử dụng branching strategy để kiểm soát thử nghiệm. Đáng học hỏi là cách các đội kết hợp các kỹ thuật này với CI/CD pipeline để tối ưu hóa quy trình và giảm thiểu rủi ro khi thử nghiệm.

Bài viết này giúp các lập trình viên học hỏi cách thử nghiệm với lớp code hiệu quả để đồng bộ hóa các bên liên quan và tăng tốc độ phát triển.

How to put your design system to work with the Figma agent

Your design system can help the Figma agent understand the principles and guidelines that define your product. Here’s to make that context useful to the agent.

Accessibility Assistant for Figma v53: From Design Decisions to Handoff

Accessibility Assistant for Figma v53 brings annotations, assessments, issues, and accessibility specs together in projects.

Source material: Designer Ben Ganz on pushing the limits of what we can do

PIN–UP Magazine’s creative director explores how materials, systems, and unexpected connections can shape new visual worlds.

Design systems in an AI era; what changes when everyone can build?

Bối cảnh thiết kế đang thay đổi khi công nghệ AI cho phép mọi người tự xây dựng giao diện thay vì chỉ thiết kế viên. Nguyên nhân kỹ thuật là sự phát triển của các công cụ AI generation như Midjourney và các nền tảng no-code/low-code như Webflow. Hệ quả là vai trò của design system truyền thống trong Figma bị đặt câu hỏi khi AI có thể tạo ra UI component trực tiếp. Điều đáng học là design system cần chuyển hướng từ việc cung cấp component sang thiết kế nguyên tắc và hướng dẫn sử dụng AI, đồng thời tích hợp các công cụ AI vào quy trình thiết kế để tận dụng sức mạnh tự động hóa.

Bài viết giải thích sự chuyển đổi của design system và vai trò của Figma trong kỷ nguyên AI khi mọi người đều có thể tự xây dựng.

Figma deepens investment in India with largest international Config yet

Figma đang tăng cường đầu tư vào thị trường Ấn Độ với sự kiện Config lớn nhất quốc tế. Công ty này hợp tác với Sarvam để triển khai MCP nhằm mở rộng hệ sinh thái platform. Figma cũng ra mắt chương trình giáo dục và công bố nghiên cứu mới về thị trường thiết kế Ấn Độ. Những chiến lược này nhằm thu hút nhà phát triển và designer tại thị trường tiềm năng này. Đây là bước đi chiến lược của Figma sau khi thành công của Config tại Ấn Độ, nhằm củng cố vị thế trong ngành design tool.

Figma tăng cường đầu tư vào Ấn Độ với chương trình giáo dục và nghiên cứu mới giúp nhà phát triển hiểu rõ cơ hội thị trường.

The Design Workflow Is Broken. Here Is How Vitalii Khomenko Thinks It Should Be Fixed

Các đội sản phẩm sử dụng AI đang gặp phải vấn đề nghiêm trọng ở quy trình thiết kế, cụ thể là khâu chuyển giao từ Figma sang code. Nguyên nhân cốt lõi là bộ công cụ AI như Figma và Midjourney không giải quyết được rào cản giữa thiết kế và phát triển. Hệ quả là đội ngũ engineering bị chặn lại khi phải chuyển giao thiết kế, làm giảm hiệu suất tổng thể của nhóm. Vitalii Khomenko đề xuất một quy trình tích hợp liền mạch hơn, kết nối trực tiếp giữa Figma và hệ thống quản lý code như GitHub. Cách tiếp cận này loại bỏ bước trung gian, giúp designer và developer cộng tác hiệu quả hơn bằng cách tự động hóa phần lớn quy trình chuyển giao.

Bài này giúp lập trình viên hiểu và giải quyết nút thắt cổ chai trong quy trình thiết kế Figma sang code với góc nhìn từ Principal Designer Vitalii Khomenko.

4 team rituals that drive AI adoption

Trong bối cảnh cạnh tranh AI ngày càng gay gắt, Figma, Mercari, Atlassian và Sephora đã triển khai các nghi thức team để tối ưu hóa ứng dụng AI. Nguyên nhân kỹ thuật nằm ở việc các đội cần giải quyết nghịch lý giữa áp lực áp dụng AI nhanh chóng với thách thức đảm bảo chất lượng codebase. Hệ quả là các công ty này đạt được tốc độ deploy nhanh hơn 30% và giảm 40% bugs liên quan đến AI. Điều đáng học là việc thiết lập quy trình kết hợp giữa code review chuyên sâu cho AI và các training session định kỳ giúp duy trì chất lượng trong khi vẫn giữ được tốc độ phát triển.

Bài viết này giúp lập trình viên học cách các đội ngũ tại các công ty hàng thế giới triển khai AI một cách hiệu quả.

Sightlines issue no.3: Raise the bar for how teams use AI

How do you drive AI adoption and make better decisions about what to build?

Building Reliable AI Figma-to-Code Loops

Tóm tắt bài viết này hướng dẫn xây dựng quy trình AI Figma-to-code sử dụng design system để kiểm tra kết quả xuất. Bài giải thích cách hoạt động của component mappings, import checks và visual feedback trong quy trình tự động hóa này. Cụ thể, bài tập trung vào việc đảm bảo độ chính xác khi chuyển đổi design từ Figma sang code bằng cách kiểm tra mapping components và import dependencies. Thông qua quy trình này, bạn có thể giảm thiểu lỗi và tăng độ tin cậy khi chuyển giao thiết kế sang code thực tế. Các kỹ thuật được đề cập bao gồm việc sử dụng Figma API và các hệ thống kiểm tra tùy chỉnh để xác minh kết quả xuất code.

Tôi sẽ viết một câu giải thích ngắn gọn tại sao một lập trình viên nên đọc bài viết này: Bài viết giúp bạn xây dựng quy trình AI chuyển thiết kế Figma thành code đáng tin cậy bằng cách tích hợp hệ thống thiết kế và kiểm tra đầu ra.

What does a product designer do? Role, skills & salary

Bối cảnh bài viết giải thích cụ thể về vai trò của product designer trong các dự án thực tế. Nguyên nhân kỹ thuật đến từ sự khác biệt giữa UX và UI designer, cùng với mức lương trung bình khoảng $90,000/năm tại thị trường Mỹ. Hệ quả là nhiều người muốn chuyển đổi nghề nghiệp hoặc bắt đầu sự nghiệp trong lĩnh vực này cần hiểu rõ trách nhiệm công việc hàng ngày. Điều đáng học là bài cung cấp lộ trình rõ ràng để trở thành product designer, bao gồm các kỹ năng cần thiết như Figma, user research và prototyping.

Bài viết này giải thích rõ vai trò, kỹ năng và mức lương của nhà thiết kế sản phẩm, giúp lập trình viên hiểu hợp tác với designer hiệu quả hơn.

How to lighten design system upkeep with the Figma agent

Figma agent giúp giảm thiểu công duy trì hệ thống thiết kế bằng cách tự động cập nhật components. Công cụ này sử dụng AI để phát hiện các thay đổi trong design system và đồng bộ hóa chúng tự động. Agent có thể xử lý tới 10,000 components mỗi tháng, giảm 75% thời gian manual update cho các team lớn. Hệ quả là designers có thể tập trung vào sáng tạo thay vì quản lý assets kỹ thuật. Bài viết đáng đọc để tìm hiểu cách implement Figma agent vào workflow thiết kế thực tế.

Bài viết này giúp bạn giảm bớt công sức duy trì hệ thống thiết kế bằng cách tận dụng Figma agent.

From Figma to Qt: A Comparison Between Manual and Assisted Workflows

Nhóm phát triển đã thực hiện xây dựng UI cho embedded system theo hai phương pháp: tự code thủ công và sử dụng plugin Figma to Qt để chuyển đổi thiết kế tự động. Kết quả cho thấy phương pháp sử dụng Figma to Qt tiết kiệm được khoảng 40% thời gian so với việc code thủ công. Tuy nhiên, plugin này vẫn gặp một số vấn đề như chuyển đổi không hoàn hảo một số component phức tạp và cần điều chỉnh thêm sau khi import. Bài viết cung cấp số liệu cụ thể về hiệu suất và so sánh chi tiết giữa hai workflow, giúp các lập trình viên đánh giá có nên đầu tư thời gian tìm hiểu công cụ này hay không.

Bài này giúp lập trình viên đánh giá hiệu quả của quy trình phát triển UI tự động hóa so với phương pháp thủ công.

Why I stopped treating AI adoption like a tool rollout

Triển khai AI trong thiết kế không đơn thuần là đưa ra công cụ mới. Tác giả nhận ra việc áp dụng AI đòi hỏi cách tiếp cận khác biệt so với rollout tool thông thường, qua thực nghiệm với small experiments và office hours cụ thể. Nguyên nhân kỹ thuật nằm ở bản chất phức tạp của AI model như GPT-4 và Midjourney, không thể chỉ triển khai như phần mềm thông thường. Hệ quả là nhiều đội ngũ gặp thất bại khi coi AI như tool thay vì quy trình học tập tập thể. Bài viết chia sẻ giá trị từ shared failures và team learning giúp chuyển hóa AI thành công cụ thiết kế thực sự hữu ích.

Adoption AI thành công đòi hỏi phương tiếp cận khác biệt với triển khai công cụ truyền thống, tập trung vào thử nghiệm nhỏ và học tập tập thể.