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
DIST.39「Figmaを使ってベクターイラストを描く!」
Search
Miki Kuramata (nico)
June 04, 2023
Design
1
1.5k
DIST.39「Figmaを使ってベクターイラストを描く!」
2023年6月2日開催 DIST.39「みんなのFigma」LT資料です!
https://dist.connpass.com/event/281775/
Miki Kuramata (nico)
June 04, 2023
Tweet
Share
Other Decks in Design
See All in Design
教育分野に強いUIデザイナー / 山口哲弘ポートフォリオ
t2yamaguchi429
0
730
生成AIを活用した組み込みSW設計書検索システム開発
licux
7
1.5k
デザイナーのAI活用とチームへの浸透戦略
ukaoli
0
120
Tools for Design Engineers other than LLM in the LLM era
takanorip
1
470
保育AIプロダクトの UXデザインで考えてきたこと / hoiku-ai-ux-design
hiro93n
0
140
アクセシビリティに取り組むメリット
magi1125
2
250
UXデザインはなぜ定着しないのか?
designstudiopartners
0
970
【PoCで終わらない】運用フェーズまで見据えたAI駆動UIデザイン/フロントエンド開発実践
kitami
1
350
[2025.6.30 もがく中堅デザイナー、キャリアの分岐点] なんでもやる系デザイナーのもがきかた
taka_piya
1
3.4k
デザインシステムの「種」を使って、受託開発を加速させる
akane___ui
0
11k
Карта реализации историй. Технология осмысленной работы с детальными требованиями
ashapiro
0
120
AIを身近に感じるために、デザイナー全員で一つのサービスを使ってみた
_psyc0_
0
310
Featured
See All Featured
Practical Orchestrator
shlominoach
190
11k
Into the Great Unknown - MozCon
thekraken
40
2k
Automating Front-end Workflow
addyosmani
1370
200k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Designing for Performance
lara
610
69k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
530
How to train your dragon (web standard)
notwaldorf
96
6.2k
Reflections from 52 weeks, 52 projects
jeffersonlam
352
21k
Scaling GitHub
holman
463
140k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
Transcript
00 Figmaを使って ベクターイラストを 描く! 倉又美樹(まるみ) @nicoicon_design
1 倉又美樹(まるみ) @nicoicon_design Web/DTP/UIなどをやるデザイナー イラストを使ったデザインが好き イラストを描くのも好き IllustratorとFigmaを 行ったり来たりする
2 イラストを描く時だいたいIllustratorなのですが Figmaでデザインする機会が増えてきました 色調整などはFigmaで行うこと多し
3 LEVEL 1 植木鉢に花を咲かせる Figmaの「楕円」と「長方形」で描画する
4 前提:イラストは があればある程度描ける!! •▲▪の形 楕円 長方形 楕円を変形 楕円を変形
5 LEVEL 2 虹・雨・雲を描く これらすべてFigmaで描けます
6 構造はこんなかんじ
7 円グラフを描く要領で 複数の円弧を重ねると虹が描けます ポイントは「円弧」
8 LEVEL 3 グラデーションでリアルめな表現 「線形」「放射状」グラデーションは便利
9 いちごを拡大 粒部分といちご本体の グラデーションで 光を表現
10 いくらの粒を拡大 「放射状」グラデーションの集合体
11 補足 ブーリアングループを併用すると便利です 特に「選択範囲の結合」 めちゃ便利
12 これらの技術を活用して、 良きイラスト+デザインライフを! ご清聴ありがとうございました!