WEBデザインで活躍中!! Figmaの紹介【その1】紹介・インストール編

WEB

はじめに

はじめまして、WEBデザイナーのumeです。
これから、技術系の記事を中心に書いていきたいと思います。

皆さんは「Figma」をご存知ですか?
読み方わからない?私は、フィグマと呼んでいますが、合っているのか不明です。

一言でいうとデザインツールです。簡単!
弊社で導入してから、早半年が過ぎました。
皆さんはPhotoshopやIllustrator、Fireworks(古い)などを使用してデザインをしているのではないでしょうか?
Adobe XDやSketchなどの新しいデザインツールです。
なぜXDやSketchを使わないの?という疑問があるでしょうが、XDは使いづらかったし、SketchはMacOS環境なので使用できません。(筆者はWindows環境)
「Figma」はMac・Windowsどちらでも利用できます。

「Figma」をググるとフィギア系のサイトが出てきますが、「Figma web」「Figma design」と検索すると出てきます。

https://www.figma.com/

何がいいの?

良い点

  • 何と言っても動作が軽量。
  • 一通りのデザイン機能が揃っている。
  • 基本無料
  • コンポーネント機能(パーツ化)が秀逸
  • ガイド機能が使いやすい
  • デザインンの段階である程度のレスポンシブの動き見れる
  • プロトタイプの作成が出来る
  • 共同作業が出来る。(あまり使わないが、力を発揮する場面があるかも)

悪い点

  • 英語版しかない。(なれれば問題なし、日本語フォントも使用可能)
  • 画像調整機能が乏しい。(まあPhotoshopで代用可能)
  • 縦書きに対応してない。(工夫次第で1~2行なら何とかなる。)
  • このサービスが終わってしまったら、デザインデータはどうなるのか?(基本保存データはクラウド上に保存されます。ダウンロードも可能だが、Figmaでしか開けない。)

 

上げればきりがありませんが、大体こんなところでしょうか。

何と言っても、サクサク動くので作業効率が上がり、ストレスなくデザイン作業に掛かれます。
たまに、過去のデザイン修正などでPhotoshopやFireworksで作業をしますが、こんなに遅かったのか!!と思うくらい、もう戻れません。

インストールしてみよう

何と言っても、無料なので、試してみない手はありません。

https://www.figma.com/

上記のリンクから「Figma」のサイトへ移動します。

  • 右上の「Sign Up」をクリックします。
  • googleアカウントをお持ちの方は、googleアカウントでサインインできます。持ってない方は、メールアドレスと、使用したいパスワードを入力します。

これだけです。
インストールと言っても、ブラウザベースのツールなので、ブラウザさえあればどんな環境でもサインインし、作業することが出来ます。
サインインに成功すれば、下記の画面が表示されます。

それでは早速使ってみましょう。
と、行きたいところですが、今回はここまで、次回は基本の使い方編をお送りしたいと思います。

これからもよろしくお願いします。

最新情報をチェックしよう!
>私たちと一緒に働きませんか?

私たちと一緒に働きませんか?

私たちは中央区にある、Web制作会社です。
私たちと一緒に働いてくれる、WEBディレクター、HTMLコーダー、WEBデザイナーを募集致します。また、このサイトを一緒に盛り上げてくれる、ライターや、YouTuberなども募集致します!
興味のある方は下記のお問合せより、ご連絡ください!

CTR IMG