今日已更新 84 条资讯 | 累计 37333 条内容
关于我们

标签:#GM

找到 33 篇相关文章

AI 资讯

Why AI Keeps Generating the Wrong Design Tokens and How I Fixed It with Figma's API

AI design system output is approximate by default. Wrong border radii, raw hex values, inconsistent tokens across 60 components. The fix isn't better prompts. Here's the structural change that made it exact using Figma's REST API. The fourth time I manually corrected the same border radius mistake in an AI-generated component, I stopped and asked why this kept happening. Not "what prompt would fix this?" The deeper question: why does every AI tool I tried get the structure right and the values wrong? The button was correct. The variants were there. The layout matched the Figma spec. But borderRadius: 8 when it should be borderRadius: '8px' . A spacing gap of 8 when the spec said 6 . The color #3B82F6 sitting in the file where semantic.button.primary should be. None of it wrong in a way that breaks the build. All of it wrong in a way that breaks the design system. After hitting this wall enough times, I realized the problem wasn't the AI. It was the question I was asking it. Why AI keeps generating the wrong Figma design tokens When you give an AI tool a Figma screenshot and ask it to produce a component, it does something reasonable: it interprets what it sees. The structure, the layout, the hierarchy - it gets most of that right. What it cannot get right is the token mapping. The AI doesn't know your semantic token file. It doesn't know that #3B82F6 maps to semantic.button.primary in your codebase. It doesn't know that your MUI setup multiplies numeric border radii by 4, which means borderRadius: 8 renders at 32px instead of 8px . So it approximates. Here's what that looks like in practice: What AI produces What the spec requires Why it's wrong borderRadius: 8 borderRadius: '8px' MUI multiplies numeric values by 4 gap: 8 gap: 6 Spacing value not extracted from Figma color: '#3B82F6' semantic.button.primary Raw hex instead of semantic token fontSize: 14 variant="MD_Medium" Typography token not resolved Across one component, these deviations are small. Across 60 comp

2026-06-09 原文 →
AI 资讯

Turning Kiro Into a Leadership Coach With Meeting Transcripts

As an Engineering Manager in a Platform team, I manage 10 engineers. I'm hiring more. I run weekly 1:1s, facilitate technical decision meetings, screen candidates, moderate retrospectives, and still need to keep up with the delivery of a platform spanning dozens of AWS accounts. Besides the lack of time to focus on technical problems, the technical part is not even the real challenge. The less obvious problem becoming an Engineering Manager is: the skills you need as an engineering manager are fundamentally different from those that made you a great engineer , and there's no compiler or unit test to tell you when you're doing them wrong. The feedback loop is absent or very slow (and when you realise that, your team has already gone silent or become dependent on you because you are the main input and the main bottleneck). Skills That Don't Come From Code As a senior or staff engineer, you develop communication skills gradually. You present ideas, challenge others respectfully, summarise outcomes, and identify owners. You participate in technical deep dives and put candidates at ease while probing technical depth. These are valuable skills, and a good IC develops them over the years. But unless you start behaving like a brilliant jerk , they're secondary - your technical depth is still what defines you. But as an EM, the game changes. You're not "the smartest person in the room" anymore, and increasingly, you shouldn't be. You still have a broad context from all those alignment meetings and roadmap syncs, but you lose contact with the codebase week by week. If your organisation has principals or staff engineers, you're not even close technically anymore. Your job is to give direction, create space for others to solve problems, and facilitate decisions, not to be the one with the answer. This is hard. Especially when you used to be the one with the answer. The urge to jump in doesn't disappear just because your title changed. And interviewing? Facilitation? Giving feed

2026-06-08 原文 →
AI 资讯

I Thought Figma MCP Could Recreate Any Design. I Was Wrong.

Introduction Since I started publishing articles on Dev.to, I've been working on a personal project to transform my old blog website—which is no longer actively maintained—into a portfolio site ♻️ As part of that project, I recently started learning Figma and UI design🎨 When I discovered Figma MCP , I imagined a future where generative AI could automatically create polished, modern, and visually appealing designs for me with minimal effort 😎 Unfortunately, reality turned out to be quite different . This article is a reflection on that experience and a reminder to my future self about what I learned along the way📝 TL;DR I wanted to design a portfolio website in Figma , but quickly realized that UI design was more difficult than I expected. I wondered whether using Codex and Figma MCP would allow me to outsource the design process to AI , so I decided to try it. I couldn't magically generate the polished design I had imagined while also maintaining a well-structured Figma file with globally managed variants and reusable components. I learned that defining design rules first and building components step by step helped produce results that were much closer to my original vision. Even then, the process was not dramatically easier than expected, so I eventually decided to keep things simple and build my portfolio around the design principles already provided by shadcn/ui . What I Tried with Figma MCP🎨 While planning the UI design for my portfolio website , I initially created simple wireframe-like layouts in Figma to explore the overall page structure and component placement before working on detailed designs. At first, I wanted to keep things simple. However, as I continued working on the project, I found myself wanting something more polished, more modern, and ultimately more impressive . The problem was that I have very little confidence in my design skills. I'm an in-house IT engineer, not a professional developer or designer, so I often struggle to judge what makes a

2026-06-02 原文 →
AI 资讯

Turn Figma frames into clean React, Angular, Vue, or HTML with AI — meet PixToCode

PixToCode is a new Figma plugin that turns the frames you've already designed into production-ready code with AI — React, Angular, Vue, or HTML, all Tailwind-first. Just published on the Figma Community: figma.com/community/plugin/1641790551381890223/pixtocode What it does Select one or more frames in Figma, pick a framework, click Generate. About 10 seconds later you have clean code that uses the exact colors, spacing, typography, and layout from your file — not generic Tailwind utility soup. Highlights: 4 frameworks — React (TypeScript), Angular (standalone + Signals), Vue 3, or semantic HTML5. All Tailwind-first. UI library presets — shadcn/ui, Material UI, Chakra, Ant Design on React, Angular Material on Angular. Output uses the real components , not generic divs. Refine with plain English — type "make the button rounded" or "use green for the active tab" and the AI rewrites the component in place. Multi-frame batch — select up to 5 frames, get them all in one pass. Variants → typed props — a Figma Component Set with Primary / Secondary / Disabled becomes one typed prop-driven component, not three duplicate files. Live browser preview — see the generated component rendered in a sandboxed tab before pasting it into your project. Cloud history — every generation saved to your account, synced across devices. How it works Get a free license key at pixtocode.com (5 free generations, no credit card). Install the plugin from the Figma Community. Paste the key into the plugin's license field. Select a frame, choose a framework, click Generate. Copy the code straight into your project. That's the whole flow. Pricing Free — 5 generations on signup Pro — $20/month for 100 generations Power — $39/month for 250 generations Team — $99/month, 5 seats, 600 shared generations (scales to 10 seats) All paid plans have a 7-day refund guarantee. Tips for best results Frames with auto-layout , named layers , and consistent design tokens produce the cleanest output. For huge dashboard

2026-06-02 原文 →