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
デザイン的思考がもたらす価値
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Nobuo Urata
December 21, 2018
Design
67
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
デザイン的思考がもたらす価値
デザイン的な思考は私たちにどのような効果をもたらすのか
Nobuo Urata
December 21, 2018
More Decks by Nobuo Urata
See All by Nobuo Urata
1時間でサービス名を考える ワークショップ
uranobu65
0
180
クエスチョンバックログを作ろう 〜問いから設計するデザインプロセス〜
uranobu65
4
9k
Other Decks in Design
See All in Design
開閉UIのアニメーション設計
hiro0218
2
1.1k
デザなに#1「問いのデザイン」の紹介LT
garyuten
0
130
Where Imagination Ends AI Begins
r5ni4
0
430
凡庸を落とすハーネス
hiromimaeo
2
940
少人数チームで_使われるプロダクトにたどり着くための_デザインハーネス.pdf
nishame
1
1.5k
開発・制作におけるUI・UXデザインの重要性について~UI・UXデザインってなんだろう~
yamasaku
0
240
速く作れるかではなく、速く学べるか ― 学習ループを回すパイロットの途中報告
nagata03
0
690
図面資産×AI 眠れる資産を起こす挑戦
aonomasahiro
0
260
「惜しいデザイン」 を生み出さないための AIレビューループ
0b1tk
3
4.6k
東京都市大学 都市生活学部×一般社団法人オープン企画イベント 「誰もがデザイナーである」とはどういうことか? 【エツィオ・マンズィーニ氏 特別来日・基調講演】
a2k
1
130
空間アプリ開発のフィードバックをCodexにするための抽象的なデザインツールの模索
karad
0
220
LP制作のための熱量ハーネス -人の熱量を、AIとの制作につなぐ-
niccy
0
1.6k
Featured
See All Featured
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
380
A designer walks into a library…
pauljervisheath
211
25k
Product Roadmaps are Hard
iamctodd
55
13k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
254
22k
Evolving SEO for Evolving Search Engines
ryanjones
0
300
The Straight Up "How To Draw Better" Workshop
denniskardys
239
140k
Building Better People: How to give real-time feedback that sticks.
wjessup
370
20k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
Building the Perfect Custom Keyboard
takai
2
890
Public Speaking Without Barfing On Your Shoes - THAT 2023
reverentgeek
1
580
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
440
From π to Pie charts
rasagy
1
380
Transcript
from TechFirm Inc, Nobuo Urata ΈΜͳͰֶͿ˒LTձ vol.2 σβΠϯతࢥߟ͕ੜΉՁ
2016- Ӝా ৳உ ςοΫϑΝʔϜʹΤϯδχΞͱͯ͠ೖࣾ ECαΠτͷ৽نߏஙɺӡ༻ ϓϩδΣΫτϚωʔδϟʔͱͯ͠ ֎ࢿاۀͷΩϟϯϖʔϯWebαΠτΛ୲ɹ άϩʔεϋοΫɺUXσβΠϯͷऔΈΛ։࢝ ࣾసͰαʔϏεσβΠφʔʹ ৽نࣄۀαʔϏεͷσβΠϯɾվળʹैࣄ
ؒ100ຊͷϫʔΫγϣοϓσβΠϯɾϑΝγϦςʔγϣϯΛߦ͏ 2010 2012 - 2014 Service Designer / ೋਓͷ່ͷ
ओઓ ઃܭ ։ൃ Ծઆݕূ Ϣʔβʔମݧͷઃܭ اը UIઃܭ UIσβΠϯ Ṷ͚ํ Ձઃܭ
ϓϩτλΠϐϯά ཁ݅ఆٛ
ࠓͷ σβΠϯతࢥߟ ࢲͨͪʹͲΜͳՁΛͨΒ͢ͷ͔ ΦϚέɿσβΠϯతࢥߟΛʹண͚ΔͨΊͷΤΫααΠζ
ʂ σβΠϯతࢥߟ ≠ ελΠϦϯάΛ͢Δ͜ͱɻ ɹ d.schoolͷϝιου୯ମ ʹ ຊ࣭తʹࣄΛߟ͑Δ͜ͱ
My Story
2010 - 2014
Client & Agency me ҆͘ૣ͘ ࡞Ε ͳͥͦΜͳʹ ͕͔͔࣌ؒΔΜͩ
We just worked hard.
ͬͨͷർ࿑ײͱ ΘΕͳ͍αʔϏε ΘΕͳ͍αʔϏε
Growth Hack
ϢʔβʔͷσʔλϑΟʔυόοΫ͔Β ߴʹվળΛਐΊɺαʔϏεͱࣄۀΛ ͤ͞ΔऔΓΈ Growth Hack දతख๏ɿAARRRϞσϧɺABςετetc γϣʔϯɾΤϦε
Growth Hack Product Market Fit Problem Solution Fit
Growth Hack Product Market Fit Problem Solution Fit GrowthHack͢ΔલʹϢʔβʔʹඞཁͱ͞ΕΔ ՁΛΕ͍ͯΔඞཁ͕͋Δ
Growth Hack Product Market Fit Problem Solution Fit GH͢ΔલʹϢʔβʔʹඞཁͱ͞ΕΔ ՁΛΔඞཁ͕͋Δ
Ͳ͏͢Ε Ϣʔβʔʹඞཁͱ͞ΕΔՁΛ Δ͜ͱ͕Ͱ͖ΔͷͩΖ͏ʁ
ษڧձ ຊಡΉ ਂ۷Γ ৽ͨͳڵຯ
UX UI ϢʔβϏϦςΟςετ σϓεΠϯλϏϡʔ ΤεϊάϥϑΟʔ IA άϥϑΟοΫ ΧελϚʔδϟʔχʔϚοϓ ϦʔϯΩϟϯόε ϖϧιφ
ϫΠϠʔϑϨʔϜ ϓϩτλΠϐϯά ϏδϡΞϧσβΠϯ MVP PMF ετʔϦʔϘʔυ KJ๏ KA๏ σβΠϯγϯΩϯά HCD όϦϡʔϓϩϙδγϣϯϚοϓ ϦʔϯελʔτΞοϓ
Service Designerͷస
Service Designerͷస
UX UI ϢʔβϏϦςΟςετ σϓεΠϯλϏϡʔ ΤεϊάϥϑΟʔ IA άϥϑΟοΫ ΧελϚʔδϟʔχʔϚοϓ ϦʔϯΩϟϯόε ϖϧιφ
ϫΠϠʔϑϨʔϜ ϓϩτλΠϐϯά ϏδϡΞϧσβΠϯ MVP PMF ετʔϦʔϘʔυ KJ๏ KA๏ σβΠϯγϯΩϯά HCD όϦϡʔϓϩϙδγϣϯϚοϓ ϦʔϯελʔτΞοϓ
Ͳͷॱ൪ͰਐΊͨΒ͍͍ͷʁ ͦͦԿ͕ਖ਼ղͳͷʁ
The Elements of User Experience A basic duality: The Web
was originally conceived as a hypertextual information space; but the development of increasingly sophisticated front- and back-end technologies has fostered its use as a remote software interface. This dual nature has led to much confusion, as user experience practitioners have attempted to adapt their terminology to cases beyond the scope of its original application. The goal of this document is to define some of these terms within their appropriate contexts, and to clarify the underlying relationships among these various elements. Jesse James Garrett
[email protected]
Visual Design: graphic treatment of interface elements (the "look" in "look-and-feel") Information Architecture: structural design of the information space to facilitate intuitive access to content Interaction Design: development of application flows to facilitate user tasks, defining how the user interacts with site functionality Navigation Design: design of interface elements to facilitate the user's movement through the information architecture Information Design: in the Tuftean sense: designing the presentation of information to facilitate understanding Functional Specifications: "feature set": detailed descriptions of functionality the site must include in order to meet user needs User Needs: externally derived goals for the site; identified through user research, ethno/techno/psychographics, etc. Site Objectives: business, creative, or other internally derived goals for the site Content Requirements: definition of content elements required in the site in order to meet user needs Interface Design: as in traditional HCI: design of interface elements to facilitate user interaction with functionality Information Design: in the Tuftean sense: designing the presentation of information to facilitate understanding Web as software interface Web as hypertext system Visual Design: visual treatment of text, graphic page elements and navigational components Concrete Abstract time Conception Completion Functional Specifications Content Requirements Interaction Design Information Architecture Visual Design Information Design Interface Design Navigation Design Site Objectives User Needs User Needs: externally derived goals for the site; identified through user research, ethno/techno/psychographics, etc. Site Objectives: business, creative, or other internally derived goals for the site This picture is incomplete: The model outlined here does not account for secondary considerations (such as those arising during technical or content development) that may influence decisions during user experience development. Also, this model does not describe a development process, nor does it define roles within a user experience development team. Rather, it seeks to define the key considerations that go into the development of user experience on the Web today. task-oriented information-oriented 30 March 2000 © 2000 Jesse James Garrett http://www.jjg.net/ia/
+FTTF+BNFT(BSSFUU "EBQUJWF1BUI'PVOEFS$&0 "KBYͱ͍͏ݴ༿Λఆٛͨ͜͠ͱͰ༗໊ ʹݸਓαΠτͰൃද IUUQXXXKKHOFUFMFNFOUTQEGFMFNFOUTQEG ৄࡉҎԼॻ੶Λࢀর͍ͩ͘͞ Σϒઓུͱͯ͠ͷʮϢʔβʔΤΫεϖϦΤϯεʯʕͭͷஈ֊Ͱߟ͑Δ Ϣʔβʔத৺σβΠϯຖίϛϡχέʔγϣϯζ
The Element of User Experience త Ϣʔβʔͷ๊͑Δ՝ / αʔϏεͷత ex.
ΠϯλϏϡʔ / Φϒβϕʔγϣϯɺδϣϒੳ ղܾࡦ ཁ݅ ղܾʹඞཁͳػೳίϯςϯπͱମݧͷྲྀΕ ex. CJMɺVPCɺϏδωεϞσϧਤ ߏ αΠτΞϓϦͷߏʢIAʣ ex. αΠτϚοϓɺભҠਤ ࠎ֨ ΠϯλϥΫγϣϯ/φϏήʔγϣϯσβΠϯ ex. ϫΠϠʔϑϨʔϜ ද ϏδϡΞϧσβΠϯ ex. άϥϑΟοΫɺλΠϙάϥϑΟ ੍࡞։࢝ ੍࡞ྃ
2.͍Λ ཱͯΔ 3.ߟ͑Δ 4.࣮ߦ͢Δ 1.ϑΥʔΧε
ද ࠎ֨ ߏ ղܾࡦ ཁ݅ ͜ͷϓϩδΣΫτͷ ΰʔϧԿ͔ʁ Ϣʔβʔ୭͔ʁ ղܾ͖͢ ՝Կ͔ʁ
ͲͷΑ͏ͳՁΛ ࣮ݱ͢Δͷ͔ʁ త ར༻γʔϯͰ Ϣʔβʔ͕ ཧղ͠қ͍ߏ ͲΜͳͷ͔ʁ ղܾ͢ΔͨΊʹ ඞཁͳػೳԿ͔ʁ ͲͷΑ͏ͳจ຺Ͱ ͬͯΒ͏͔ʁ ͲͷΑ͏ͳ ϏδϡΞϧ͕ ཧղ͘͢͠ɺ ૂͬͨײΛ Ҿ͖ग़ͤΔ͔ʁ Ծઆཱͯͨ ͱ՝ຊʹ ଘࡏ͢Δͷ͔ʁ ՝ʹରͯ͠ ιϦϡʔγϣϯ దͦ͏͔ʁ ఆ௨Γʹ Ϣʔβʔ ͑Δ͔ʁ ײ͡Δ͔ʁ ϓϩδΣΫτಉ͡ɻ͍ͷϓϩηεΛͭ͘Δ
ද ࠎ֨ ߏ ղܾࡦ ཁ݅ ͜ͷϓϩδΣΫτͷ ΰʔϧԿ͔ʁ Ϣʔβʔ୭͔ʁ ղܾ͖͢ ՝Կ͔ʁ
ͲͷΑ͏ͳՁΛ ࣮ݱ͢Δͷ͔ʁ త ར༻γʔϯͰ Ϣʔβʔ͕ ཧղ͠қ͍ߏ ͲΜͳͷ͔ʁ ղܾ͢ΔͨΊʹ ඞཁͳػೳԿ͔ʁ ͲͷΑ͏ͳจ຺Ͱ ͬͯΒ͏͔ʁ ͲͷΑ͏ͳ ϏδϡΞϧ͕ ཧղ͘͢͠ɺ ૂͬͨײΛ Ҿ͖ग़ͤΔ͔ʁ Ծઆཱͯͨ ͱ՝ຊʹ ଘࡏ͢Δͷ͔ʁ ՝ʹରͯ͠ ιϦϡʔγϣϯ దͦ͏͔ʁ ͍ʹର͢Δ͑Λಋ͘खஈͱͯ͠ख๏ΛνϣΠε ख๏ϑϨʔϜϫʔΫతͰͳ͍ ఆ௨Γʹ Ϣʔβʔ ͑Δ͔ʁ ײ͡Δ͔ʁ
2.͍Λ ཱͯΔ 3.ߟ͑Δ 4.࣮ߦ͢Δ 1.ϑΥʔΧε Client Engineer Designer × ×
νʔϜͰऔΓΉ
ຊ ͜ͷΑ͏ͳϓϩηεऔΓΈ ͲͷΑ͏ͳՁ͕͋Δͷ͔
σβΠϯతࢥߟΛ༻͍ͨϓϩηε͕ ͨΒ͢ޮՌ 1.Ձͷߴ͍αʔϏεΛੜΈग़͘͢͠ͳΔ 2. ಇ͘͜ͱʹͤΛݟग़ͤΔΑ͏ʹͳΔ ↓ ࠓ͍͑ͨͷͬͪ͜ ↓
ਓͷͳঢ়ଶ ʮϑϩʔʯͷதʹੜ·ΕΔ ϛϋΠɾνΫηϯτϛϋΠ ʢถ ৺ཧֶऀʣ “ ࣌ΛΕɺࣗΛΕͯ ͋Δ͜ͱʹͷΊΓࠐΉ ͜Ε͕ʮͤʯͱ͍͏͜ͱ”
ϑϩʔ ঢ়ଶ ߦಈΛ ৴͡Δ σβΠϯతࢥߟϓϩηε ৴͡ΒΕΔҙٛΛݟग़͢͜ͱʹཱͭ
あなたの仕事は、あなたの⼈⽣において ⼤きな部分を占めるようになるだろう。 これに満⾜する唯⼀の⽅法は、 ⾃分のしている仕事が偉⼤なものだと信じることだ。 -スティーブ・ジョブズ-
商売やものづくりは技術や効率はもちろん必要ですが それ以上に必要なのは意義なんじゃないかと私は思うんです。 「何のためにやるのか」ということです。 -下町ロケット 佃航平-
2.͍Λ ཱͯΔ 3.ߟ͑Δ 4.࣮ߦ͢Δ 1.ϑΥʔΧε
ҰਓͰ࢝ΊΒΕΔ σβΠϯతࢥߟΛʹ͚ͭΔ ΤΫααΠζ
1. ୭ͷͲΜͳͱ՝Λղܾ͠Α͏ͱ͍ͯ͠Δͷ͔ʁ 2. ͦͷϢʔβʔࠓͲ͏ͬͯͦͷΛରॲ͍ͯ͠Δͷ͔ʁ 3.ͦͷαʔϏεͲ͏ͬͯղܾ͠Α͏ͱ͍ͯ͠Δͷ͔ʁ 4. ͦͷιϦϡʔγϣϯͲΜͳՁΛͨΒ͢ͷ͔ʁ 5. ͲͷΑ͏ʹརӹΛ͋͛Δͷ͔ʁ ͦͷ̍
ৗͰʹ৮ΕͨαʔϏεʹʮ͍ʯΛͿ͚ͭͯΈΑ͏
ग़యɿࠤজࢯϒϩάΑΓɹhttps://www.sanoakihiko.com/blog/branding/493.html
UI UX
UI UX ͲͪΒUIɾUX ॏࢹ͢ΔՁ͕ҧ͏
ͲͪΒUIɾUX ॏࢹ͢ΔՁ͕ҧ͏ ػೳతՁ ॹతՁ ࣗݾ࣮ݱతՁ
ͦͷ̎ ࣗͷܞΘ͍ͬͯΔࣄʹಉ༷ͷʮ͍ʯΛͿ͚ͭͯΈΑ͏
ͦͷ̏ ৗྑ͔ͬͨݏͩͬͨܦݧΛ۷ΓԼ͛Α͏
6up Sketches Titleɿ Nameɿ ΦʔτϩοΫΛൈ͚Δͱɺ ࣗಈͰߦ͖ઌ֊ͷϘλϯ͕౮ͨ͠ঢ়ଶ Ͱܴ͑ೖΕͯ͘ΕΔΤϨϕʔλʔ τΠϨͷྲྀ͠Ϙλϯɻʮ࠲ͬͨঢ়ଶʯͱ ʮཱͬͨঢ়ଶʯͲͪΒͷํ͔ΒԠ ͯ͘͠ΕΔΑ͏ʹͳ͍ͬͯΔ
αϯλ͞ΜͷݱࡏΛදࣔͯ͘͠ΕΔ GoogleMapɻࢠͲͱͷίϛϡχέʔ γϣϯָ͕͍͠ͷʹɻ ༣ૹͰσΟζχʔνέοτ͕ಧ͍ͨɻ ຊ௨ӡײͰͳ͘ɺσΟζχʔσβΠ ϯͷ෧Ͱߦ͘લ͔Βؾ͕࣋ͪߴ·Δɻ όϨϯλΠϯʹ͡ΐͬͺ͍౾՛ࢠΛ Β͏ɻνϣί͔ΓͷதͰɺԘͬؾ͕ཉ ͍࣌͠ʹ࠷దͩͬͨɻ ʑͷخ͍͠Ωϟϓνϟ Nobuo Urata NewsPicksɻ ຖͷίϝϯτ͕Ϩϕϧʹͭͳ͕Δɻ NPσβΠφʔ͞Μ͔Β͍͍ͶΒ͑ͨʂ
ͦͷ̏ ৗྑ͔ͬͨݏͩͬͨܦݧΛ۷ΓԼ͛Α͏ ͦͷ̎ ࣗͷܞΘ͍ͬͯΔࣄʹಉ༷ͷʮ͍ʯΛͿ͚ͭͯΈΑ͏ ͦͷ̍ ৗͰʹ৮ΕͨαʔϏεʹʮ͍ʯΛͿ͚ͭͯΈΑ͏
もし私が世界を救うのに1時間だけ与えられたとすると、 そのうちの55分は⾃分が正しい問いに答えようとしているのかどうかを 確認することに費やすだろう。 -アルベルト・アインシュタイン- If I had only hour to
save the world, I would spend 55 minutes defining the problem, and only 5minutes finding the solution.
·ͣαʔϏεΛͭ͘Δࢲ͕ͨͪࣗΠΩΠΩͱ ͦͯ͠ૉΒ͍͠αʔϏεͰᷓΕΔੈͷதΛΓ·͠ΐ͏ ͦͷͨΊʹσβΠϯతࢥߟ͕օ͞Μͷ͓ʹཱͯ
Thank you