先日、XDがサポート終了するとのことでX(Twitter)で話題になっていました。
(こういうときXで即情報が入ってくるので有難い)
https://helpx.adobe.com/jp/support/xd.html
Adobe公式の上記ページによると
・Adobe XD の継続的な開発や新機能の追加に向けての投資は行われていない
・十分な予告期間を設けて XD のサポートを終了する適切なタイミングを見極める
とのことです。
まだXDを使用することはできるみたいですが、近い将来XDはなくなってしまいそう。。
そうなるとFigmaがWebデザインのメインツールになっていくことが予想されます。
Figmaはこれまで少しだけ触ったことがありますが、使い方をしっかり学習したことがなかったのでこれを機に何冊か本を買って使い方を習得することにしました。
今回私が購入して良かったと思ったFigma本を2冊ご紹介します。
これからはじめるFigma Web・UIデザイン入門
1冊目は株式会社neccoさんが出しているこれからはじめるFigma Web・UIデザイン入門。
こちらの本は特に初心者の方におすすめだと感じました。
第1章ではFigmaの各ツールの名称や機能が丁寧に解説されており、第2章では実際にサイトデザインを作りながらFigmaの操作を学ぶことができます。
制作するサイトはシンプルなデザインかつ、1ページごとの情報量は多くないため半日もあればサクッと終わらせることができます。
3章では3つの作例からデザイン制作の流れを学ぶことができるので、Webデザインを学びはじめた初学者の方も実務でのWebサイト制作の流れをイメージすることができる内容になっています。
なお、この本に出てくるデザインの作例は全てダウンロードすることが可能なので、実際のデータを触りどのような作りになっているのかも勉強することができます。
・1ページごとの情報量がそこまで多くないのでサクサク進められる
・2章で実際のサイトを作りながら操作方法を学ぶことができる
・チームでFigmaを活用するときの便利機能なども解説されている
・Webデザインをやり始めた初心者の方やFigmaの基本操作を知りたい方に特におすすめ
Figma for UIデザイン
2冊目はFigma for UIデザイン。
インスタグラムのような写真投稿アプリのUIを作りながら、Figmaの使い方を学ぶことができます。
こちらの本は解説が細かいため、1冊目にご紹介したこれからはじめるFigma Web・UIデザイン入門でFigmaの操作の概要をざっくり理解してから取り組むとスムーズに理解することができました。
ある程度Figmaの操作に慣れてきたけどもっと便利な使い方を知りたい、コーディングしやすいデザインデータの作り方を習得したい方におすすめです。
・各機能の使い方がより細かく紹介されている
・コンポーネントの管理の仕方など、誰もが管理しやすいデザインデータの作り方がわかる
・ライトモード、ダークモードどちらにも対応したデザインデータの作り方がわかる
まとめ
最初はFigmaの操作に慣れず、フレームってなんだ？？バリアントとは？？？と混乱していましたが、本のとおりに操作してデザインデータを作ってみるとかなり便利なツールだと感じました。
また、整ったデザインデータを作ればコーダーさんもかなりコーディングしやすいのではと感じます。
まだまだ私もFigma初心者ですが、もっと使いこなしたいと思います。
