
GoDaddy
Figma Starter File
An internal Figma plugin and library for file organization
Figma Starter File
An internal Figma plugin and library for file organization.
Shopper Search
Designing and developing themes for the internal Customer Relationship Management tool.
01. The Challenge
Figma is the standard design tool for GoDaddy. However, since adoption of the tool, stakeholders, engineers, and design leads found it difficult to:
-
locate the latest designs for a single project
-
understand project goals, scope, and background
-
find design components or archived designs

My Role:
Research, UX design
Tools Used:
Figma, JavaScript, Github

Problem Statement:
How might we organize design files to make them easier to navigate for GoDaddy stakeholders?
02. The Strategy
In order to create the best solution, it was important to first understand:
how designers organize their existing Figma files
how project stakeholders, engineers, and design leads reference Figma

How do designers organize Figma currently?
It quickly became clear that there was no shared structure for organizing design files. Some designers made a new page for each version of a design, while others placed old versions in an archive page. Latest designs or final designs didn't have a shared name. Some designers labeled projects "current". Others used emojis like a checkmark to signify "done".

How do stakeholders reference Figma?
Talking with product managers, design leads, peer designers, and engineers helped to clarify what stakeholders were looking to get out of a design file.

Creating a standard page list
Conversations with the design team helped to shape the framework. I compiled feedback and created recommendations. These were shared using Loom and Slack. An example of an iteration communicated over Slack can be seen below:
The final page structure
The team decided that grouping content with a clear label was the best approach to define and organize design work. Visuals, in the form of emojis, helped stakeholders find what they needed more quickly.
We also found that the emojis helped to set expectations for the design work within that page. For example, a checkmark meant that the project was final and ready for development, whereas a construction sign meant that the work was in-progress.


A shared library for the Readme page
A shared library of project cards allowed designers to provide high-level project details. The cards could also double as a presentation to stakeholders.


Creating a starter file Figma plugin
The key to making this successful was easy adoption. A JavaScript plugin allowed designers to add the starter page list to their Figma files with two clicks.
03. The Solution
The plugin and shared card library are available internally to all GoDaddy designers.