エンジニアのための Figma 知識

本記事の多くは Inspect モードを前提に解説しています。 下記に Dev Mode に対応した解説を書いてみたのであわせてご参照ください。 https://codezine.jp/article/detail/18000 エンジニアにデザインツールの知識・習熟は必要か？ しなくても仕事はできると思うのですが、あるとよりクオリティの高い仕事ができることは間違いありません。 という訳でエンジニアがエンジニアとしての仕事をしていく上で「Figma のこういうことを知っておくと良さそう」という知識をまとめてみました。 ユースケースを考える まず始めにデザインは作らないはずのエンジニアが Figma を使う時にどんなユースケースがありそうかを考えてみます。 デザインを元に実装する時 デザインから何かを生成したい時(コードとか画像とか) 自分でちょこっとデザイン修正しちゃう この辺りがあるかな〜

[catan_coton]

maxファクトリーのアクションフィギュアの事じゃねーのかよ。これに限らないけど既に市民権を得ているモノの名前に被せるの何なの？検索する時ウザったいからやめてくれ。YouTuberとかは特に。

[hope_ring]

Figmaの名称が紛らわしいけど、これは海外のツールなので仕方がない。例のフィギュアと名前が被る認識はなかったものと思われる

[sirobu]

Figma作ったの日本じゃないし、.comドメイン取っておけば名前被り防げたかもしれないけど……

[mayumayu_nimolove]

Figmaが流行る前はXD。その前はSkitchがあったけど、その時にエンジニアのためのってあったっけ？目的より手段が先行してるイメージ。

[yoiIT]

個人的にはXDに頑張って欲しいが…

[norip44]

エンジニアの作業の「デザインをもとに数値を取得する方法」や、画像書き出しについて、基本から小ネタまでまとまっていてたいへんよいものです！

[tarotheripper]

"maxファクトリーのアクションフィギュア" これがなんなのか自分は全くわからないんだけど、ブコメの圧が強くて笑う。

[yuki_2021]

んー、どっちかというとXD使うことが多いけど、Figmaが覇権とりつつあるのか。

[remonoil]

Figmaで作ってきたものをエンジニアがあれこれやるためのtips、ではなかった

[lavandin]

ゼップリンなの？ツェッペリンなの？？って確定する前にFigmaに移行しちゃって結局わからないまま時は過ぎ

[komekome09]

“Figma ”

[kuracom]

ずっとSketch使ってるけど、Figmaも使えるようになっておきたい

[OrientHistory]

名前かぶりの件だけど、純粋に軍艦や競馬馬を検索したくて困ってる人もいそうだよね。なんか良い区別方法はないもんかな。

[sorosoronemui]

最近、依頼でFigmaのデータあったな

[queeuq]

よくまとめてくれてありがたい。デザイナーさんはfigmaにかなり移行したイメージあるなー。

[fut573]

趣味で使っているけど便利

[moxtaka]

マックスファクトリーのFigmaと被ったのは偶然だろうけど、似たような事例は腐るほどあるから物申したくなる気持ちはわかる。

[yutairabbit]

Figmaを仕事で導入し始めた時、なんか聞いたことある名前だなと思ってたけどmaxファクトリーのアクションフィギュアか！！

[nunulk]

ありがたい…"たくさんクリックして辛い思い"をしてた

[sugachannel]

figmaかと思った。紛らわしいな。

[baccho07]

どっちも使わざる得ない状況なんだけど、figma脳のままXDやると脳がバグる時がある…。逆も然り…

[acaca]

なんかキレてる人いて草

[nzxx]

名前被ったぐらいで怒んなよw

[otihateten3510]

覚えたいけど元気が出ない

[roppara]

そろそろ触らないとなー。 全く関係ないけどグッスマのあれを連想してしまう…

[gamecome]

Googleは複数の文脈を持つ用語を感知して、タブ表示してくれと思ってる　ネロ＞FGO? 歴史? みたいに二つのタブになるとか

[surume000]

自分の直接の業務以外の周辺の知識もある程度知っておくと、業務改善にもつながるから大事

[yasu-osu]

フロントエンド開発との相性で言うとXDよりFigmaなんだろうか。また一度聞いてみたいです。

[yarumato]

“まず大事なのがInspectPaneです。Cmdを押しながら該当のレイヤーをクリックすれば大丈夫。疑問を解決するためにはConstraintを見ます。”

[kane-please]

Figma デザイン

[suthio]

知りたいことがめちゃくちゃ書かれていた… これは保存版すぎる