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
事例で学ぶ!今日から使えるWebサービスUI改善ポイント
ncdc
0
250
生成AIを活用した組み込みSW設計書検索システム開発
licux
7
1.5k
AI駆動なデザイン開発 〜Figma Make でまるっとつくるか、 HTML でシンプルにつくるか〜
t_east
1
1.3k
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
250
佐藤千晶|ポートフォリオ
chimi_chia
0
150
AIの実践とコミュニケーションデザインの意義 / AI practice and the significance of communication design
bebe
0
820
デザインの意思決定を加速するワークショップ設計 / Workshop design to accelerate design decision-making
lycorptech_jp
PRO
0
450
なぜプレイドにデザインエンジニアが必要だったのか?
t32k
0
1.8k
What makes a great Director?
_limex_
0
220
デフォルトの16:9(960*540px)のケース / Google Slide Size Test
arthur1
0
3.4k
Light My Fire/ハートに火をつけるコミュニティ
kgsi
1
150
「キャリア」のプロダクトをつくる私の「キャリア」への向き合い方 / JAM de NIGHT DESIGN SESSION Vol3
visional_engineering_and_design
1
210
Featured
See All Featured
Into the Great Unknown - MozCon
thekraken
40
2k
Building Applications with DynamoDB
mza
96
6.6k
Music & Morning Musume
bryan
46
6.8k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
252
21k
Designing Experiences People Love
moore
142
24k
Automating Front-end Workflow
addyosmani
1370
200k
What's in a price? How to price your products and services
michaelherold
246
12k
How to train your dragon (web standard)
notwaldorf
96
6.2k
Imperfection Machines: The Place of Print at Facebook
scottboms
268
13k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
1.1k
The Pragmatic Product Professional
lauravandoore
36
6.9k
jQuery: Nuts, Bolts and Bling
dougneiner
64
7.9k
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 これらの技術を活用して、 良きイラスト+デザインライフを! ご清聴ありがとうございました!