#Figma

デザインプラットフォーム「Figma」を提供するFigma, Inc.の日本法人であるFigma Japan株式会社は、日本へのローカライズから1年で、日米イノベーションアワード「2023 SunBridge エマージング・リーダー賞」を受賞したと発表しました。この賞は、日米両国で大きな飛躍を遂げ、変革をもたらしている成長著しい企業を表彰するものです。Figmaは2022年7月に日本語版をリリース。これはFigma製品（Figma designとFigJam）において初の英語以外のローカライズと

Figmaでフレームやレイヤーをエクスポートする際に「2x」「3x」など、フレームのサイズの倍数でサイズを指定できることはよく知られていると思います。しかし、出力する画像のサイズをピクセル単位で指定することができることは意外と知られていないかもしれません。出力サイズをピクセル単位で指定する方法は以下のとおりです。Figmaを開き、エクスポートしたいフレームやレイヤーを選択します。右側の「デザイン」パネルの下部から「エクスポート」をクリックします。「+」アイコンをクリックして、新しいエクスポート設

Figma Japanは、デザインプラットフォーム「Figma」のコミュニティである「Friends of Figma（FOF）」が、これまでの東京から全国23地域・団体に拡大し、地域リーダーを任命して活動を加速すると発表しました。また、「Figma」のコミュニティ活動について、ファイルと全プロセスがウェブ上で行われることにより、チーム間でのデザインアセットの共有や連携が効率化され、ブレインストーミングからプロトタイプ制作、デバッグまでを網羅することができます。これにより、「Figma」ユーザー

21日、Figmaの年次ユーザーカンファレンス、Config 2023でデザインと開発をさらに近づけるための新機能や改善が発表されました。開発モード、バリアブル、高度なプロトタイプ作成など、デザイン、プロトタイピング、ビルドの各段階でチームに役立つ新機能を紹介します。開発モードバリアブル高度なプロトタイプオートレイアウトの改善フォント選択機能の改善ファイルブラウザの改善開発モードは、サイズや仕様、スタイル、アセットの検査ができるインスペクトや、CSS、iOS、Androidのコードをコピーできる

Appleが、iOSとiPadOSのアプリデザインを効率よく作成するためのFigma向け初の公式デザインキットを公開しました。このデザインキットには、豊富なコンポーネントやビュー、インターフェース、テキストスタイル、カラースタイル、マテリアルやレイアウトガイドが含まれています。現在は、iOSとiPadOS用のコンポーネントのみ公開されていますが、今後段階的にmacOS Sonoma、 watchOS 10、tvOSやvisionOSといったAppleのその他のOSや、Apple Pay、App

Figmaでフレームやレイヤーを追加していくと「Rectangle 1」「Rectangle 2」のようにデフォルトの名前がつきますよね。それぞれのレイヤーに名前を付けて管理したい場合は「名前を変更」機能を使って名前を変えていくことが多いと思います。場合によっては、複数のレイヤーに同じ名前を付けて管理したい場合もあるのではないでしょうか？今回は、そんな時に役立つFigma Tipを紹介します。名前を変更したい複数のレイヤーを選択「コマンド ⌘ + R」で名前変更モーダルを開く「変更後の名前」に新

Figma Japan株式会社は、事業拡大と人員増加を受け、2023年4月に日本オフィスを移転したと発表しました。新オフィスは東京都千代田区丸の内に所在し、アクセスや働きやすさに優れた環境を提供。Figma Japanは、米国サンフランシスコ発のデザインプラットフォーム「Figma」の日本法人で、2022年1月にアジア初の拠点として日本支社を開設しました。その後、2022年7月には英語以外の初めての言語としてFigma日本語版が発表され、日本のマーケットで急速に存在感を増しています。すでに楽天や

Figmaでデザインに画像を追加した後に、元画像の解像度を確認したり、画像を別ソフトで再編集したくなることはありませんか？実はFigmaには、Figmaのサーバーにアップロードされた元画像を開いてくれる機能があるのです。使い方は、画像のレイヤーを選択「インスペクト」タブを開く「インスペクト」タブの下の方にある画像の「ファイル名」リンクを選択これによってブラウザで元画像を開くことができ、画像のサイズ確認やダウンロードをすることができます。「インスペクト」内の機能であることから、エンジニアがオリジナ

Figmaに限らず、PC作業でコピー&ペーストを使うとき、「Command ⌘ + C」と「Command ⌘ + V」を使うのはもはや当たり前になっていますよね！毎日のように使うこのコピー&ペーストのショートカットですが、Figma上でコピーしたレイヤーやグループを「Command ⌘ + V」で貼り付けると、フレームの外にペーストされてしまったり、予想外の場所にペーストされてしまう現象に悩まされるデザイナーも多いのではないでしょうか？実は、Figmaには「ここに貼り付け」という機能があり、シ

ECサイトの商品一覧や動画視聴サービスの動画一覧画面など、Figmaに複数の画像を追加したいような場合、どのように追加していますか？一つずつレイヤーを選択して「塗り > 画像」を選択したり、一度すべての画像をFigmaに追加してから配置を調整するといった方法を使う人も多いのではないでしょうか？今回紹介するショートカットは、そんな時に便利な「複数画像を埋め込み先のレイヤーを選択しながらFigmaに追加」できる『Command ⌘ + Shift + K』です！このように、Figmaの画面上で『Co

14日、Figmaは『FigJam』にテーブル機能が追加されたことを発表しました。今回のアップデートでは、画面下のツール一覧の右端に「テーブル」アイコンが追加されており、こちらを使ってFigJam上にテーブルを追加することができます。もちろん、セルの色を変えることもでき、濃い背景色を選択すると文字色を自動で白に変更してくれます。このような細かいUXに配慮されているのが嬉しいですね。出典: 🍱 Structure your ideas with tables in FigJam

Figmaで作ったデザイン、またはその一部だけをちょっと画像として他のところに貼り付けたい時ってありませんか？画面デザインをMiroやパワーポイントに貼り付けるときなど、いちいちエクスポート機能を使って書き出すと時間がかかります...そんな時には、画像としてコピーしたいレイヤーやグループ、フレームを選択した状態で『Command ⌘ + Shift + C』のショートカットを使うと、選択した部分をpng画像としてクリップボードにコピーすることができます！一つのレイヤーやグループだけではなく、複数

7日、Figmaは『Figma Community』にてクリエイターがファイルやウィジェット、プラグインの販売をすることできる機能をリリースしたことを発表しました。このアップデートによって、クリエイターは外部Webサイトや支払いサービスを必要とせず、Figma Community内で自身の作ったリソースから収益をあげることができるようになります。また、買い切りでの販売のみならず、プラグインの販売ではサブスクリプション課金も可能となっており、リソースの種類に合わせた最適なマネタイズ方法を選択するこ

Figmaのプロトタイプモードで動画ファイルを使ったインタラクションが追加出来るようになりました。動画視聴サービスや、プロダクト紹介ページなど、動画を使った様々なデザインの検証に役立ちそうですね。今回のアップデートは主に5点、ボタン操作による「動画再生」や「ミュート」などのアクション呼び出し動画の特定の再生位置をトリガーとしたアクション呼び出しデザインモードでの動画プレビュー100MBまでのmp4, mov, webmファイルへの対応複数動画の一括挿入特に最初の2点であるインタラクション関連のア

Figma Japanは3月14日に、Figmaの日本進出1周年を記念して「デザイン経営」をテーマとしたカンファレンス「デザイン経営2023ー“Great DX is not done without Great Design” デザインなくしてDXは成り立たないー」を開催することを発表しました。基調対談では、Meta社のメタバースデザインディレクターであり、Instagramのロゴデザインのリブランディングなどを手掛けたことで知られるイアン・スパルター氏と、Figma本社デザイン担当VPのノア

9日、FigmaはFigJamのブランドデザインを刷新したことを発表しました。合わせて、オリジナルの手書きフォント『Figma Hand』を開発したことも明らかにされています。FigJamの新たなブランドデザインでは、FigJam上の「アイデアの形」と「プロセス」をどのように視覚的表現に落とし込むかを主軸に進められ、コラボレーションツール上でのそれぞれの発想や、リアルタイム性を表現したものとなっています。中でも注目を集めているのが、FigJamの中でも使用することができるようになった新たな手書き

今週のFigmaアップデートまとめです。2月7日: プロフェッショナルプランの新規契約時に日本円での支払い選択が可能に2月8日: FigJamでシンプル、フォーマル、テクニカル、キュートの4種類のフォント選択が可能に2月9日: エンタープライズプランでユーザーによる組織外ファイルへのアクセスを制限できるように2月9日: エンタープライズプランでユーザーによる組織外ファイルへのアクセスを制限できるように2月9日: FigJamがブランドデザインを刷新し、新たな手書きフォントも開発今までのFigma

26日、Figmaのコメント機能に関する2つのアップデートがありました。小さいアップデートながらも、コメント機能のユーザー体験を向上してくれるものとなりそうです。ユーザー自身のアクティビティと関連性の低いスレッドの通知がまとめて届くようになりました。これによって、届く通知の数が減り作業に集中しやすくなりますね！太字やイタリックなどの文字装飾がコメント内で使えるようになりました。コメント内で細かいやり取りが行いやすくなりそうです。現在、Figmaのコメント機能内での改行は「Shift + Ente

Figmaは23日、プロダクト分析ツールのMixpanelのFigJamボード内への埋め込みに対応したことを発表しました。Figmaはこの機能の利用法として、週次でプロダクトのOKRに関連するMixpanelのデータをFigJam上に表示し、気づきや次のアクションアイテムをポストイットで書き出すといったデータの定点観測ミーティングでの利用を提案しています。詳しくは、Weekly Product Check Inテンプレートを参考にしてみてください。デザイナーだけではなく、プロダクトチーム全員が使