こんにちは。BASE株式会社の渡邊です。ネットショップ作成サービス「BASE」のUIUXデザインを担当しています。
ネットショップ作成サービス「BASE」は、専門知識がなくてもデザイン性の高いネットショップを誰でもかんたんに無料で開設できるサービスで、個人でもかんたん・スピーディに決済機能を導入できる仕組みを提供しているのが特徴です。
そんなBASEは、ご利用のショップオーナー様の利便性や売上向上などを目的に、常に新しい機能の提供や既存機能のアップデートを実施。プロダクトの規模は年々大きくなっています。そんなBASEという大規模プロダクトのUIUXを支えてくれているデザインツールが「Figma」です。
BASEは2021年にFigmaを導入し、今では会社全体で欠かせないデザインコミュニケーションツールになっています。そしてFigmaのその機能性に惚れ込み、弊社にFigmaをぜひ導入しましょう!と持ちかけたのが私です。導入後は社内のFigmaワークショップを担当し、日々便利機能の布教に勤しんでいます。
今回はそんなFigma大好きUIUXデザイナーの私が、Figmaが気になっている方に向けて「そもそもFigmaとは何なのか、ほかツールとどのように違うのか」「Figmaを使うとどのようなメリットがあるのか」についてお伝えしたいと思います。この記事が日々のデザイン業務の助けになれば幸いです。
Figma乗り換え時に苦戦するデザイナーが続出!?
公式サイトに「デザインの追求からプロトタイプ作成、制作物のコーディングまで、Figmaはチームがコラボレーションして製品開発するためのプラットフォームです」とあるように、Figmaは単なるデザインツールではなく、多業種と積極的にコミュニケーションが取れる機能をもった「コラボレーションインターフェースデザインツール」です。デザインはひとりで成り立つものではないという思想のもと、オープンな場でデザインを共同編集することが前提の設計になっています。
Figmaはここ数年で利用者数が大幅に増加し続けており、とくにAdobe XDがメンテナンスモードに入ったことで、Figmaへ乗り換える動きも活発になっているように思います。しかし、別ツールをすでに使っているUIUXデザイナーがいざFigmaを触ってみると、「難しい」「HugやFillなど初めて見る概念が多い」「根本的になにか違う」と苦戦している様子も見受けられます。
読者のみなさんの中には「会社の利用ツールが変わり、これからFigmaを使うことになった」という方もいると思いますが大丈夫です。Figmaは怖くないです。使いこなせばとても便利で画期的なツールです。
そこで今回は、すでにUIデザインを経験している方に向け、ほかのツールからFigmaに乗り換えるときにつまづきがちなポイントや心構えを解説します。
Figma乗り換え時のポイント:Figmaは「チームでつくる」ことが前提
FigmaやAdobeXDをはじめとしたUIデザインツールは、「大きなホワイトボードに描いたデザインを見て、チームでディスカッションするオフィス」のようなものです。
UIデザインを生業としている人のなかには実感している人も多いと思いますが、UIUXデザインは個人で完結できるものではありません。ビジネス視点をふまえ企画やスケジュールを管理するPMがいて、UIを実装するエンジニアがいます。その中央に立つデザイナーは、両者の立場や希望を理解しながら、落としどころを見つけてデザインを組みあげていく必要があります。
そのためチームがいつでもデザインにアクセスでき、リアルタイムにやりとりできることが前提の設計になっています。
それに対しAdobe Photoshopをはじめとしたデザインツールは「豊富な画材やこだわりの機材に囲まれた自分だけのアトリエ」のようなものだと思います。細かくハイクオリティなグラフィックの制作にはこちらが適しているため、制作物によって使いわけると良いでしょう。