Content generation plugins (Lorem ipsum, icons) in Figma - Real Business Scenario

Scenario Mode

👤 Your Role: You are a UI/UX designer working on a new dashboard prototype in Figma.

📋 Request: Your manager wants you to quickly create a realistic dashboard layout with placeholder text and icons to show the design concept to stakeholders.

📊 Data: You have access to Figma's content generation plugins that can insert Lorem ipsum text and a variety of icons directly into your design frames.

🎯 Deliverable: A Figma dashboard prototype with sections filled with generated placeholder text and relevant icons to represent data categories.

Sample Data

Section	Content Type	Example
Header	Text	Lorem ipsum dolor sit amet
Navigation	Icons	Home, Settings, Profile icons
Sales Summary	Text + Icon	"Total Sales" with dollar icon
Trends Chart	Placeholder Text	Chart title with lorem ipsum subtitle
Footer	Text	© 2024 Company Name

1

Step 1: Create a new Figma file and add frames for each dashboard section: Header, Navigation, Sales Summary, Trends Chart, Footer.

Use the Frame tool to create frames sized appropriately for each section.

Expected Result

Five frames named Header, Navigation, Sales Summary, Trends Chart, and Footer appear on the canvas.

2

Step 2: Use the Lorem Ipsum text plugin to insert placeholder text in the Header frame.

Run the plugin, select 'Insert Lorem Ipsum', choose 1 paragraph, and place it inside the Header frame.

Expected Result

Header frame contains a paragraph of Lorem ipsum text simulating a title or introduction.

3

Step 3: Use the icon plugin to add navigation icons in the Navigation frame.

Open the icon plugin, search for 'home', 'settings', and 'profile' icons, and place them horizontally inside the Navigation frame.

Expected Result

Navigation frame shows three icons representing Home, Settings, and Profile.

4

Step 4: Insert a text label 'Total Sales' in the Sales Summary frame and add a dollar sign icon next to it using the icon plugin.

Type 'Total Sales' with the Text tool, then use the icon plugin to add a dollar icon aligned to the left of the text.

Expected Result

Sales Summary frame displays 'Total Sales' text with a dollar icon to its left.

5

Step 5: Add a chart title with a subtitle using Lorem Ipsum text in the Trends Chart frame.

Use the Text tool to add 'Monthly Sales Trends' as title, then run Lorem Ipsum plugin to insert a short subtitle paragraph below.

Expected Result

Trends Chart frame shows a clear title and a subtitle with placeholder text.

6

Step 6: Add footer text with company copyright using the Lorem Ipsum plugin or manual typing.

Type '© 2024 Company Name' manually or generate placeholder text and edit it accordingly.

Expected Result

Footer frame contains the copyright text at the bottom of the dashboard.

Final Result

-----------------------------------------
| Header: Lorem ipsum dolor sit amet... |
-----------------------------------------
| [Home] [Settings] [Profile]            |
-----------------------------------------
| $ Total Sales                         |
-----------------------------------------
| Monthly Sales Trends                  |
| Lorem ipsum dolor sit amet, consectetur... |
-----------------------------------------
| © 2024 Company Name                   |
-----------------------------------------

✓Using content generation plugins speeds up dashboard prototyping.

✓Lorem ipsum text helps visualize layout without real data.

✓Icons improve navigation clarity and visual appeal.

✓Stakeholders can focus on design and flow before data is ready.

Bonus Challenge

Use the icon plugin to add data category icons inside the Sales Summary frame for different product lines.

Show Hint

Search for icons like 'electronics', 'clothing', or 'food' and place them with labels under the Total Sales text.