Introduction to Figma

Figma has rapidly become one of the foremost tools for web design and development. Embraced by numerous web agencies both in Iceland and globally, its appeal lies not just in its capabilities for web design, but also in graphics creation, prototyping, presentation, and collaboration. This guide will introduce you to the fundamental tools within Figma and showcase what they offer.

Setting Up Figma

We start by going to Figma.com and creating our account.
Now in the upper right corner we can click on "+Design file" and create our first project.
We're here! Feel free to roam around and explore and get familiar with tools of Figma.

We can use figma in two ways in the browser like we're doing now or we can download and install a figma desktop application here are a couple of pros and cons for both.

Figma desktop:

pros:

Performance: While Figma is optimized for browsers, the desktop app can sometimes offer slightly better performance, especially with larger files.
Offline Mode: The desktop app allows you to work on files without an internet connection (though real-time collaboration requires connectivity).
Keyboard Shortcuts: Some keyboard shortcuts, especially system-level ones, work more seamlessly in the desktop app and allows us to work faster on our projects.
OS Integration: Easier integration with other apps on your computer, like using third-party plugins or dragging and dropping files.
Dedicated Workspace: Without the distractions of other browser tabs or notifications, you can focus solely on design.

cons:

Updates: Even though Figma's desktop app updates automatically, there might be slight delays compared to the browser version.

Figma browser version:

pros:

Universal Access: As long as you have an internet connection and a modern browser, you can access Figma from any computer without needing to install any software.
Always Updated: The browser version will always be the most up-to-date since updates are pushed immediately to the web platform.
No Installation Required: No need to download or install anything, which can be handy on shared or restricted computers.

cons:

Performance: While Figma is highly optimized for web, for some users, especially with extensive design files, the browser version might feel a tad slower.
Internet Dependency: You always need an internet connection to access and work on your files.
Browser Limitations: Certain functionalities or keyboard shortcuts might be restricted due to browser limitations.

In conclusion Figma for browser is for lightweight uses and Figma for desktop is for more extensive projects, but for our studies it's recommend to download the desktop version.

Now let's get started with Figma! Below you can see what every tool in figma does.

Introductory Course

Guide 1

HTML & CSS - Introduction

You have not returned the guide yet

Guide 2

HTML & CSS - Layouting

You have not returned the guide yet

Guide 3

Figma - Introduction

You have not returned the guide yet

Guide 4

Design Introduction - Design Fundamentals

You have not returned the guide yet