Skip to main content
Question

What's the best way to add the event and other data we'd like to track at the component level in Figma designs?

Justin1

Hey there,

Each web or app screen we design in Figma has components like links, buttons etc.
When we send the design files to the engineers we’d like to include the events and event properties so it’s super clear what sort of data orchestration is required.

eg.
analytics.track("click", { elementType: "button", text: "Get Started" });

Additionally to enable those type of track events to be dynamic we would like to also show the element ids and data-* attributes of the HTML to be clear on naming conventions.

Is there a plugin we can use to make it easy to include this kind of data?

Thanks in advance 😁

6 replies

Kuldeep_Singh

Justin, have you find the best way to put events data in the Figma file for dev team?

Laur_Ciorobea
1 person likes this
  • Laur_Ciorobea
    Laur_Ciorobea
Justin1
  • Justin1
  • Author
  • New Member
  • 4 replies
  • October 4, 2021

The best solution I’ve come up with for now is to duplicate the design frames and delete the designs on the duplicate frame and just populate them with the require tracking elements.

You can see them side-by-side and it’s clear enough to get the job done though not ideal.

It’s not the best solution and we’re still maintaining a separate track plan in a spreadsheet.

Laur_Ciorobea
1 person likes this
  • Laur_Ciorobea
    Laur_Ciorobea
Laur_Ciorobea

Hi @Justin1 and @Kuldeep_Singh! Our team and I are building a solution that would do just that!

We’re still talking to users experiencing the problem to plan the best possible approach, would you potentially be interested in a 20 minute interview with us? Our testers will get to use our product for free when it comes out, so there’s an extra perk for you there! 🙂

You can contact us at info@qualas.io!

PS. The offer stands for anyone reading this post, we look forward to hearing from you! 🚀

Laur_Ciorobea1

Hi guys!

After many user interviews, we built a tracking tool for Figma! It allows you to set up your data tracking, send it to Jira, and monitor implementation, all without ever leaving Figma! 🧰

You can find us here: https://www.figma.com/community/plugin/1085962437808652484/Qualas-Tracking-Plan

Our plugin allows you to:
🏷 Label tracking events directly on your canvas, set with properties, tags, platform, status and more
✅ Create tracking plans, including interaction screenshots and identifiers, comments, tags and implementation status
📄 Export your tracking plan directly to Jira! Updates sync with your Figma tracking plan, so it doubles as a dashboard!

Hope it’s useful @Kuldeep_Singh and @Justin1, and please do not hesitate to reach out for any questions or help!

Best wishes,
Laur

A
  • Asis
  • 1 reply
  • October 18, 2023

Hello everyone! We are late to the party 🎉 but we’ve built a dedicated solution that plugs to your Figma design files. We are currently rolling out our closed Beta, checkout our web and get in touch if you’d like to give it a try 😎

glazedanalytics.com
Alex_Ran
  • Alex_Ran
  • 3 replies
  • October 18, 2023

👋 Hey folks here is a Figma widget where you can add tracking plan to your design file:

Figma

Reply


Terms & ConditionsCookie settings

Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings