Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Sketchハンズオン超簡単4つのキーで覚えるはじめ方
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
井上辰徳
March 27, 2017
6.6k
6
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Sketchハンズオン超簡単4つのキーで覚えるはじめ方
Sketchは4つのキーを覚えればUIが作れます。
井上辰徳
March 27, 2017
Transcript
44 slides
Sketch Challenge
4ͭͷΩʔͰ͡ΊΔ ΠϯλʔϑΣΠεͷઆ໌ 1 2 3 4 5 6 6 *Λ࡞ͬͯΈΔ
ϚεΫͱάϧʔϓ ॻ͖ग़͠ γϯϘϧͷ֓೦ 7 ͦͷଞ
ΠϯλʔϑΣΠεͷઆ໌ 1
ΞʔτϘʔυ ΦϒδΣΫτ Πϯαʔτ ϨΠϠʔ ϖʔδ ΠϯεϖΫλʔ ϨΠϠʔ ϖʔδ ΠϯεϖΫλʔ
WHERE WHERE WHAT
ʮ ԿΛ࡞Δ͔ ʯ جຊతʹΠϯαʔτʹೖ͍ͬͯΔ
σβΠφʔ ΠϯαʔτΛ։͖·ͤΜ
4ͭͷΩʔͰ͡ΊΔ 2
͜ͷ 4 ͭ ͷγϣʔτΧοτΩʔͰ 6 * ࡞ΕΔ
σόΠεͷը໘Λ࡞Δͱࢥ͍ͬͯͩ͘͞ A r t b o a r d
ӈͷΠϯεϖΫλʔ͕มΘΓ·͢ υϥοάͰϦαΠζ
3FUJOBͷొͰQJYFMͱσόΠεαΠζͷ͕ࠩ J04ϙΠϯτΛݟΔ J1IPOFॳظ ʷ ʷ
ʷ ʷ ʷ 3FUJOB σόΠε ʷ ʷ ʷ ʷ ʷ J1IPOF1MVT Ҏ߱ 3FUJOBొ J1IPOF J1IPOF( J1IPOF(4 J1IPOF J1IPOF4 J1IPOF J1IPOF4& J1IPOF J1IPOFT J1IPOF J1IPOF1MVT J1IPOFT1MVT J1IPOF1MVT ϙΠϯτ
࢛֯ܗͷΦϒδΣΫ τΛ࡞Δ R e c t a n g l
e
ӈͷΠϯεϖΫλʔʹใ͕ೖΓ·͢
ԁܗͷΦϒδΣΫ τΛ࡞Δ O v a l
ςΩετΛೖྗ͢Δ T e x t
ςΩετ༻ͷΠϯεϖΫλʔʹมΘΓ·͢
ΦϒδΣΫ τҐஔ ΦϒδΣΫ ταΠζ ΦϒδΣΫ τͷಁ໌ ໘ͷ৭ ઢͷ৭ γϟυ ଆγϟυ
ϒϥʔޮՌ ͖ స ςΩετ༻ͷΠϯεϖΫλʔʹมΘΓ·͢ ςΩετϘοΫε ϑΥϯτ ৭ɾαΠζ ἧ͑ํ ϘοΫεͷϑ Ο ο τPS ݻఆ จࣈؒͱߦؒͷௐ
ϘλϯΛ࡞ͬͯΈ·͠ΐ͏ ʂ 335ʷ60ͷ࢛͍֯Ϙλϯ4QYͷؙ֯ ৭#4a8a46 Өx:0ɺy:2ɺBlur:0ɺSpread:0 Өͷ৭#3b7635ɺ ෆಁ໌ ʮΞϓϦΛμϯϩʔυʯ ͷϥϕϧ͕ηϯλʔʹೖ͍ͬͯΔ ϥϕϧͷαΠζ16QYɺ
৭#FFFFFF ϑΥϯτώϥΪϊ֯ΰ86 Ϙλϯͷஔॴ্͔Β200px
͜ΜͳϘλϯʹͳΓ·͢
6 * Λ࡞ͬͯΈΔ 3
ຊͷڭࡐ TLFUDI@DIBMMFOHFTLFUDI
ΩʔΛҙࣝͯ͠࡞Γ·͠ΐ͏ʂ ϚʔδϯΛҙࣝͯ͠ ϨΠΞτ͢Δͷ͜ͱ͕ϙΠϯτ ʂ ΦϒδΣΫτΛબͯ͠BMU Λԡ͢ͱϚʔδϯ͕දࣔ͞Ε·͢ alt
ϚεΫͱάϧʔϓ 4
ϨΠϠʔΛཧ͠·͠ΐ͏ ʂ 㵰 G
֊ ֊
ϚεΫΛͬͯΈ·͠ΐ͏ ʂ 㵰 M DPOUSPM
ࣸਅΛૠೖͯ͠ϚεΫΛ͔͚Δ 'JOEFS͔Βυϥοάͯ͠ૠೖ ͭͷϨΠϠʔΛબ͠ ͯ ͍ͭͰʹάϧʔϓʹ͢Δ 㵰 M DPOUSPM
ॻ͖ग़͠ 5
ॻ͖ग़͠ͷഒ ϑΥʔϚο τબ ΞʔτϘʔυͱύʔπʹॻ͖ग़͠ͷઃఆΛ͢Δ ॻ͖ग़͠
υϥοά ԿͳΒυϥοάͰ͍͚Δ υϥοά
·ͱΊͯॻ͖ग़͢ 㵰 E TIJGU
νΣοΫΛೖΕΔͱ·ͱΊͯॻ͖ग़ͤΔ
෦తʹॻ͖ग़͢ S l i c e S
γϯϘϧͷ֓೦ 6
γϯϘϧΛ࡞Δ ϨΠϠʔΛબ͠ ͯ $SFBUF4ZNCPMΛԡ͢ γϯϘϧϨΠϠʔ͕Ͱ͖Δ γϯϘϧʹͨ͠ύʔπ͕ཷ·Δ
γϯϘϧΛ࡞ΔͱͲ͏ͳΔʁ ύʔπΛ࠶ར༻͠ ͯɺ มߋҰׅͰߦ͑·͢ Ϙλϯ Ϙλϯ Ϙλϯ Ϙλϯ
ΠϯεϖΫλʔ͔Βݸผʹมߋ ৭ɺࣸਅͷใݸผʹ࣋ͭ͜ͱ͕Ͱ͖·͢ ϩάΠϯ ߪೖ Ϙλϯ " " " " "
# $ % " # $ %
ཧͷγϯϘϧͷΈํ NAME NAME NAME 定義 色、アイコン、フォント シンボル スタイル シンボルを含む シンボル
パーツ モジュール
ͦͷଞ 7
Φʔτηʔϒʹҙ ͍࣌ؒͬͯΔͱΩϟογϡ͕ཷ·ͬͯ1$ͷ༰ྔΛѹഭ͠·͢
Ϙλϯ " Ϙλϯ " Ϙλϯ # Ϙλϯ " ଞͷϑΝΠϧ͔ΒγϯϘϧͬͯ͘Δͱ૿͑ͯհ Ϙλϯ
" γϯϙϧ ݩ͔Β͋Δ ૿͑Δ
γϯϘϧͷωʔϛϯάنଇॏཁ button Primary େΧςΰϦʔ தΧςΰϦʔ
ٙɾ࣭ίʔφʔ
More Decks by 井上辰徳
See All by 井上辰徳
そのスキル本当に必要?デザイナーが伸び悩まないためにはじめたこと
inoue_tatsunori
36
21k
デザイナーが30年成長し続けるために知っておくべき罠
inoue_tatsunori
62
68k
キャリアリフレクションのすすめ
inoue_tatsunori
10
2.3k
デザイン・マネジメント -経営のためのデザイン-
inoue_tatsunori
7
1.2k
クリエイターのマネジメントとは何か?組織と個人を強くする仕組みづくり
inoue_tatsunori
16
14k
デザイナーが伸び悩まないためのスキル27分類
inoue_tatsunori
31
130k
リードデザイナーってどんな人か考えてみた
inoue_tatsunori
12
12k
Featured
See All Featured
Jess Joyce - The Pitfalls of Following Frameworks
techseoconnect
PRO
1
470
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
inesmontani
PRO
3
3.8k
Technical Leadership for Architectural Decision Making
baasie
4
640
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
230
23k
The innovator’s Mindset - Leading Through an Era of Exponential Change - McGill University 2025
jdejongh
PRO
1
400
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
davidcarrasco
3
300
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
helenjbeal
2
440
How to Get Subject Matter Experts Bought In and Actively Contributing to SEO & PR Initiatives.
livdayseo
1
240
Site-Speed That Sticks
csswizardry
13
1.6k
sira's awesome portfolio website redesign presentation
elsirapls
0
500
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
37
6.7k
Utilizing Notion as your number one productivity tool
mfonobong
4
640