Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Using figma is a good thing
Search
Yona
October 29, 2024
1
620
Using figma is a good thing
Yona
October 29, 2024
Tweet
Share
More Decks by Yona
See All by Yona
Easy choice of IaC
yonasou
1
290
Illust_Terraform
yonasou
0
2.2k
re:growth 2024
yonasou
0
440
IoT_Greengrass_Begginer
yonasou
0
280
Grafana_IoT_Data_DataLake
yonasou
0
870
terraform_module_ Beginner
yonasou
10
180k
Featured
See All Featured
Agile that works and the tools we love
rasmusluckow
329
21k
The Language of Interfaces
destraynor
158
25k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.6k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
9
770
Building Flexible Design Systems
yeseniaperezcruz
328
39k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
GitHub's CSS Performance
jonrohan
1031
460k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
283
13k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3k
Unsuck your backbone
ammeep
671
58k
Transcript
エンジニアがFigmaを使ったら幸せになった話
5 所d 5 クラスメソッド株式会社 AWS事業本部コンサルティング部 ソリューションアーキテク$ 5 趣 5 ラジオ、散歩、
5 よく使うフリー素T 5 いらすと@ 5 フキダシデザイン 与那嶺 創(よなみね そう) ピザのアイコンでブログ書いてます 自己紹介
アジェンダ 6 What is Figm$ 6 業務でデザインツールを使う時場" 6 私がデザインツールに求めるこB 6
Figmaのいいとこ 6 まとめ
このスライドもFigmaで作りました!
What is Figma? draw.io Cacoo デザインツール よく比較されるデザインツール (私目線)
業務でデザインツールを使う時場面 0 AWS構成図の作2 0 ブロ& 0 資料作2 0 他人との認識合わA 0
etc...
私がデザインツールに求めること 7 脳でイメージしたことを簡単に表現できA 7 よく使う機能にショートカットが用意されてい& 7 画像を細かく調整できる(表現の幅が広い 7 人にすぐ共有できる
私がデザインツールに求めること c 脳でイメージしたことを簡単に表現できg c よく使う機能にショートカットが用意されている →矢印、文字入力、拡大縮小、複製、位置調整、et& U 細かく調整できる(表現の幅が広い) →トリミング、透過度、文字幅、et& U
人にすぐ共有できる
Figmaを使う前のデザインツールに対するイメージ デザインツールって イメージ通りに動かない! イライラする!
Public Subnet Public Subnet Private Subnet Private Subnet AZ-1a AZ-1c
EC2 EC2 Internet Gateway ELB 例えば...
Public Subnet Public Subnet Private Subnet Private Subnet AZ-1a AZ-1c
EC2 EC2 EC2 Internet Gateway ELB これを上に動かしたい
Public Subnet Public Subnet Private Subnet Private Subnet AZ-1a AZ-1c
EC2 Internet Gateway ELB 枠が上に動いた!? EC2
イメージしている通りに動かない!
Figmaを使うとこういったことが少ない (個人的な感覚値) ぜひ、帰ったら触ってみてください!
t 他にも... アイコンが大きくなったり、小さくなったりするのを表現したい 皆さんならどうしますか?
大きくなってる気がしませんか?
増減しているように見えませんか?
脳でイメージしたことを具現化ができる イメージ Figma 具現化 つまり
Figmaを便利に使うために
t 画像は極力SVG形式を使う SVGとは?:ファイル形式の1つ goodポイント:引き伸ばしても画像が潰れない、加工しやすい つぶれない
t 自分だけのアイコン集を作る よく使うアイコンを集めるだけのFigmaファイルを1つ作る
] L t ショートカットを使う よく使う機能のみショートカットを使う 最初から全部覚えようとしない!! この操作よくするな... となったらショートカットを調べる オススメ!! [
(エル) l
t 使いこなさない 色々な機能があるけど、自分に必要な機能だけを覚える 自身にとって最適な使い方ができればそれでOK!!
t Figmaを使って脳内イメージを共有しよう
t Figmaを使いこなせば 人とのコミュニケーションがうまくいき きっと幸せになれるはず!
おわり t