デザイン的思考が生む価値

ノンデザイナー向けの発表資料。
・JJGのElements of UX図を用いてデザイン的思考の概要について
・デザイン的思考が「働く」ということにどのような価値をもたらすのか
・実務以外の場でも日々デザイン的思考を身につけるためのエクササイズ

デザイナー以外の方にも何かヒントになれば

Transcript

1. from TechFirm Inc, Nobuo Urata ΈΜͳͰֶͿ˒LTձ vol.2 σβΠϯతࢥߟ͕ੜΉՁ஋
2. 2016- Ӝా ৳உ ςοΫϑΝʔϜʹΤϯδχΞͱͯ͠ೖࣾ ECαΠτͷ৽نߏஙɺӡ༻ ϓϩδΣΫτϚωʔδϟʔͱͯ͠ ֎ࢿاۀͷΩϟϯϖʔϯWebαΠτΛ୲౰ɹ άϩʔεϋοΫɺUXσβΠϯͷऔ૊ΈΛ։࢝ ࣾ಺స਎ͰαʔϏεσβΠφʔʹ ৽نࣄۀ΍αʔϏεͷσβΠϯɾվળʹैࣄ ೥ؒ໿100ຊͷϫʔΫγϣοϓσβΠϯɾϑΝγϦςʔγϣϯΛߦ͏ 2010 2012 - 2014 Service Designer / ೋਓͷ່ͷ෕
3. ओઓ৔ ઃܭ ։ൃ Ծઆݕূ Ϣʔβʔମݧͷઃܭ اը UIઃܭ UIσβΠϯ Ṷ͚ํ Ձ஋ઃܭ ϓϩτλΠϐϯά ཁ݅ఆٛ
4. ࠓ೔ͷ࿩ σβΠϯతࢥߟ͸ ࢲͨͪʹͲΜͳՁ஋Λ΋ͨΒ͢ͷ͔ ΦϚέɿσβΠϯతࢥߟΛ਎ʹண͚ΔͨΊͷΤΫααΠζ
5. ʂ σβΠϯతࢥߟ ≠ ελΠϦϯάΛ͢Δ͜ͱɻ ɹ d.schoolͷϝιου୯ମ ʹ ຊ࣭తʹ෺ࣄΛߟ͑Δ͜ͱ
6. My Story
7. 2010 - 2014
8. Client & Agency me ҆͘ૣ͘ ࡞Ε ͳͥͦΜͳʹ ͕͔͔࣌ؒΔΜͩ
9. We just worked hard.
10. ࢒ͬͨͷ͸ർ࿑ײͱ ࢖ΘΕͳ͍αʔϏε ࢖ΘΕͳ͍αʔϏε
11. Growth Hack
12. Ϣʔβʔͷσʔλ΍ϑΟʔυόοΫ͔Β ߴ଎ʹվળΛਐΊɺαʔϏεͱࣄۀΛ ੒௕ͤ͞ΔऔΓ૊Έ Growth Hack ୅දతख๏ɿAARRRϞσϧɺABςετetc γϣʔϯɾΤϦε
13. Growth Hack Product Market Fit Problem Solution Fit
14. Growth Hack Product Market Fit Problem Solution Fit GrowthHack͢ΔલʹϢʔβʔʹඞཁͱ͞ΕΔ Ձ஋Λ૑Ε͍ͯΔඞཁ͕͋Δ
15. Growth Hack Product Market Fit Problem Solution Fit GH͢ΔલʹϢʔβʔʹඞཁͱ͞ΕΔ Ձ஋Λ૑Δඞཁ͕͋Δ Ͳ͏͢Ε͹ Ϣʔβʔʹඞཁͱ͞ΕΔՁ஋Λ ૑Δ͜ͱ͕Ͱ͖ΔͷͩΖ͏ʁ
16. ษڧձ ຊಡΉ ਂ۷Γ ৽ͨͳڵຯ
17. UX UI ϢʔβϏϦςΟςετ σϓεΠϯλϏϡʔ ΤεϊάϥϑΟʔ IA άϥϑΟοΫ ΧελϚʔδϟʔχʔϚοϓ ϦʔϯΩϟϯόε ϖϧιφ ϫΠϠʔϑϨʔϜ ϓϩτλΠϐϯά ϏδϡΞϧσβΠϯ MVP PMF ετʔϦʔϘʔυ KJ๏ KA๏ σβΠϯγϯΩϯά HCD όϦϡʔϓϩϙδγϣϯϚοϓ ϦʔϯελʔτΞοϓ
18. Service Designer΁ͷస਎
19. Service Designer΁ͷస਎
20. UX UI ϢʔβϏϦςΟςετ σϓεΠϯλϏϡʔ ΤεϊάϥϑΟʔ IA άϥϑΟοΫ ΧελϚʔδϟʔχʔϚοϓ ϦʔϯΩϟϯόε ϖϧιφ ϫΠϠʔϑϨʔϜ ϓϩτλΠϐϯά ϏδϡΞϧσβΠϯ MVP PMF ετʔϦʔϘʔυ KJ๏ KA๏ σβΠϯγϯΩϯά HCD όϦϡʔϓϩϙδγϣϯϚοϓ ϦʔϯελʔτΞοϓ
21. Ͳͷॱ൪ͰਐΊͨΒ͍͍ͷʁ ͦ΋ͦ΋Կ͕ਖ਼ղͳͷʁ
22. 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 jjg@jjg.net 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/
23. +FTTF
    +BNFT
    (BSSFUU "EBQUJWF
    1BUI
    
    'PVOEFS$&0 "KBYͱ͍͏ݴ༿Λఆٛͨ͜͠ͱͰ΋༗໊ ೥ʹݸਓαΠτͰൃද
    IUUQXXXKKHOFUFMFNFOUTQEGFMFNFOUTQEG
    ৄࡉ͸ҎԼॻ੶Λࢀর͍ͩ͘͞
    ΢Σϒઓུͱͯ͠ͷʮϢʔβʔΤΫεϖϦΤϯεʯʕͭͷஈ֊Ͱߟ͑Δ Ϣʔβʔத৺σβΠϯ
    
    ຖ೔ίϛϡχέʔγϣϯζ 
24. The Element of User Experience ໨త Ϣʔβʔͷ๊͑Δ໰୊΍՝୊ / αʔϏεͷ໨త ex. ΠϯλϏϡʔ / Φϒβϕʔγϣϯɺδϣϒ෼ੳ ղܾࡦ ཁ݅ ղܾʹඞཁͳػೳ΍ίϯςϯπͱମݧͷྲྀΕ ex. CJMɺVPCɺϏδωεϞσϧਤ ߏ଄ αΠτ΍ΞϓϦͷߏ଄ʢIAʣ ex. αΠτϚοϓɺભҠਤ ࠎ֨ ΠϯλϥΫγϣϯ/φϏήʔγϣϯσβΠϯ ex. ϫΠϠʔϑϨʔϜ ද૚ ϏδϡΞϧσβΠϯ ex. άϥϑΟοΫɺλΠϙάϥϑΟ ੍࡞։࢝ ੍࡞׬ྃ
25. 2.໰͍Λ ཱͯΔ 3.ߟ͑Δ 4.࣮ߦ͢Δ 1.ϑΥʔΧε
26. ද૚ ࠎ֨ ߏ଄ ղܾࡦ ཁ݅ ͜ͷϓϩδΣΫτͷ ΰʔϧ͸Կ͔ʁ Ϣʔβʔ͸୭͔ʁ ղܾ͢΂͖ ՝୊͸Կ͔ʁ ͲͷΑ͏ͳՁ஋Λ ࣮ݱ͢Δͷ͔ʁ ໨త ར༻γʔϯͰ Ϣʔβʔ͕ ཧղ͠қ͍ߏ଄͸ ͲΜͳ΋ͷ͔ʁ ղܾ͢ΔͨΊʹ ඞཁͳػೳ͸Կ͔ʁ ͲͷΑ͏ͳจ຺Ͱ ࢖ͬͯ΋Β͏͔ʁ ͲͷΑ͏ͳ ϏδϡΞϧ͕ ཧղ͠΍͘͢ɺ ૂͬͨײ৘Λ Ҿ͖ग़ͤΔ͔ʁ Ծઆཱͯͨ ໰୊ͱ՝୊͸ຊ౰ʹ ଘࡏ͢Δͷ͔ʁ ՝୊ʹରͯ͠ ιϦϡʔγϣϯ͸ ద੾ͦ͏͔ʁ ૝ఆ௨Γʹ Ϣʔβʔ͸ ࢖͑Δ͔ʁ ײ͡Δ͔ʁ ϓϩδΣΫτ΋ಉ͡ɻ໰͍ͷϓϩηεΛͭ͘Δ
27. ද૚ ࠎ֨ ߏ଄ ղܾࡦ ཁ݅ ͜ͷϓϩδΣΫτͷ ΰʔϧ͸Կ͔ʁ Ϣʔβʔ͸୭͔ʁ ղܾ͢΂͖ ՝୊͸Կ͔ʁ ͲͷΑ͏ͳՁ஋Λ ࣮ݱ͢Δͷ͔ʁ ໨త ར༻γʔϯͰ Ϣʔβʔ͕ ཧղ͠қ͍ߏ଄͸ ͲΜͳ΋ͷ͔ʁ ղܾ͢ΔͨΊʹ ඞཁͳػೳ͸Կ͔ʁ ͲͷΑ͏ͳจ຺Ͱ ࢖ͬͯ΋Β͏͔ʁ ͲͷΑ͏ͳ ϏδϡΞϧ͕ ཧղ͠΍͘͢ɺ ૂͬͨײ৘Λ Ҿ͖ग़ͤΔ͔ʁ Ծઆཱͯͨ ໰୊ͱ՝୊͸ຊ౰ʹ ଘࡏ͢Δͷ͔ʁ ՝୊ʹରͯ͠ ιϦϡʔγϣϯ͸ ద੾ͦ͏͔ʁ ໰͍ʹର͢Δ౴͑Λಋ͘खஈͱͯ͠ख๏ΛνϣΠε ख๏΍ϑϨʔϜϫʔΫ͸໨తͰ͸ͳ͍ ૝ఆ௨Γʹ Ϣʔβʔ͸ ࢖͑Δ͔ʁ ײ͡Δ͔ʁ
28. 2.໰͍Λ ཱͯΔ 3.ߟ͑Δ 4.࣮ߦ͢Δ 1.ϑΥʔΧε Client Engineer Designer × × νʔϜͰऔΓ૊Ή
29. ຊ୊ ͜ͷΑ͏ͳϓϩηε΍औΓ૊Έ͸ ͲͷΑ͏ͳՁ஋͕͋Δͷ͔
30. σβΠϯతࢥߟΛ༻͍ͨϓϩηε͕ ΋ͨΒ͢ޮՌ 1.Ձ஋ͷߴ͍αʔϏεΛੜΈग़͠΍͘͢ͳΔ 2. ಇ͘͜ͱʹ޾ͤΛݟग़ͤΔΑ͏ʹͳΔ ↓ ࠓ೔఻͍͑ͨͷͬͪ͜ ↓
31. ਓͷ޾෱ͳঢ়ଶ͸ ʮϑϩʔʯͷதʹੜ·ΕΔ ϛϋΠɾνΫηϯτϛϋΠ ʢถ ৺ཧֶऀʣ “ ࣌Λ๨Εɺࣗ෼Λ๨Εͯ ͋Δ͜ͱʹͷΊΓࠐΉ ͜Ε͕ʮ޾ͤʯͱ͍͏͜ͱ”
32. ϑϩʔ ঢ়ଶ ߦಈΛ ৴͡Δ σβΠϯతࢥߟ΍ϓϩηε͸ ৴͡ΒΕΔҙٛΛݟग़͢͜ͱʹ໾ཱͭ
33. あなたの仕事は、あなたの⼈⽣において ⼤きな部分を占めるようになるだろう。 これに満⾜する唯⼀の⽅法は、 ⾃分のしている仕事が偉⼤なものだと信じることだ。                                 -スティーブ・ジョブズ-
34. 商売やものづくりは技術や効率はもちろん必要ですが それ以上に必要なのは意義なんじゃないかと私は思うんです。 「何のためにやるのか」ということです。                   -下町ロケット 佃航平-
35. 2.໰͍Λ ཱͯΔ 3.ߟ͑Δ 4.࣮ߦ͢Δ 1.ϑΥʔΧε
36. ҰਓͰ࢝ΊΒΕΔ σβΠϯతࢥߟΛ਎ʹ͚ͭΔ ΤΫααΠζ
37. 1. ୭ͷͲΜͳ໰୊ͱ՝୊Λղܾ͠Α͏ͱ͍ͯ͠Δͷ͔ʁ 2. ͦͷϢʔβʔ͸ࠓͲ͏΍ͬͯͦͷ໰୊Λରॲ͍ͯ͠Δͷ͔ʁ 3.ͦͷαʔϏε͸Ͳ͏΍ͬͯղܾ͠Α͏ͱ͍ͯ͠Δͷ͔ʁ 4. ͦͷιϦϡʔγϣϯ͸ͲΜͳՁ஋Λ΋ͨΒ͢ͷ͔ʁ 5. ͲͷΑ͏ʹརӹΛ͋͛Δͷ͔ʁ ͦͷ̍ ೔ৗͰ໨ʹ৮ΕͨαʔϏεʹʮ໰͍ʯΛͿ͚ͭͯΈΑ͏
38. ग़యɿࠤ໺জ඙ࢯϒϩάΑΓɹhttps://www.sanoakihiko.com/blog/branding/493.html
39. UI UX
40. UI UX ͲͪΒ΋UIɾUX ॏࢹ͢ΔՁ஋͕ҧ͏
41. ͲͪΒ΋UIɾUX ॏࢹ͢ΔՁ஋͕ҧ͏ ػೳతՁ஋ ৘ॹతՁ஋ ࣗݾ࣮ݱతՁ஋
42. ͦͷ̎ ࣗ෼ͷܞΘ͍ͬͯΔ࢓ࣄʹಉ༷ͷʮ໰͍ʯΛͿ͚ͭͯΈΑ͏
43. ͦͷ̏ ೔ৗྑ͔ͬͨݏͩͬͨܦݧΛ۷ΓԼ͛Α͏
44. 6up Sketches Titleɿ Nameɿ ΦʔτϩοΫΛൈ͚Δͱɺ ࣗಈͰߦ͖ઌ֊ͷϘλϯ͕఺౮ͨ͠ঢ়ଶ Ͱܴ͑ೖΕͯ͘ΕΔΤϨϕʔλʔ τΠϨͷྲྀ͠Ϙλϯɻʮ࠲ͬͨঢ়ଶʯͱ ʮཱͬͨঢ়ଶʯͲͪΒͷํ޲͔Β΋൓Ԡ ͯ͘͠ΕΔΑ͏ʹͳ͍ͬͯΔ αϯλ͞Μͷݱࡏ஍Λදࣔͯ͘͠ΕΔ GoogleMapɻࢠͲ΋ͱͷίϛϡχέʔ γϣϯָ͕͍͠΋ͷʹɻ ༣ૹͰσΟζχʔνέοτ͕ಧ͍ͨɻ ೔ຊ௨ӡײͰ͸ͳ͘ɺσΟζχʔσβΠ ϯͷ෧౵Ͱߦ͘લ͔Βؾ͕࣋ͪߴ·Δɻ όϨϯλΠϯʹ؁͡ΐͬͺ͍౾՛ࢠΛ΋ Β͏ɻνϣί͹͔ΓͷதͰɺԘͬؾ͕ཉ ͍࣌͠ʹ࠷దͩͬͨɻ ೔ʑͷخ͍͠Ωϟϓνϟ Nobuo Urata NewsPicksɻ ຖ೔ͷίϝϯτ͕Ϩϕϧʹͭͳ͕Δɻ NPσβΠφʔ͞Μ͔Β͍͍Ͷ΋Β͑ͨʂ
45. ͦͷ̏ ೔ৗྑ͔ͬͨݏͩͬͨܦݧΛ۷ΓԼ͛Α͏ ͦͷ̎ ࣗ෼ͷܞΘ͍ͬͯΔ࢓ࣄʹಉ༷ͷʮ໰͍ʯΛͿ͚ͭͯΈΑ͏ ͦͷ̍ ೔ৗͰ໨ʹ৮ΕͨαʔϏεʹʮ໰͍ʯΛͿ͚ͭͯΈΑ͏
46. もし私が世界を救うのに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.
47. ·ͣ͸αʔϏεΛͭ͘Δࢲͨͪࣗ਎͕ΠΩΠΩͱ ͦͯ͠ૉ੖Β͍͠αʔϏεͰᷓΕΔੈͷதΛ૑Γ·͠ΐ͏ ͦͷͨΊʹσβΠϯతࢥߟ͕օ͞Μͷ͓໾ʹཱͯ͹
48. Thank you