File and project organization in Figma - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to create a new Figma file named 'Dashboard'.

Figma

figma.[1]('Dashboard')

Drag options to blanks, or click blank then click option'

AopenFile

BcreateFile

CdeleteFile

DsaveFile

Attempts:

3 left

💡 Hint

Common Mistakes

Using openFile instead of createFile

Trying to delete before creating

Use createFile to start a new Figma file.

2fill in blank

medium

Complete the code to add a new page named 'Sales Data' to the current Figma project.

Figma

currentFile.[1]('Sales Data')

Drag options to blanks, or click blank then click option'

AduplicatePage

BremovePage

CrenamePage

DaddPage

Attempts:

3 left

💡 Hint

Common Mistakes

Using removePage which deletes a page

Trying to rename before adding

The addPage method adds a new page to your Figma file.

3fill in blank

hard

Fix the error in the code to rename a page to 'Q1 Report'.

Figma

page.[1] = 'Q1 Report'

Drag options to blanks, or click blank then click option'

Aname

Blabel

Ctitle

Did

Attempts:

3 left

💡 Hint

Common Mistakes

Using title or label instead of name

Trying to change the id which is fixed

The page's name property is used to rename it.

4fill in blank

hard

Fill both blanks to move a frame named 'Chart' to the page named 'Summary'.

Figma

frame.[1] = pages.[2]

Drag options to blanks, or click blank then click option'

Aparent

Bchildren

Cname

Did

Attempts:

3 left

💡 Hint

Common Mistakes

Using children which is a list

Using name which is not a direct reference

Set the frame's parent to the page with the correct id.

5fill in blank

hard

Fill all three blanks to export a frame named 'Summary Chart' as a PNG file.

Figma

frame = currentPage.[1]('Summary Chart')
exportSettings = { 'format': '[2]' }
frame.[3](exportSettings)

Drag options to blanks, or click blank then click option'

AfindChild

BPNG

CexportAsync

DgetChild

Attempts:

3 left

💡 Hint

Common Mistakes

Using findChild which is not a Figma method

Wrong export method name

Wrong format string

Use getChild to find the frame, set format to PNG, and call exportAsync to export.