Awesome Open Source
Awesome Open Source

Figma to Google Slides

Demo
Convert Figma frames into a Google Slides presentation, as showcased here 📽️

The order of the slides is determined by the frame hierarchy in Figma, from top to bottom in the Chrome Extension, but reversed in the Minified Version.

Made by Alyssa X

Installation (for the Minified Version)

  1. Import the Google API PHP Library! ✨ If you import it without composer, make sure that the path on the first line matches where the library is hosted in your server. Otherwise, you can replace that line from the code.
  2. Create a service API key in the Google API Console. You can follow the same steps described in the second section of my guide on using the Google Sheets API 📖 . Import it to your server and replace the path in the code.
  3. Go to your Google Slides presentation, click on "Share" and enter the previously generated email address (your service API email address) into the "People" field with edit permissions 🔑
  4. Replace the Google Slides presentation ID and Figma file ID from the code 🔗
  5. Find your personal Figma access token by going to the API documentation 🤖, scrolling down to the "Access Tokens" section, and clicking on "Get personal access token" on the right. Replace it in the code.
  6. Run the script & enjoy! Every time you run the script you will update the slides with the different frames from Figma 🍭

Installation (for the Chrome Extension)

  1. Create a Chrome extension with the files in the Chrome Extension folder (you can follow this guide) 📖
  2. Generate a OAuth 2.0 client ID in the Google API Console. Select "Chrome App", and insert your App ID (which is generated when you create the extension).
  3. In the manifest.json, replace "google_client_id" with your previously generated OAuth 2.0 client ID.
  4. Generate an API key, leave it as unrestricted, and replace "google_api_key" in the background.js with the generated API key 🔑
  5. Install the extension in your browser and enjoy!

Feel free to reach out to me through email at [email protected] or on Twitter if you have any questions or feedback! Hope you find this useful 💜


Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
Javascript (1,538,296) 
Php (402,597) 
Api (21,661) 
Google (3,224) 
Google Api (643) 
Figma (508) 
Related Projects
Advertising 📦 9
All Projects
Application Programming Interfaces 📦 120
Applications 📦 181
Artificial Intelligence 📦 72
Blockchain 📦 70
Build Tools 📦 111
Cloud Computing 📦 79
Code Quality 📦 28
Collaboration 📦 30
Command Line Interface 📦 48
Community 📦 81
Companies 📦 60
Compilers 📦 60
Computer Science 📦 74
Configuration Management 📦 39
Content Management 📦 167
Control Flow 📦 197
Data Formats 📦 77
Data Processing 📦 266
Data Storage 📦 132
Economics 📦 60
Frameworks 📦 198
Games 📦 122
Graphics 📦 103
Hardware 📦 148
Integrated Development Environments 📦 47
Learning Resources 📦 147
Legal 📦 28
Libraries 📦 119
Lists Of Projects 📦 21
Machine Learning 📦 336
Mapping 📦 61
Marketing 📦 15
Mathematics 📦 55
Media 📦 228
Messaging 📦 97
Networking 📦 304
Operating Systems 📦 84
Operations 📦 120
Package Managers 📦 52
Programming Languages 📦 229
Runtime Environments 📦 96
Science 📦 42
Security 📦 375
Social Media 📦 26
Software Architecture 📦 70
Software Development 📦 68
Software Performance 📦 57
Software Quality 📦 127
Text Editors 📦 45
Text Processing 📦 131
User Interface 📦 310
User Interface Components 📦 465
Version Control 📦 29
Virtualization 📦 68
Web Browsers 📦 38
Web Servers 📦 25
Web User Interface 📦 194