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
マイクロインタラクションから考えるアニメーション
Search
KeitaroOkamura
August 24, 2018
Design
1
290
マイクロインタラクションから考えるアニメーション
KeitaroOkamura
August 24, 2018
Tweet
Share
More Decks by KeitaroOkamura
See All by KeitaroOkamura
Suspenseのユースケースを探る
keitarookamura
1
310
ヤギでもわかるソフトウェアテスト
keitarookamura
0
130
ヤギでもわかるオブジェクト指向UIデザイン
keitarookamura
3
310
ヤギでもわかるGit入門
keitarookamura
1
270
ユースケースから考えるユーザビリティ
keitarookamura
1
230
サクッと簡単!お手軽 Scaffold
keitarookamura
1
310
自社サイトをPWA化した話
keitarookamura
0
130
CSS Animations vs WAAPI
keitarookamura
0
530
Vue.js+AtomicDesign
keitarookamura
2
2.7k
Other Decks in Design
See All in Design
TWCP#21 UXデザインと哲学のはなし
shinn
0
310
新規AIプロダクトで、事前に知るべきだった3つの壁 〜医療AIを1年間作って、従来の開発が通用しなかった話〜 / Three Walls in Building AI Products
shikichee
2
3.8k
デザイナーがはばたく未来の入り口『hatch』が描く、新しいデザイナー育成のカタチ
goodpatch
3
3.3k
decksh object reference
ajstarks
2
1.5k
デザインの文脈を理解する:エンジニアがデザインカンファレンスに参加して得た学びと気づき
hypebeans
0
130
はじめての演奏会フライヤーデザイン
chorkaichan
1
240
20260215独立行政法人科学技術振興機構(JST) 社会技術研究開発センター(RISTEX)ケアが根づく社会システム _公開シンポジウム
a2k
0
130
デザインするために「多様性」について考える
iflection
0
240
社員の意識を高めたブランド浸透施策の裏側!
mixi_design
PRO
0
110
新卒2年目デザイナーが、UX検定基礎にチャレンジした話
designer_no_pon
1
1.3k
hicard_credential_202601
hicard
0
200
大企業インハウスデザイン組織における DesignOps改革の現在地 / DesignOps at Scale: Navigating Transformation in Large Enterprises
nttcom
0
390
Featured
See All Featured
Impact Scores and Hybrid Strategies: The future of link building
tamaranovitovic
0
240
Optimizing for Happiness
mojombo
378
71k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
14k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
38
2.8k
Facilitating Awesome Meetings
lara
57
6.8k
For a Future-Friendly Web
brad_frost
183
10k
Navigating Weather and Climate Data
rabernat
0
140
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
1
310
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
240
Designing for Timeless Needs
cassininazir
0
170
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
1
1.5k
Exploring anti-patterns in Rails
aemeredith
2
290
Transcript
ϚΠΫϩΠϯλϥΫγϣϯ ͔Βߟ͑Δ Ξχϝʔγϣϯ 6*ΠϯλϥΫγϣϯɾΞχϝʔγϣϯ-5େձ
ࣗݾհ ,FJUBSP0LBNVSB ΧϥϏφςΫϊϩδʔגࣜձࣾ 'SPOUFOE&OHJOFFS ϑϩϯτΤϯυΤϯδχΞੜ @karaagekeitaroo
%BO4BGGFSஶʮϚΠΫϩΠϯλϥΫγϣϯʕʕ6*69σβΠϯͷਆ͕॓Δࡉ෦ʯ 03FJMMZ+BQBO ࠓͷ༰
ɾʮ͜Εࡉ͔͍͜ͱ͚ͩΕͲվྑ͢ΔՁ ͕ઈରʹ͋Δʂʂʂʯ ɾʮ͜ΕΛվળ͢Ε͕֨ஈʹΑ͘ͳ Δʂʂʂʯ ͱओுͯ͠ɺ ΫϥΠΞϯτ։ൃऀཧऀɺ1.Λઆಘ͠Α͏ͱۤ৺͖ͯͨ͠ਓ ͜Μͳํ͍·ͤΜ͔ʁ
%BO4BGGFSஶʮϚΠΫϩΠϯλϥΫγϣϯʕʕ6*69σβΠϯͷਆ͕॓Δࡉ෦ʯ 03FJMMZ+BQBO ͥͻಡΜͰ Έ͍ͯͩ͘͞
ϚΠΫϩΠϯλϥΫγϣϯͬͯԿʁ ϚΠΫϩΠϯλϥΫγϣϯͱʮͷ࠷খ୯ҐͷΠϯλ ϥΫγϣϯʯͱఆٛ͞Ε͍ͯΔɻ ͱͯখ͞ͳΓͱΓ
ΞϥʔτΛηοτ⏰ ύεϫʔυΛೖྗ✏ ϩάΠϯ͢Δ✅ ʮ͍͍Ͷʂʯ ϘλϯΛԡ͢ ୭͕ϚΠΫϩΠϯλϥΫγϣϯΛ ৗతʹߦͳ͍ͬͯΔ
“ ࡉ෦୯ͳΔࡉ෦ʹͱͲ·Γ·ͤΜɻࡉ෦ ͕ͦ͜Λ࡞Γ্͛ΔͷͰ͢” νϟʔϧζɾΠʔϜζ
τϦΨʔ ϧʔϧ ϧʔϓϞʔυ ϑΟʔυόοΫ ϚΠΫϩΠϯλϥΫγϣϯͭͷߏ
τϦΨʔ ϧʔϧ τϦΨʔϚΠΫϩΠϯλϥΫγϣϯΛ։࢝ͤ͞Δ͖͔͚ͬ ϚΠΫϩΠϯλϥΫγϣϯͷಈ࡞Λఆٛ͢ΔϧʔϧɻͲΜͳ࣌ʹɺԿΛରʹɺ ͲΜͳτϦΨʔͰΠϯλϥΫγϣϯ͕࢝·ΓɺͲͷΑ͏ʹϑΟʔυόοΫͤ͞ Δ͔ खಈτϦΨʔ γεςϜτϦΨʔ εϥΠυ͢Δ͜ͱͰ ిݯΛΔ
ॆి͕ҎԼʹͳΔ ͱɺলిྗϞʔυʹ Γସ͑Δ͔ΘΕΔ
ϑΟʔυόοΫ ϧʔϓϞʔυ ϧʔϧΛϢʔβʔʹ໌ࣔ͢ΔϑΟʔυόοΫɻϢʔβʔͷཧղΛॿ͚Δࢹ֮తɺ ௌ֮తɺ৮֮తͳཁૉ ϚΠΫϩΠϯλϥΫγϣϯͷϝλϧʔϧʢϧʔϧΛ੍ޚ͢Δϧʔϧʣ ϧʔϓͱɺఆΊΒΕ͚ͨؒͩ܁Γฦ͢αΠΫϧɻϞʔυͱϧʔϧ͕ೋވҎ ্ʹͳͬͨͷ ॆి͕ྃ͢ΔͱϞʔυ͕ऴྃ͢Δ
ϑΟʔυόοΫ ϧʔϓϞʔυ ϧʔϧΛϢʔβʔʹ໌ࣔ͢ΔϑΟʔυόοΫɻϢʔβʔͷཧղΛॿ͚Δࢹ֮తɺ ௌ֮తɺ৮֮తͳཁૉ ϚΠΫϩΠϯλϥΫγϣϯͷϝλϧʔϧʢϧʔϧΛ੍ޚ͢Δϧʔϧʣ ϧʔϓͱɺఆΊΒΕ͚ͨؒͩ܁Γฦ͢αΠΫϧɻϞʔυͱϧʔϧ͕ೋވҎ ্ʹͳͬͨͷ ॆి͕ྃ͢ΔͱϞʔυ͕ऴྃ͢Δ
%BO4BGGFSஶʮϚΠΫϩΠϯλϥΫγϣϯʕʕ6*69σβΠϯͷਆ͕॓Δࡉ෦ʯ 03FJMMZ+BQBO ৄ͘͠ ͪ͜Β
ɾԿ͔͕ى͖ͨ ɾϢʔβʔ͕Կ͔Λ࣮ߦͨ͠ ɾॲཧ͕࢝·ͬͨPSଓߦதPSऴྃͨ͠ ɾϢʔβʔʹʮͦΕͰ͖ͳ͍ʯͱΒͤΔ ϑΟʔυόοΫͰ͑Δ͜ͱ
͍͑ͨࣄฑ͕͖ͬΓͨ͠Βɺ ͦΕΛͲ͏දݱ͢Δ͔ΛܾΊ·͢ දݱ͢Δํ๏
ɾϑΟʔυόοΫͷେࢹ֮తͳͷ͕ଟ͍ ɾٿ্ͰࣈΛಡΊͳ͍ਓͷԯ ສਓ͍Δ ϑΟʔυόοΫΛࢹ֮తʹૌ͑Δํ ๏ɺͦΕ͕Ξχϝʔγϣϯɻ ΞχϝʔγϣϯΛ͏·͑͘ɺؔ৺ΛҾ͖ͭͭɺ ҙຯਖ਼֬ʹ͑Δ͜ͱ͕Ͱ͖Δ
ɾߴ ɾಈ࡞ΛԆͤ͞ͳ͍ ɾΒ͔ ɾ͗͘͠Όͨ͘͠ಈ͖ΞχϝʔγϣϯͷޮՌΛແ͠ʹͯ͠͠·͏ ɾࣗવ ɾॏྗ׳ੑͳͲࣗવͷ๏ଇʹै͍ͬͯΔΑ͏ʹݟ͑Δ ΞχϝʔγϣϯͰ͔ܽͤͳ͍͜ͱ ϚΠΫϩΠϯλϥΫγϣϯͷಈ࡞͕ෆ҆ఆͰ͋Δ͔ͷΑ ͏ͳҹΛ༩͑ͯ͠·͏
ɾγϯϓϧ ɾਤ͕Θ͔Γ͍͢ ɾత͕͋Δ ɾ୯ͳΔʮͷอཆʯʹͱͲ·Βͳ͍ ΞχϝʔγϣϯͰ͔ܽͤͳ͍͜ͱ Ϣʔβʔʹෛ୲Λ͔͚ͨΓɺϑΟʔυόοΫ͕త֎Εͳ ͷͰ͋ͬͯͳΒͳ͍
ϑΟʔυόοΫ ͷత ϧʔϧͷཧղΛ ॿ͚Δ͜ͱ ͭ·Γɾɾɾ
ϚΠΫϩΠϯλϥΫγϣϯͷϧʔϧΛϢʔβʔʹཧղͯ͠Β͏͜ͱ ɾԿ͕ߦΘΕ͔ͨ ɾͦͷ݁Ռͱͯ͠Կ͕ى͖͔ͨ Ξχϝʔγϣϯͤ͞Δత
ϚΠΫϩΠϯλϥΫγϣϯͷߏ͕Ͳ͏ͳ͍ͬͯΔ͔ɺ Կʹͨ͠ΒΑ͍ͷ͔ɺͲͷΑ͏ͳॲཧΛ͍ͯ͠Δ͔ ࠷ྑͷΞχϝʔγϣϯͱʁ ͦͷಈ͖ΛݟΕɺ Ͳ͏ػೳ͢Δ͔Λత֬ʹϢʔβʔʹ͍͑ͯΔ͜ͱ ʲ݁ʳ
%BO4BGGFSஶʮϚΠΫϩΠϯλϥΫγϣϯʕʕ6*69σβΠϯͷਆ͕॓Δࡉ෦ʯ 03FJMMZ+BQBO ৄ͘͠ ͪ͜Β
ྑ͍ΞχϝʔγϣϯΛ