How Witze Van der Straeten Uses AI to Build a Figma-to-Drupal Workflow

Witze Van der Straeten is a front-end web development student at Artevelde University in Ghent, Belgium, and the person many in the Drupal community now recognise for shaping a new Figma-to-Drupal workflow. What began as part of his learning process quickly became a community talking point, especially after his work appeared in the DriesNote at DrupalCon Vienna 2025.

He didn’t arrive at Drupal with a grand plan. He heard about it in school, saw it again at Drupal Dev Days Leuven, and discovered a community that worked in a way he hadn’t seen before. One line he shared captures this feeling well: 

"In Drupal, I saw people shaping tools while using them, listening to each other, and building together." 

The Drop Times reached out to Witze because his workflow sits at an interesting intersection of design, development, and automation. It reflects what new developers are exploring today and how quickly AI is changing expectations in front-end work.

In this interview with The Drop Times, sub-editor Kazima Abbas speaks with Witze about his early steps with Drupal, the technical challenges behind generating components from Figma, his back-and-forth exchanges with Dries, and the potential role AI might play in shaping future workflows. The conversation walks through where his ideas came from, what he learned along the way, and how he sees the Drupal ecosystem evolving.

TDT[1]: Let’s start at the beginning: Before your internship at Calibrate, you hadn’t worked with Drupal. What was it about your first encounter, especially at Drupal Dev Days Leuven, that changed your mindset about development and community?

Witze Van Der: I heard about Drupal once at school when they were explaining what a CMS was, before we started working with CraftCMS. I also remember them saying the founder of Drupal is Belgian and his name is Dries, but we didn't really get into it. What really stood out later was discovering there's such a caring community behind it. In school, when we learned coding languages or CMSs, I never expected there could be a community where people work in their free time to help everyone, socialise at events, and even companies that are competitors collaborate with each other. Drupal unites them all, at least, that's how it felt to me, even if the community knows this far better than I do.

TDT[2]: As someone studying both Web Development and Interactive Media at Artevelde University, how did your formal education prepare you (or not) for working with Drupal and emerging approaches like the Model Component Protocol (MCP) and tools like Canvas AI?

Witze Van Der: The Artevelde Graduate Degree in Web Development helped me a lot. Instead of focusing only on very technical details, they give you time and mentoring to explore different ways of building websites, so you can discover what you enjoy most. It helped with Drupal because we saw different CMSs and learned the overall basics, and most importantly, how to figure things out yourself. We didn't see MCPs in school, probably because they're new. We did learn how to use AI for coding, but it was mostly "try it and learn it yourself." That definitely helped me when learning it on my own later.

TDT[3]: You’ve said that discovering Drupal made you rethink the entire relationship between design, development, and community. Can you break down what that shift looked like for you, practically and philosophically?

Witze Van Der: Before Drupal, I saw design and development as separate steps. You design in Figma, hand it off, and developers translate it into code. Drupal, especially through SDCs and the Figma workflow, showed me that design and development can speak the same language. When that happens, the handoff becomes a conversation, not a translation task. 

When I shared my Figma tutorial, people didn't just use it, they engaged, gave feedback, and helped improve it. That's when I realised contribution isn't about having all the answers. It's about showing up, sharing what you're trying, and building together. That changed how I think about everything I create now.

TDT[4]: Single Directory Components (SDCs) and UI Suite caught your attention during your internship. What specifically drew you to SDCs, and how did they change your approach to front-end development in Drupal?

Witze Van Der: SDCs caught my attention because they solved a problem I didn't know I had. At school, we learned component-based thinking with React. When I started at Calibrate, someone introduced me to SDCs, and it immediately clicked. Everything for a component–template, styles, JavaScript, and schema–is in one folder. Before, I was hunting through different directories to find pieces of the same component. With SDCs, it's all right there. It made front-end work in Drupal feel modern, like real component development instead of traditional CMS theming. That's huge.

TDT[5]: You were one of the first to explore Figma MCP server integration with GitHub Copilot and Drupal. What technical roadblocks did you hit while making Figma components appear within Twig templates, and how did you solve them?

Witze Van Der: The hardest part was understanding how it all worked. It's so new that there's almost no documentation. When I had the MCP connected and the Drupal site ready, I started experimenting with instructions. At first, I tried one big detailed prompt, but I still got errors and never cleaned Twig output. The file structure was wrong. So I added more context, telling Copilot to check the folder structure first, then generate components that matched the pattern. That worked better. With the Drupal Canvas version, I used a very detailed instruction file listing all the errors that could happen. Copilot automatically added corrections when generating a component. I documented everything in the repo for anyone who wants to see the exact setup.

TDT[6]: In your own words, what makes the Figma-to-Drupal workflow more than just a "cool experiment"? Where do you see it saving the most time or solving real pain points in the development cycle?

Witze Van Der: I've talked to a lot of people working in Drupal agencies, and they all mention the same pain point: the communication gap between design and development. Whenever something changes, there's a chain of steps: the designer updates Figma, exports assets, informs devs, the devs update the code, check if it matches, and if not, it goes back again. That back-and-forth eats time. With this workflow, when a designer updates a component in Figma, the developer can pull those changes and regenerate the Twig templates. Not perfect code, but a strong starting point. For example, changing button styles across 50 components. Normally, that's tedious manual work. With this? Update in Figma, regenerate, done. It's not production-ready, but the foundation is there. And with how fast AI tooling grows, maybe in six months it will be standard practice.

TDT[7]: Your tutorial on the Figma-to-Drupal workflow gained traction within the Drupal community on Slack. What kind of feedback or collaboration came from that exposure, and how did it shape the project?

Witze Van Der: When I shared the project on Slack, people started interacting with it, and that showed me it was something the community had been waiting for. I didn't expect that. The feedback gave me a lot of motivation to keep working on it. And without the community, I would never have come into contact with Dries, and it would never have been featured in the DriesNote.

TDT[8]: From your perspective, which parts of the Figma-to-Drupal workflow need the most automation, and how might AI agents help improve or accelerate those steps?

Witze Van Der: The Drupal AI Agents module could really speed things up. Right now, the workflow generates Twig templates, but you still need to manually set everything up in Drupal, component schema, field configuration, and register it all. An AI agent could analyse the generated Twig and automatically create the needed config: fields, schema files, and display settings. If a Figma component has dynamic content, the agent could map it to existing fields or create new ones. It could also detect updates in regenerated Twig and adjust only the relevant config without breaking content. MCP provides design data, Copilot generates code, and AI Agents could handle the Drupal integration.

TDT[9]: Drupal Canvas is positioned as a visual page builder that significantly shortens development time. What was your first impression when working with Canvas, and how did it align or clash with your expectations as a front-end developer?

Witze Van Der: I haven't worked with it a lot yet, but from what I tried, I really believe it could be game-changing, especially with the team behind it. It feels more integrated with Drupal, rather than sitting on top of it like some page builders. You're still working with Drupal's content architecture, just visually. I haven't used it deeply enough to compare it with other builders, but the direction feels right, especially the component-based focus.

TDT[10]: Your Figma-to-Drupal workflow experiments eventually intersected with Canvas. What were the most challenging technical aspects of making Figma components editable and functional inside the Canvas environment?

Witze Van Der: I tried many ways to get it working and had to start over a lot. At first, I tried using the Drupal MCP so you wouldn't need the terminal, but it created components automatically in ways that didn't always match what I wanted. So I needed a way to make it work without using the Drupal MCP tools directly, but still have components created automatically in Canvas. That was the hardest part, bridging the gap between the generated Twig and proper registration inside Canvas without breaking things.

TDT[11]: From a student and early-career developer’s perspective, how accessible is Drupal Canvas to those new to Drupal? Is the learning curve reasonable, or does it still require deep technical guidance to use effectively?

Witze Van Der: I still need to learn much more about Canvas, so I can't fully judge the learning curve. From what I tried, it feels more visual and immediate than traditional Drupal configuration, which helps beginners. But I haven't used it enough on complex cases to know if that feeling stays.

TDT[12]: Dries mentioned that Canvas 1.0 was launching soon, and that the energy around it at DrupalCon Vienna was electric. What do you think is fueling that momentum, and what’s still missing from Canvas that you'd like to see in future versions?

Witze Van Der: The energy around Canvas was definitely there. People were excited to see a visual builder that works with Drupal's component architecture instead of against it. Drupal has been powerful but intimidating; Canvas could change that. It also arrives at the perfect moment with all the work happening on SDCs and design systems.
What I'd love to see is native integration between Canvas and design tools like Figma. Imagine a component library view in Canvas where you see all imported Figma components and can drag them into layouts. Or being able to tell the Canvas AI assistant: "pull the button component from Figma", and it uses MCP to fetch it, generate Twig, and make it available immediately. That would truly bring design and development together.

TDT[13]: You’ve worked directly with Dries Buytaert, even contributing to the DriesNote keynote at DrupalCon Vienna. How did that collaboration begin, and what was it like to receive feedback and be featured by Drupal’s founder at a major international conference?

Witze Van Der: After sharing my SDC tutorial on Slack, a few days later, Dries messaged me on LinkedIn saying he was interested and asked for a demo. I sent one, and he liked it, but said it still had a lot of manual work. He asked if Canvas could speed it up, so I started trying it in Canvas. I sent him a lot of updates, maybe too many (sorry for the spam, Dries). I was even working late at night, and he had to tell me to get some sleep. What surprised me was how natural it felt talking to him, not like talking to the founder of Drupal. He helped me throughout the process, and now I understand how he built such a community. 

Looking back, it feels surreal. Seven months ago, I didn't even know Drupal. Then I was presenting my work at an international conference. That only happens in a community that looks at your ideas, not your résumé.

TDT[14]: Many students and junior devs feel intimidated by contributing to open source. What would you say to someone in that position, especially in light of how your contributions have grown organically from one internship project?

Witze Van Der: I was scared, too. I couldn't believe something I made could help the community, especially knowing how many talented people are out there. My advice: everyone is capable of contributing. Even sharing an idea is contributing. People will help you, just like they helped me. Everyone has a different view on things, and even opinions matter.

TDT[15]: As AI gets better at interpreting design intent and context, do you think tools like Canvas or AI agents could eventually take over major parts of the front-end development workflow?

Witze Van Der: Yes and no. AI will definitely speed things up so front-end developers can focus on more important things like accessibility, performance, and usability; things that often get overlooked when you're busy translating designs into code. I don't think front-enders will lose their jobs. It's more about improving communication between design and development. AI can handle repetitive work, freeing developers to focus on quality. But AI grows fast, so who knows what the future holds.

TDT[16]: Some say open source today is less about shared ideals and more about individual utility. Developers often remain mere takers, and some maintainers — even while publishing code — avoid feedback or collaboration. With permissive licenses increasingly favoured over reciprocal ones, and AI-generated code blending open source logic into proprietary systems, has the meaning of open source changed? And by mostly calling it just "open source," are we quietly stepping away from the values behind "Free" and "Libre"? Does it still matter the way it once did?

Witze Van Der: I don't think I have enough experience to fully answer this. I've heard big companies sometimes take without contributing, and that happens in many areas, like food banks or social services, where some people abuse the system. You can be strict and prevent abuse, but then you also hurt the people you're trying to help. Open source feels similar: if you make it more restrictive, you hurt learners and genuine contributors. From what I've seen in Drupal, a strong community culture encourages people to contribute in their own way, code, ideas, feedback, and anything. But again, that's just my opinion.

TDT[17]: Looking beyond Canvas, MCP, and Figma, are there any other emerging tools or standards in AI or design systems that you’re excited to experiment with or think could impact the Drupal ecosystem?

Witze Van Der: The whole AI module is super interesting. The AI team adds so much cool stuff that I can't keep up. I'm also curious about tools like Cursor for AI-assisted coding. They use a more conversational approach, and I'd like to see if that improves workflows like Figma-to-Drupal.

TDT[18]: As someone actively looking for real-world opportunities, what kind of projects or teams are you most eager to join? Are you leaning more toward AI, design systems, or something else entirely?

Witze Van Der: Lately, I've been getting a lot of scam emails and WhatsApp messages, and they're getting better. They use AI to write them, making them more convincing. I'd love to create something that protects people, especially older people, by using AI to detect scams and filter them out. Professionally, I'm interested in many things. AI in coding workflows, AI inside websites (like chatbots), but also business-side AI for communication and support. I think I need to try different things to know what I want to focus on. I'm excited to explore where AI and web development intersect.

TDT[19]: Finally, what does success look like to you, not just in terms of code or projects, but in the way you contribute to the open-source world and shape your role as a front-end developer?

Witze Van Der: This is a deep question: what is success? I personally don’t really like the word “success,” because in my head it sounds like something that’s finished, and for me, real success is the opposite. It’s about continuing to build things, getting better, and learning stuff you didn’t know before. Just staying active as much as possible, not only professionally but also with things you genuinely enjoy. Having your agenda full is actually a blessing.

For me, success in open source means continuing to contribute ideas and experiments, even if they’re rough or incomplete. It’s about sharing what I’m learning and hoping it helps someone else solve a problem. I don’t need to be the person who builds the next big thing. I just want to be someone who shows up, tries things, and shares the results.

As a front-end developer, I think success means staying curious about how everything connects: design, development, AI, and user experience and finding ways to bridge those gaps. If I can make workflows a bit smoother or communication between teams a bit easier, that feels like real impact.