今回はFigmaの概要と準備編を解説します。

Figmaの概要

Figmaはプロトタイプを作成できるツールです。

他に有名なプロトタイプツールはありますがFigmaの特徴は以下です。

  • クラウド上で作業
  • 複数人で同時編集可能

クラウドで作業

Figmaは基本クラウド上で編集します。 アカウント登録されしてしまえば、ブラウザ操作できるPCがあればログインするだけで編集データが閲覧、編集可能です

複数人で同時編集可能

Figmaの最も特徴的なのが、複数人で同時編集ができます。 個人で編集する分にはメリットがありませんが、仕事でプロトタイプする際はファイル共有などは不要になります。 ※リモートワークの会議などは特に効果的です

ログイン〜デザインファイル作成

最初にログインから解説します。

ログイン

ログインするためにFigmaにアクセスします。 https://www.figma.com/

Figma TOP画面

アクセスすると上の画面が表示されるので、赤枠のSign upボタンをクリックしてください。

クリックすると、アカウント新規作成モーダルが表示されます。 Gooleアカウントで新規作成するのが簡単なのでおすすめです。

チーム作成

アカウントを作成し、ログインできたら最初にチームを作成します。

チームはPCでいうフォルダに当たります。最初にフォルダを作ってからデザインファイルを作る流れです。

以下の赤枠箇所をクリックしてください。

チーム作成画面

クリックすると、チーム名入力画面が表示されます。

任意のチーム名を入力して、Create teamボタンをクリックします。

チーム名入力画面

次にチームに追加したいユーザーを入力できます。

今回は無料枠で作成するので、画面一番下にあるSkip for nowをクリックします。

ユーザー招待をスキップ

最後にFigmaのプランを選択します。

無料プランなので赤枠のChoose Starterを選択してチーム作成は終了です。

無料プラン選択画面

デザインファイル作成

チームができたので実際に操作する場所、デザインファイルを作成します。

無料版はデザインファイルは3ファイルのみ作成できるので注意です。


デザインファイルは簡単に作成できます。

左側に作成したチーム名が表示されているので、選択すると下画像が表示されます。

赤枠をクリックするとデザインファイルが作成完了です。

デザインファイル作成画面

作成すると以下の画面が表示されるので準備完了しました。

デザインファイルのデフォルト画面

以上今回はFigmaの概要と準備編を解説しました。

次回は実際にデザインファイル内で操作する方法を解説します。

関連記事: Figmaの使い方〜準備編〜