Understanding UX Design Proces - UXデザインプロセスを理解する

UNDERSTANDING
 
UX DESIGN PROCESS
Mede by Takashi Sakamoto @bookslope

69σβΠϯϓϩηεΛཧղ͢Δ

View Slide

UNDERSTANDING UX DESIGN PROCESS
ࡔຊو࢙
@bookslope
εϚʔτϞϏϦςΟࣄۀਪਐࣨࣨ௕
 
৘ใઃܭɾ69σβΠϯ͕ઐ໳ྖҬ
ΦϯϥΠϯίϛϡχςΟӡӦ
 
دߘɾߨԋଟ਺
 
ஶ࡞ʰ*"γϯΩϯάʱͳͲ
౦ژࡏॅͷσβΠφʔͰ͢ɻσδλϧϓϩμΫτʹ͓͚Δʮ৘ใΞʔΩςΫνϟʯ
΍ʮ69σβΠϯʯͳͲΛֶͼɺݱࡏ͸ʮϞϏϦςΟʯ΍ʮ.BB4ʯʹ͓͚Δࣄۀ
։ൃɾαʔϏε։ൃʹܞΘ͍ͬͯ·͢ɻ

View Slide

೔࢈ࣗಈं υοπ
2017 2019
ϦϯΫε ωοτΠϠʔ 
άϧʔϓ
2000
2002
ύΠφοϓϧ 
Χϯύχʔ
ϰΠϩδοΫ
1999 1999
JDS
1997 2001
1995
େࡕ ౦ژ
2021
ݱࡏ
Career
άϥϑΟοΫ
 
σβΠφʔ
8FC
 
σβΠφʔ
8FC
 
σΟϨΫλʔ
σδλϧશൠ
 
69σβΠφʔ
ࣗಈं
 
69σβΠφʔ
ϞϏϦςΟࣄۀ
 
ίϯαϧɾऔࡐ
8FC
 
σΟϨΫλʔ
Πϯϋ΢ε

View Slide

ϙελʔ %51 σεΫτοϓ
8FC
εϚϗ
"QQ
ࣗಈं
).*
మಓ
.BB4
؍ޫ
4NBSU$JUZ
ύοέʔδ
Designing for …

View Slide

ࣄۀ։ൃࢧԉ ϝσΟΞ഑৴ࢧԉ
.BB4ؔ࿈ࣄۀͷاըɾఏҊ
84ϑΝγϦςʔγϣϯࢧԉ
σδλϧϓϩμΫτͷσβΠϯࢧԉ
χϡʔεαΠτʮϨεϙϯεʯ࿈ࡌத
औࡐ͔ΒࡱӨɾࣥච
ηϛφʔɾΠϕϯτͷاըɾߨԋ

View Slide

Journalist
ϝσΟΞ഑৴ࢧԉ
ϞϏϦςΟ࣮ূ࣮ݧͳͲͷऔࡐ
هऀɾΧϝϥɾϥΠςΟϯάͳͲ
#MaaSମݧه
by Response.JP

View Slide

by NISSAN ARIYA

View Slide

by Amazon
2011 2016
IAγϯΩϯά IA/UXϓϥΫςΟε UX x Biz Book

View Slide

69
γφϦΦ
ϖϧιφ
ϢʔβʔମݧΛࢦ͢ɻফඅऀͷମݧͱͯ͠ϚʔέςΟϯάͰ͸$9ͳͲ΋࢖ΘΕΔ͕
69Ͱ౷Ұ͢Δɻ·ͨͦͷऔΓ૊ΈΛࢦͯ͠69σβΠϯͱݺͿɻ
ͦͷαʔϏε΍ϓϩμΫτͷ໨తୡ੒·ͰͷεςοϓΛඳ͍ͨ΋ͷΛࢦ͢ɻར༻ঢ়گ
ΛετʔϦʔʢ෺ޠʣʹͯ͠఻͑Δ৔߹ʹɺίϚອը෩ʹͨ͠΋ͷ͕ଟ͍ɻ
Ϣʔβʔ૾Λ۩ମԽͨ͠΋ͷɻԾ૝ϢʔβʔͱݺͿ৔߹΋͋Δ͕ɺλʔήοτ૚ͱ͸ҟ
ͳΓɺಛఆͷਓΛ୊ࡐʹ࢖༻͢Δ͜ͱ͕ଟ͍ɻσϞάϥͷ΄͔Ձ஋؍΍՝୊ͳͲݴٴɻ
)$% ਓؒத৺ઃܭͷ͜ͱɻਓΛத৺ʹߟ͑ΒΕͨσβΠϯͷऔΓ૊ΈΛࢦ͢ɻԤभͰ͸
6$%ͱ΋ݺ͹ΕΔ͕)$%Ͱ౷Ұ͢Δɻ
*" ৘ใઃܭͷ͜ͱɻ৘ใΛ੔ཧ͠Ϣʔβʔʹ෼͔Γ΍͘͢఻͑ΔߦҝɺϢʔβʔ͕৘ใ
Λ୳͠΍͘͢͢ΔߦҝͳͲΛࢦ͢ɻ
$+.
ސ٬ͷߦಈΛδϟʔχʔʢཱྀʣʹݟཱͯͨϑϨʔϜϫʔΫͷ͜ͱɻ঎඼΍αʔϏεΛ
ೝ஌͠ɺڵຯΛ࣋ͪɺߪೖ΍ਃ͠ࠐΈʹ౸ୡ͢Δ·ͰͷߦಈΛਤࣜԽͨ͠΋ͷɻ

View Slide

INDEX
໨࣍
ΠϯϏδϒϧόϦϡʔ
σβΠϯϓϩηε
σβΠϯύλʔϯ
01.

02.

03.
ྲྀΕΛཧղ͢Δ
ݟ͑ͳ͍Ձ஋Λ஌Δ
൑அྗΛ਎ʹ͚ͭΔ

View Slide

INVISIBLE VALUE
01

View Slide

͍͍੡඼Ͱ΋ɺ͍͍ମݧͱ͸ݶΒͳ͍ɻ
Good UI Good UX

View Slide

Service Design
ϞϊͱαʔϏεͱ͕ผʑͰ͸ͳ͘ɺ
αʔϏεͷதʹϞϊؚ͕·Ε͓ͯ
ΓɺҰମԽͯ͠੾Γ཭ͤͳ͍ߏ଄Λ
αʔϏευϛφϯτϩδοΫͱݺ
Ϳɻ
Ϟϊ
αʔϏε
Ϟϊ αʔϏε
4%-4FSWJDF%PNJOBOU-PHJD
(%-(PPET%PNJOBOU-PHJD
by αʔϏεɾυϛφϯτɾϩδοΫͷൃ૝ͱԠ༻

View Slide

σβΠϯͱ͸ɺओޠ͕ࣗ෼Ͱ͸ͳ͍ɻ
఻͑Δ ఻ΘΔ

View Slide

About Design
σβΠϯͱ͸ɺ૬ख͕Ͳ͏تΜͰ΋Β
͑Δ͔Λߟ͑ɺܭը͢Δ͜ͱʹ΄͔
ͳΒͳ͍ɻ͔ͩΒͦ͜ɺ૬खΛΑ͘஌
ΓɺͲ͏تͿ͔Λߟ͑ɺ࣮ߦ͢Δ͜
ͱ͕େࣄɻ
by ৽ւ੣ @shinkaimakoto

View Slide

Cusomer Journey
ސ٬ͷߦಈΛδϟʔχʔʢཱྀʣʹݟཱ
ͯͨϑϨʔϜϫʔΫͱͯ͠ɺΧελ
ϚʔɾδϟʔχʔɾϚοϓΛ࡞੒͢Δ
৔߹͕͋Δɻ
঎඼΍αʔϏεΛೝ஌͔ΒɺڵຯΛ
࣋ͪɺߪೖ΍ਃ͠ࠐΈʹ౸ୡ͢Δ·
ͰͷߦಈΛਤࣜԽͨ͠΋ͷͰɺސ٬
ଆʢը໘্෦ʣͱϏδωεఏڙଆ
ʢը໘Լ෦ʣͱʹ෼͚ɺҰ࿈ͷମݧ
ʹԿ͕ى͖ɺԿ͕ඞཁ͔Λ၆ᛌͯ͠
ܭը͢Δɻ
by RaIL Europe Experience Map

View Slide

Outcome
Ұ࿈ͷମݧΛ၆ᛌ͢Δ͜ͱͰɺ͍ͭ
ͲΜͳͱ͖ʹͦͷσβΠϯʹ৮ΕΔ
ͨͷ͔ɺ·ͨɺͦͷ੒Ռʹ͸Ͳ͏
͍ͬͨ͜ͱ͕ߟ͑ΒΕΔͷ͔Λݟۃ
ΊΔࢳޱʹͭͳ͕ΔͨΊɺϚʔέ
ςΟϯάޮՌͱ߹Θͤͯ,1*Խʢ໨ඪ
Λ਺஋Խʣ͢Δ৔߹͕ଟ͍ɻ
ڵຯ
ೝ஌ ߦಈ ڞ༗
"55&/5*0/ */5&3&45 "$5*0/ 4)"3&
ݕࡧ
4&"3$)
Ͳ͔͜ΒΞΫηε͔ͨ͠ Ͳ͏͍͏ߦಈΛͱ͔ͬͨ

View Slide

Outcome
Ұ࿈ͷମݧΛ၆ᛌ͢Δ͜ͱͰɺ͍ͭ
ͲΜͳͱ͖ʹͦͷσβΠϯʹ৮ΕΔ
ͨͷ͔ɺ·ͨɺͦͷ੒Ռʹ͸Ͳ͏
͍ͬͨ͜ͱ͕ߟ͑ΒΕΔͷ͔Λݟۃ
ΊΔࢳޱʹͭͳ͕ΔͨΊɺϚʔέ
ςΟϯάޮՌͱ߹Θͤͯ,1*Խʢ໨ඪ
Λ਺஋Խʣ͢Δ৔߹͕ଟ͍ɻ
ڵຯ
ೝ஌ ໨త ڞ༗
"55&/5*0/ */5&3&45 0#+&$5*7& 4)"3&
खஈ
"$$&44

View Slide

Outcome
ͨͱ͑͹ɺཱྀߦ༧໿αΠτͷσβΠϯ
Ͱ͋Ε͹ɺ࣮ࡍʹཱྀߦʹߦ͘·͑ʹ
ޱίϛ౳Λݟͯڵຯؔ৺ΛߴΊɺ༧
໿͠ʹདྷΒΕ·͢ɻ·ͨɺͦΕ͸༧໿
͕໨తͱݴ͏ΑΓɺཱྀߦʹߦͨ͘Ί
ͷखஈͱͯ͠༧໿Λ͢Δͱ͍͏͜ͱ
ʹͳΓ·͢ɻ
ޱίϛ
ϝσΟΞͰ஌Δ ཱྀߦʹߦ͘ ϨϏϡʔ
ཱྀߦ༧໿
αΠτ
ڵຯ
ೝ஌ ڞ༗
"55&/5*0/ */5&3&45 4)"3&
໨త
0#+&$5*7&
खஈ
"$$&44

View Slide

INVISIBLE VALUE
σβΠϯϓϩηεͱ͸ɺσβΠϯͷ࡞
੒ʢΞ΢τϓοτʣ͚ͩΛࢦ͢ͷͰ͸
ͳ͘ɺࣄલௐࠪ΍ઃܭஈ֊ΛܦͯΞ
΢τϓοτ͢Δ·ͰͷҰ࿈ͷྲྀΕؚ͕
·Ε͍ͯΔɻͦͷϓϩμΫτ΍αʔϏ
ε͕࢖ΘΕΔঢ়گΛཧղ͔ͯ͠Βσβ
ΠϯΛਐΊΔඞཁ͕͋Δɻ
ϞϊͱαʔϏε͸੾Γ཭ͤͳ͍
σβΠϯ͸ɺࣗ෼͕ओޠͰ͸ͳ͍
Ұ࿈ͷମݧΛ၆ᛌͯ͠ݟΔํ๏Λ஌Δ

View Slide

ྲྀΕΛཧղ͢Δ
DESIGN PROCESS
02

View Slide

5 LAYERS
++(ͷʮ69Λߏ੒͢Δͭͷஈ֊ʯͰ
ߟ͑Δͱɺ༏ΕͨσβΠφʔ͸͜ΕΒ
ͷ޻ఔ͢΂ͯΛ͍ͯ͠Δ͜ͱ͕Θ͔
Δɻ
σβΠϯ࡞ۀͱ͸ද૚෦෼͚ͩΛࢦ
͢͜ͱͰ͸ͳ͍ɻ
ཁ݅
ߏ଄
ࠎ֨
ද૚
ઓུ
ίϯςπɾػೳ
৘ใΞʔΩςΫνϟ
ΠϯλϥΫγϣϯσβΠϯ
ϏδϡΞϧσβΠϯ
χʔζɾ໨త
By Jesse James Garrett “Elements of User Experience”

View Slide

Design Outputs
σβΠϯͷ޻ఔʹ͸ɺ࡞ۀ࣌ؒʢΞ
065165ʣͷ΄͔ʹɺೝࣝ͢Δ
*/165ͱɺࢥߟ͢Δ5)*/,ؚ͕·Ε
Δ͜ͱΛ๨Ε͕ͪɻ
*/165ʹ͸ɺࣄલௐؚ͕ࠪ·Εɺ
5)*/,ʹ͸ɺͲͷΑ͏ʹσβΠϯ͢
Δͷ͔ͱ͍ͬͨܭըؚ͕·ΕΔɻ

23
σβΠϯͷ࡞੒
5)*/,
065165
*/165
ઃܭ
ௐࠪ

View Slide

Double Diamond
μϒϧμΠϠϞϯυ͸ɺ೥ʹӳ
ࠃσβΠϯڠٞձͰॳΊͯಋೖ͞Ε
ͨɺͭͷμΠϠϞϯυΛඳ͘Α͏ʹ
ൃࢄͱऩଋΛߦ͏՝୊ղܾํ๏ͷͻ
ͱͭɻ
ਖ਼͍͠໰୊Λݟ͚ͭΔ ਖ਼͍͠ղܾΛݟ͚ͭΔ
୳ࡧ ఆٛ ల։ ఏڙ
%*4$07&3 %&'*/& %&7&-01 %&-*7&3
ൃࢄ ऩଋ ऩଋ
ൃࢄ

View Slide

UX Research
σβΠϯ޻ఔΑΓલͷஈ֊ʹ͓͍ͯɺ
Ќ൛ϓϩτλΠϐϯάͰɺ࣮ࡍʹυ
ϥΠόʔΛ؍࡯͢Δ69ϦαʔνΛ࣮
ࢪͨ͠ྫʢ6CFSʣ
σβΠϯ
اը ࣮ݧ
։ൃ
By Grace Vorreuter and new driver research participant in car testing in San Francisco

View Slide

HCD Process
*40ʢ+*4;ʣΠϯλϥ
ΫςΟϒγεςϜͷਓؒத৺ઃܭϓϩ
ηεΛࢦ͢ɻ
)$%ͷਐΊํͷجຊ͸ɺ੡඼ͷߏ૝
ஈ֊͔Βର৅ϢʔβʔͱͦͷཁٻΛ໌
֬ʹͯ͠ɺཁٻʹ߹ͬͨ΋ͷΛઃܭ
͠ɺຬ଍౓߹͍ΛධՁ͢Δ͜ͱͰ͢ɻ
Ϣʔβʔͷཁٻ͕ຬͨ͞ΕΔ·Ͱɺ͜
ΕΛ܁Γฦ͠·͢ɻ
)$%ϓϩηε
σβΠϯͷ࡞੒
ཁٻࣄ߲ͷ໌֬Խ
ධՁ
˞)$%)VNBO$FOUFSFE%FTJHOͷུশ
ར༻ঢ়گͷཧղ
)$%ͷඞཁੑͷಛఆ

26
1
2
3
4

View Slide

Usage Condition
ར༻ঢ়گͷཧղʕʕͨͱ͑͹ɺ࡭ࢠ
ͷσβΠϯΛ͢Δ৔߹ɺͲ͜ʹஔ͔
ΕΔ༧ఆ͔ ୭޲͚ͷ΋ͷ͔ͳͲɺࣄ
લʹ֬ೝ͓ͯ͘͜͠ͱͰ੒Ռʹͭͳ
͕Γ΍͍͢σβΠϯʹ͢Δ͜ͱ͕Ͱ
͖·͢ɻ
λΠτϧ͕ಡΊΔΑ͏ٯ͞·ʹஔ͔Ε͍ͯΔ༷ࢠ

View Slide

Usage Condition
ར༻ঢ়گͷཧղʕʕͨͱ͑͹ɺ࡭ࢠ
ͷσβΠϯΛ͢Δ৔߹ɺͲ͜ʹஔ͔
ΕΔ༧ఆ͔ ୭޲͚ͷ΋ͷ͔ͳͲɺࣄ
લʹ֬ೝ͓ͯ͘͜͠ͱͰ੒Ռʹͭͳ
͕Γ΍͍͢σβΠϯʹ͢Δ͜ͱ͕Ͱ
͖·͢ɻ
Ӻߏ಺
ॅ୐৘ใࢽ
୅உੑ
λΠτϧ͕ಡΊΔΑ͏ٯ͞·ʹஔ͔Ε͍ͯΔ༷ࢠ

View Slide

IA
ॻ੶ʮ৘ใΞʔΩςΫνϟʯͰ͸ɺ
ྑ͍৘ใΞʔΩςΫνϟ͸ʮϢʔ
βʔʯʮίϯςϯπʯʮίϯςΩετʯ
ͷͭΛόϥϯεΑ͘ߟྀ͍ͯ͠Δ
΋ͷͱ͍ͯ͠·͢ɻϢʔβʔͷཱ৔΍
จ຺Λߟྀͯ͠ίϯςϯπΛఏࣔ͢
Δ͔Βͦ͜ɺ͸͡Ίͯ৘ใ͸׆͖ͨ΋
ͷʹͳΓ·͢ɻ
୭ʹ
USER
ͲͷΑ͏ʹ
CONTEXT
ԿΛ
CONTENT

View Slide

Design Thinking
ʮσβΠϯࢥߟʯͱ͸ɺσβΠφʔ΍
ΫϦΤΠλʔ͕ۀ຿Ͱ࢖͏ࢥߟϓϩη
εΛ׆༻͠ɺલྫͷͳ͍՝୊΍ະ஌
ͷ໰୊ʹରͯ͠࠷దͳղܾΛਤΔͨ
Ίͷࢥߟ๏ͩɻ
໰୊ఏٞ
ڞײ
ࢼ࡞
ςετ
&.1"5):
%&'*/&
130505:1&
5&45
ऩଋ ൃࢄ
૑଄
*%&"5&

View Slide

By Designing from the Car: Why Context Matter

View Slide

DESIGN PROCESS
σβΠϯϓϩηεͱ͸ɺσβΠϯͷ࡞
੒ʢΞ΢τϓοτʣ͚ͩΛࢦ͢ͷͰ͸
ͳ͘ɺࣄલௐࠪ΍ઃܭஈ֊ΛܦͯΞ
΢τϓοτ͢Δ·ͰͷҰ࿈ͷྲྀΕؚ͕
·Ε͍ͯΔɻͦͷϓϩμΫτ΍αʔϏ
ε͕࢖ΘΕΔঢ়گΛཧղ͔ͯ͠Βσβ
ΠϯΛਐΊΔඞཁ͕͋Δɻ
σβΠϯ࡞੒͚͕ͩσβΠϯͰ͸ͳ͍
Ξ΢τϓοτલͷ޻ఔʢௐࠪͳͲʣ͕ॏཁ
ར༻ঢ়گΛཧղ͔ͯ͠ΒਐΊΔ

View Slide

DESIGN PATTERNS
03

View Slide

Design Literacy
σβΠϯϦςϥγʔͱ͸ɺओʹσβΠ
ϯͷ଄ܗཧ࿦ɺ੍࡞ͷϓϩηεɺྺ
࢙ɾจԽʹର͢Δ஌ࣝͳͲΛࢦ͢ઐ
໳༻ޠɻ
 
ۙ೥͸ɺސ٬ମݧʹ͓͍ͯσβΠϯ͕
ॏཁࢹ͞Ε͍ͯΔྲྀΕΛड͚ɺσβΠ
ϯϦςϥγʔΛϕʔεʹͨ͠൑அྗ͕
ٻΊΒΕ͍ͯ·͢ɻ
σβΠφʔ͚ͩͰ͸ͳ͘ɺσβΠϯʹ
ؔΘΔਓ͕࣋ͭ΂͖εΩϧͱ͍͑·
͢ɻ
σβΠϯʹ͓͚Δ൑அྗ
ͨͩͷࢥ͍͜Έ
σβΠϯϦςϥγʔ
ೝ஌όΠΞε

View Slide

Mind Control
ϚΠϯυίϯτϩʔϧͱ͸ɺૢ࡞ऀ͔
ΒͷӨڹ΍ڧ੍Λؾ͔ͮΕͳ͍͏ͪ
ʹɺଞऀͷਫ਼ਆաఔ΍ߦಈɺਫ਼ਆঢ়
ଶΛૢ࡞ͯ͠ɺૢ࡞ऀͷ౎߹ʹ߹Θͤ
ͨಛఆͷҙࢥܾఆɾߦಈ΁ͱ༠ಋ͢
Δ͜ͱɾٕज़ɾ֓೦Ͱ͋Δɻ΢ΟΩ
ϖσΟΞ
Credit: ASSOCIATED PRESS

View Slide

Horai EMot my route
LUUP aimo
WHILL docomo bike share
Multimodal
Single-mode
JR East
JR East
WILLERS
Whim
ANA
Uber
Special Public

View Slide

Mobbin
By Mobbin

View Slide

Dark Pattern
By Amazon

View Slide

Semi
Roadstar
Model S
Model 3
By Tesla

View Slide

LAYOUT PATTERN
ϞϏϦςΟʢࣗಈंʣͷ).*σβΠϯ
ͷτϨϯυͱͯͭ͠ͷϨΠΞ΢τύ
λʔϯ͕͋Γ·͢ɻ
/*0 1PMFTUBS %ZTPOʜ
#:50/ 40/: )0/%"ʜ
Meter + Infortainment
Infortainment
Meter
ηύϨʔτܕ
ίϯόΠϯܕ

View Slide

Infortainment
UI/UX DESIGN FOR MOBILITY
Meter
By Polestar2

View Slide

By Android Auto

View Slide

Meter + Infortainment
Side Monitor
Side Monitor
By SONY VISION

View Slide

By Apple CarPlay

View Slide

DESIGN PATTERNS
σβΠϯύλʔϯ͸Ͳ͜ʹͰ΋ଘࡏ͢
Δ͕ɺݟա͢͝ͱ͙͢ʹݹष͍஌ࣝ
ʹมΘͬͯ͠·͏ɻৗʹΞοϓσʔτ
͢Δ஌ࣝͷҰͭͱͯ͠ɺ·ͨσβΠϯ
Ϧςϥγʔͱͯ͠਎ʹ͚ͭΔΑ͏৺͕
͚Δɻ
σβΠϯͷ൑அྗσβΠϯϦςϥγʔ
ύλʔϯΛ஌ࣝͱͯ͠਎ʹ͚ͭΔ
ύλʔϯ͸มԽ͠Ξοϓσʔτ͞ΕΔ

View Slide

SUMMARY
࣭͝໰΍͝ҙݟͳͲ͍͟͝·͔͢
΋͋͠Ε͹ɺͥͻΞϯέʔτͷ΄͏
ʹ΋͝هೖ͍ͩ͘͞ɻ
ΠϯϏδϒϧόϦϡʔ
σβΠϯϓϩηε
σβΠϯύλʔϯ
ྲྀΕΛཧղ͢Δ

View Slide

͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠
THANKS FOR YOUR ATTENTION!
FIN

View Slide

͜ͷϛχϫʔΫΛ͓ࢼ͍ͩ͘͠͞ɻ
LET’S TRY with WORK SHEETS
MINI WORK

View Slide

Good UI Good UX
A B
Work Sheet #1
ݟ͑ͳ͍Ձ஋Λ஌ΔͨΊʹ஌͓ͬͯ
͍ͯ΄͍͜͠ͱΛͭ͋͛·ͨ͠ɻ
఻͑Δ ఻ΘΔ
C D

View Slide

Work Sheet #2
*40ʢ+*4;ʣΠϯλϥ
ηεΛࢦ͢ɻ
ΕΛ܁Γฦ͠·͢ɻ
)$%ϓϩηε
σβΠϯͷ࡞੒
ཁٻࣄ߲ͷ໌֬Խ
ධՁ
ར༻ঢ়گͷཧղ

3
1
2
3
4
E

View Slide

Work Sheet #3
ʮ৘ใΞʔΩςΫνϟʯͰ͸ɺྑ͍
৘ใΞʔΩςΫνϟ͸ʮɹɹɹʯ
ʮɹɹɹʯʮɹɹɹʯͷͭΛόϥ
ϯεΑ͘ߟྀ͍ͯ͠Δ΋ͷͱ͍ͯ͠·
͢ɻϢʔβʔͷཱ৔΍จ຺Λߟྀͯ͠
ίϯςϯπΛఏࣔ͢Δ͔Βͦ͜ɺ͸͡
Ίͯ৘ใ͸׆͖ͨ΋ͷʹͳΓ·͢ɻ
H
G
F
F
G H

View Slide

Work Sheet #4
ͨͱ͑͹ɺ͋ͳ͕ͨؔΘΒΕ͍ͯΔ
σβΠϯର৅෺Λʮɹɹɹʯʹهೖ
͍͖ͨͩɺʮɹɹɹʯΛߟ͑ͯΈΔ͜
ͱͰɺͳʹΛߟྀ͢Ε͹Α͍͔ͷࢳ
ޱ͕ݟ͔ͭΔ͸ͣͰ͢ɻͦͷຊདྷͷ໨
తʹͭͳ͕ΔͨΊͷσβΠϯΛ͍ͯ͠
Δ͜ͱΛ๨Εͯ͸͍͚·ͤΜɻ
ڵຯ
ೝ஌ ڞ༗
"55&/5*0/ */5&3&45 4)"3&
໨త
0#+&$5*7&
खஈ
"$$&44
ޱίϛ
ϝσΟΞͰ஌Δ ϨϏϡʔ
I
J
J
I
͋ͳͨͷ
σβΠϯ
ର৅෺
Ͳ͏͍͏ߦಈΛͱ͔ͬͨ
Ͳ͔͜ΒΞΫηε͔ͨ͠

View Slide

Good UI Good UX
A B
Work Sheet #1 Answer
ݟ͑ͳ͍Ձ஋Λ஌ΔͨΊʹ஌͓ͬͯ
͍ͯ΄͍͜͠ͱΛͭ͋͛·ͨ͠ɻ
఻͑Δ ఻ΘΔ
C D

View Slide

*40ʢ+*4;ʣΠϯλϥ
ηεΛࢦ͢ɻ
ΕΛ܁Γฦ͠·͢ɻ
)$%ϓϩηε
σβΠϯͷ࡞੒
ཁٻࣄ߲ͷ໌֬Խ
ධՁ
ར༻ঢ়گͷཧղ

7
1
2
3
4
ར༻ঢ়گͷཧղ
E

View Slide

ʮ৘ใΞʔΩςΫνϟʯͰ͸ɺྑ͍
৘ใΞʔΩςΫνϟ͸ʮɹɹɹʯ
ʮɹɹɹʯʮɹɹɹʯͷͭΛόϥ
ϯεΑ͘ߟྀ͍ͯ͠Δ΋ͷͱ͍ͯ͠·
͢ɻϢʔβʔͷཱ৔΍จ຺Λߟྀͯ͠
ίϯςϯπΛఏࣔ͢Δ͔Βͦ͜ɺ͸͡
Ίͯ৘ใ͸׆͖ͨ΋ͷʹͳΓ·͢ɻ
୭ʹ
USER
ͲͷΑ͏ʹ
CONTEXT
ԿΛ
CONTENT
H
G
F
F
G H

View Slide

ͨͱ͑͹ɺ͋ͳ͕ͨؔΘΒΕ͍ͯΔ
σβΠϯର৅෺Λʮɹɹɹʯʹهೖ
͍͖ͨͩɺʮɹɹɹʯΛߟ͑ͯΈΔ͜
ͱͰɺͳʹΛߟྀ͢Ε͹Α͍͔ͷࢳ
ޱ͕ݟ͔ͭΔ͸ͣͰ͢ɻͦͷຊདྷͷ໨
తʹͭͳ͕ΔͨΊͷσβΠϯΛ͍ͯ͠
Δ͜ͱΛ๨Εͯ͸͍͚·ͤΜɻ
ڵຯ
ೝ஌ ڞ༗
"55&/5*0/ */5&3&45 4)"3&
ग़͔͚Δ
ं
໨త
0#+&$5*7&
खஈ
"$$&44
ޱίϛ
ϝσΟΞͰ஌Δ ϨϏϡʔ
͋ͳͨͷ
σβΠϯ
ର৅෺
I
J
J
I

View Slide

Understanding UX Design Proces - UXデザインプロセスを理解する

Understanding UX Design Proces - UXデザインプロセスを理解する

bookslope

More Decks by bookslope

Other Decks in Design

Featured

Transcript