Category
Design OPs
Date
2021
/w=3840,quality=80,fit=scale-down)
Highlight
- In mid-2021, took the initiative to lead and facilitate the transition of the design team from Adobe XD to Figma.
- Created a tool comparison presentation to inform team members about the advantages of migrating to Figma and how it could address design workflow issues.
- Initially assumed the roles of component creation and software training, proactively transferring components to Figma, significantly reducing the team's migration costs.
- Integrated three separate Color Systems into one.
- Aligned color tokens with the latest Figma variables features.
Background
- Having successfully transitioned design tools to Figma for over six months in my previous company, I encountered numerous tool usage issues during the initial implementation at Dcard. These challenges significantly increased the design time costs, including:
- Adobe XD's inability to separate Pages, requiring a new file for each platform to facilitate engineer readability.
- Lack of collaborative editing, resulting in repetitive file update checks when updating UI screens.
- Cumbersome steps for minor UI adjustments, such as saving as a local file before uploading to the cloud.
- Absence of Variants functionality, leading to high component management costs and less flexibility in usage.
- Devmode's inability to display components outside the canvas, rendering flowcharts on design drafts inaccessible to engineers.
Project Difficulties
- At the time, the team had just transitioned from Sketch to Adobe XD less than six months prior, and completing the full transition to Adobe XD took the team over six months. This resulted in a low willingness within the design team to migrate tools.
How I Convince the Team
- Made a very Detail Presentation comparing tool functionalities and advantages with Figma, including:
- Introduction to Figma and its features.
- File management methods.
- Figma's operational workflow.
- Explanation of Variants and its usage.
/w=3840,quality=80,fit=scale-down)
- Helped the team understand the problems that could be resolved and the operations that could be saved post-transition:
- Introduced open resources & Demonstrated practical plugins
- Sum up
- Proactively proposed to take responsibility for the initial component library creation, including the first versions of iOS and Android components.
/w=3840,quality=80,fit=scale-down)
/w=3840,quality=80,fit=scale-down)
Handoff Document for Developers
- Made a Document with GIFs
- Explain how to use Figma, along with some practical tutorials.
/w=3840,quality=80,fit=scale-down)
/w=3840,quality=80,fit=scale-down)
Result
In the end, Our team spent approximately 4 months completing all migrations and has been continuously using Figma up to now. Additionally, the team has greatly enjoyed the various convenient features provided by Figma.
