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
ワイヤーフレームから フィニッシュワークまで Adobe XDの使い所
Search
Risa Yuguchi
October 21, 2016
Design
0
800
ワイヤーフレームから フィニッシュワークまで Adobe XDの使い所
Adobe XD Meeting #02 の発表資料です
Risa Yuguchi
October 21, 2016
Tweet
Share
More Decks by Risa Yuguchi
See All by Risa Yuguchi
ワイヤーフレームを高速にXDらしく作る
rstudiorisa
2
1.8k
デザイン向き?プロトタイプ向き?2ヶ月使って感じたAdobe XDの使いドコロと実戦投入
rstudiorisa
0
1.6k
Other Decks in Design
See All in Design
プロダクトデザイナーに学ぶ、『見る気が起きる』ダッシュボードの作り方 / Creating Engaging Dashboards: Lessons from Product Designers
yamamotoyuta
2
710
社員の意識を高めたブランド浸透施策の裏側!
mixi_design
PRO
0
110
設計と制作 意図を形に表す / Design and Making: Intent Made Form
usagimaru
3
1.3k
セブンデックス プロジェクト事例 / innovation Scenes
sevendex
1
400
Storyboard Assignment: Storyboard from Comic Strip
lynteo
3
240
「余白」と「欲望」を味方につける ——AI時代のデザインエンジニアリングと「越境」の作法 #KNOTS2026
koyaman
1
1.7k
デザインコンテキストのバトンをつなぐ—AI時代のプロダクトマネジメント
kumanoayumi
6
1k
「自分の仕事はどこまで?」と問い続けたら。デザイナーの「視座」を考える
mukai_takeru
0
330
Figma MCPを活用するためのデザインハンドブック
vivion
7
14k
2026の目標「もっと定量的に事業、会社へ貢献する!」
yuri_ohashi
0
770
Build for the Web, Build on the Web, Build With the Web
csswizardry
0
310
kintone_aroma
kintone
0
1.8k
Featured
See All Featured
Large-scale JavaScript Application Architecture
addyosmani
515
110k
Lessons Learnt from Crawling 1000+ Websites
charlesmeaden
PRO
1
1.2k
Building Adaptive Systems
keathley
44
3k
The browser strikes back
jonoalderson
0
850
Optimising Largest Contentful Paint
csswizardry
37
3.6k
Designing for Performance
lara
611
70k
Fashionably flexible responsive web design (full day workshop)
malarkey
408
66k
Believing is Seeing
oripsolob
1
99
ラッコキーワード サービス紹介資料
rakko
1
2.8M
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.7k
The Curious Case for Waylosing
cassininazir
0
280
Tips & Tricks on How to Get Your First Job In Tech
honzajavorek
0
470
Transcript
"EPCF9%.FFUJOH ωο τύΠϩςΟϯάגࣜձࣾ 6*σβΠφʔ ౬ޱΓ͞ ϫΠϠʔϑϨʔϜ͔Β ϑ Οχογϡ ϫʔΫ·Ͱ "EPCF9%ͷ͍ॴ
ϑϩϯτΤϯυΤϯδχΞ +4"4 ˠ6*σβΠφʔ 8IP ݱࡏͷϓϩδΣΫτ ɿ খചۀ͚ͷάϧʔϓΤΞ6*σβΠϯ ΄΅ຖ݄"EPCF9%ษڧձ Ծ ͷਓ
5XJUUFS ɿ !SJTBZ ͍͍ͩͨ"EPCF9%ͷ
9%ΛීஈͲ͏ͬ ͯΔ ʁ ##͚ͷ6*σβΠϯ εϥΠυ࡞ ϋοΧιϯͰϓϩτλΠϓ
ຊͷ͓ ࠷ۙͷ9%ͷදݱྗ Ͱ͖Δ͜ͱͰ͖ͳ͍͜ͱ σϞ
࠷ۙͷ9%ͰͰ͖Δ͜ͱ Cake Catalogue
Ͱ͖ͳ͍͜ͱछྨ 6*͕ଘࡏ͠ͳ͍͔Β9%͚ͩͰͰ͖ͳ͍ ػೳΛඋ͑ͯͳ͍͔ΒͰ͖ͳ͍ ɾ ഁઢ ɾ ԁܗάϥσʔγϣϯͳͲ ɾ CSSͷॻ͖ग़͠ͳͲ ɾ
ॎॻ͖ςΩετ ɾ ݻఆϔομʔʗϑολʔʗϙο ϓΞο ϓʗ ϚΠ ΫϩΠϯλϥΫγϣϯͳͲ
ϝϯόʔ͕8JOEPXTͷΈˠϓϩτλΠϓͰΊΔ ڞಉ࡞ۀͷ9% ҰਓͰ࡞ۀͰ͖ΔˠϑΟχογϡϫʔΫ·Ͱ खͰ)5.-$44ΛΊΔϝϯόʔ͕ډͳ͍ ˠϓϩτλΠϓͰΊΔ
ͦͷલʹ ʂ 6*ΩοτΛ͏ͳΒϑΥϯτΛ४උ ˞ೖͬͯͳ͚Ε ɾ San Francisco (SF UI Display
/ SF UI Text) https://developer.apple.com/fonts/ ɾ Roboto Typekit or https://github.com/google/roboto ɾ Noto Typekit or https://www.google.com/get/noto/ ɾ Segoe UI 8JOEPXT൛͔ΒͰ͍͍͔
ϑΥ ϯτͳͥඞཁʁ ϞόΠϧΞϓϦϓϨϏϡʔͰɺ σβΠϯͰΘΕ͍ͯΔ ϑΥϯτΛʹμϯϩʔυͯ͘͠ΕΔ Android iOS F F
a
ΞΠσΞεέονΛ9%Ͱ ϑΥϯτมߋ͠ͳ͍ γΣΠϓͷ৭ม͑ͳ͍ ΞΠίϯͷԾͯΞΠίϯϑΥϯτ͑Δ
ϫΠϠʔϑϨʔϜΛ9%Ͱ Ϙλϯ ɾ ΞΠίϯϘλϯάϧʔϓԽ͢Δ ελΠϧઐ༻ͷΞʔτϘʔυʹඞͣϑΥϯτ໊Λ ʂ άϧʔϓʹը໘ભҠઃఆ͢Εɺ ϘλϯͷσβΠϯมߋ͕͋ͬͯ࠶ઃఆෆཁ
ΞΠίϯϑΥ ϯτ 'POUBXFTPNF (JUIVC͔Β05'·ͨ55'ܗࣜͷϑΥϯτ ϑΝΠϧΛ μϯϩʔυ͢Δ ϦϐʔτάϦουͱςΩετ ϑΝΠϧͱ'POUBXFTPNF
ΞΠίϯϑΥ ϯτ 'POUBXFTPNF ȍ +FU#SBJOTܥͷ*%&ࣗಈͰ 'POUBXFTPNFͷදࣔΛߦ͏ ςΩετ ϑΝΠϧ͔Β ϦϐʔτάϦου
ΞΠίϯϑΥ ϯτΛ͑ ȍ ȍ ϦϐʔτάϦουͰ ৭ସ͑ࣗࡏ ϦϐʔτάϦουͰ ԣˠॎมߋͰ͖Δ ϑΥϯτʹ͓͚ͯ͠ ৭ସ͑ࣗࡏ
ελΠϧͷෳ ϑΥ ϯτ ɿ ϓϧμϯఘΊͯίϐϖ ϑΥϯτҎ֎ͷελΠϧ ɿ ෳ߹γΣΠϓΛ࡞Γղআ͢Δ
ϑΥ ϯτ ɿ 5ZQFLJUͰબͿͱ͖ ϑΥϯτͷݸผը໘ʹӳޠͷϑΥϯτ໊͕ॻ͍ͯ͋Δ ࠷ޙͷ ϒϩοΫҎ֎͕ ϑΥϯτ໊
ελΠϧΛҙͷγΣΠϓʹෳ ෳ͍ͨ͠ελΠϧͷγΣΠϓ ඞͣରγΣΠϓΑΓԼʹ ʂ άϥσʔγϣϯ ઢͷελΠϧ
ελΠϧઐ༻ͷΞʔτϘʔυΛ࡞Δ Ұ൪࠷ॳʹ࡞ΔΞʔτϘʔυશͯͷ֊ͰҰ൪Լ ѻ͍ʹͳΔ ϑΥϯτҎ֎ͷελΠϧΛूΊ͓͚ͯͤʹ ʂ
ؾΛ͚ͭΔ͜ͱ ଠࣈʹରԠ͢ΔΣΠτ͕Πϯετʔϧ͞Ε͍ͯΔ ʁ ࣼମʹରԠ͢ΔΣΠτ͕Πϯετʔϧ͞Ε͍ͯΔ ʁ
ࠓճೖΒͳ͔ͬͨ
ϦϐʔτάϦ ο υ͋Ε͜Ε OK Ωϟϯηϧ ϝοηʔδૹ৴ NO γΣΞ OK Ωϟϯηϧ
ϝοηʔδૹ৴ NO γΣΞ OK Ωϟϯηϧ ϝοηʔδૹ৴ NO γΣΞ OK Ωϟϯηϧ ϝοηʔδૹ৴ ϦϐʔτάϦουͰϘλϯσβΠϯΛ·ͱΊͯνΣοΫ ճసͯ͠ύϯͣ͘Ϧετ
ϦϐʔτάϦ ο υ͋Ε͜Ε ϦϐʔτάϦουʴϚεΫ ϦϐʔτάϦου ʴ։࢝ҐஔͣΒ͠ ͋͋͋͋͋͋͋͋͋ ͋͋͋͋͋͋͋͋͋
ΦʔϓϯύεΛ׆༻ͯ͠λϒ࡞ ෳ߹ύεΛ࡞Δ ϖϯπʔϧͰϙΠϯτ ɹͷ݁߹Λ։͘ ΦϒδΣΫτʼύεʼ ɹύεʹม ෆཁͳϙΠϯτΛআ