ものづくりのブログ

うちのネコを題材にしたものづくりができたらいいなと思っていろいろ奮闘してます。

Figma を使ってみました

Figma を使ってみたので、その際に調べたことをここにメモします。

Figama について

Figma は、UIデザインやワイヤーフレームをブラウザ上で共同編集できるデザインプラットフォームです。
米国サンフランシスコ発の Figma, Inc.により「全ての人がデザインを利用できるようにする」というビジョンに基づいて開発されています。
www.figma.com

特徴

  • クラウドにデザインシステムがあることで編集内容を共有することが可能
  • リアルタイムで複数人による共同作業が可能

できること

  • ワイヤーフレームの作成
  • プロトタイプの作成
  • ホームページやWeb広告用のグラフィックデザインの作成
  • SNSの投稿の作成
  • プレゼン資料の作成

メリット

  • ブラウザから利用
  • 複数人で同時編集可能
  • 無料プラン有り
  • デザイン制作に必要な機能は一通りあり

デメリット

  • ヒストリー機能はなし
  • 出力形式が少ない

料金

以下のプランがあります。

  • Starter
  • Figma Professional
  • Figma Organization

Starter プランは個人向けの無料プランです。

使い方

サイト

Figmaの公式ホームページにアクセスします。
Figma

アカウント作成

今回は Google アカウントでログインします。

Figmaは基本的にブラウザ上で利用するため、アプリケーションをダウンロードする必要がありません。データはクラウドに自動保存される仕組みになっています。

ログイン後に個人情報を入力します。
名前を入力します。

職業を選択します。

仕事の説明を選択します。

誰とコラボするかを選択します。

招待者情報を入力します。

以下のような画面が表示されればログイン成功です。

画面構成

中央がデザイン画面です。

画面左上にあるツールバーで、様々なツールを選択して操作していくことができます。メインメニュー、ムーブ(選択)ツール、フレームツール、図形ツール、ペンツール、テキストツール、リソースツール、手のひらツール、コメントツールがあります。