UX Design • Systems Design
How I built a design system in Figma and anutomation pipeline with Cursor to transform stakeholder communication and reduce page build time by 75%.
Reduction in page build time
to generate a complete page
University websites supported
Work automated via Cursor
Utah State University manages a large digital ecosystem. Our central IT Web Team directly maintains more than 75 university websites and supports dozens of additional editors and webmasters across campus. Any update to these supported sites filters through our small team, which means meticulous efficiency and clarity are essential.
As a UX Designer and Project Manager on this team, I helped stakeholders from colleges, departments and administrative units to understand their needs, translate ideas into wireframes and guide our students through the various UI/UX courses. Being on this team, I noticed a recurring challenge: most stakeholders have little experience with design or web development, yet they make critical decisions about their digital content.
This case study is the story of how I addressed these challenges by introducing a design system in Figma and building a code automation workflow using Cursor and the Modern Campus CMS.
Two major friction points slowed our work.
Translate ideas quickly and visually
Iterate in real time with stakeholders
Reduce manual build time inside the CMS
Produce consistent, accessible code at scale
Before I joined, the web team did not use Figma or any dedicated design tool. Pages were designed directly inside the CMS, which meant every change required development effort and every random site got projects done.
I introduced Figma as a lightweight foundation tool. The goal was not pixel-perfect mockups. The goal was speed, clarity and a shared mental model.
For the first time, everyone had a shared language.
Design reality was bittersweet, but build time was still a bottleneck. The Modern Campus CMS requires unique markup, encoded component structures and custom CSS/JS support. Translating Figma into production pages was a slow process.
To bridge that gap, I created a set of Cursor rules that act as a component map between our Figma system and our CMS implementation.
With the Figma MCP integration, I can now paste a Figma design into Cursor and say "Build this page." Cursor parses the design, exports HTML and publishes a nearly complete page.
The result: about 90 percent of the work is now automated in roughly two minutes. Our team now publishes pages with minimal refinements like linking media assets.
This also transformed how we handle existing pages. Instead of manually updating dozens of pages or layout sections one by one, Cursor can regenerate updated components instantly.
Pages that once took hours now take minutes. Iteration is simple because updating a design and regenerating code is quick.
Using a tagged system ensures accessible, standardized code across all sites.
Stakeholders produce clearer, accessible content when they can see the structure before writing.
With over 75 sites to manage, these gains compound. Our small team can support a much larger ecosystem without sacrificing quality.
Introducing Figma helped solve our communication challenge. Building the automation pipeline with Cursor solved our scale challenge. Combined, these systems allow our team to work more efficiently, collaborate more effectively and ship changes much faster.
I've learned new methods to work both inside a workflow, design solutions that fit the real constraints of a team and create tools that amplify everyone's output. It demonstrated the value of bringing UX thinking not only to interfaces, but to internal systems and processes.