์šฉ์–ด 2

UI์˜ ๊ตฌ์กฐ์™€ ์š”์†Œ

์ž‘์—…์„ ํ•˜๋‹ค๋ณด๋ฉด ์„œ๋กœ ์–ธ์–ด๋ฅผ ์ดํ•ดํ•˜์ง€๋ชปํ•˜๊ฑฐ๋‚˜ ์–ด๋–ป๊ฒŒ ์„ค๋ช…์„ ํ•ด์•ผํ• ์ง€๋ชฐ๋ผ ๋‚œ๊ฐํ•œ ๊ฒฝ์šฐ๊ฐ€ ์žˆ๋‹ค. ๊ทธ๋ž˜์„œ ๊ทธ๋Ÿฐ ๋ฌธ์ œ๋ฅผ ์กฐ๊ธˆ์ด๋ผ๋„ ๋ณด์™„ ํ•˜๊ณ ์ž ํ•œ๋‹ค. ๋‚œ์ƒ์ฒ˜๋ฆ„ ๋ฐฉ๋ฌธํ•˜๋Š” ์›น์‚ฌ์ดํŠธ ๋˜๋Š” ๋ชจ๋ฐ”์ผ ์•ฑ์—์„œ๋„ ์•„๋งˆ ์—ฌ๋Ÿฌ๋ถ„์€ ์›ํ•˜๋Š” ์ •๋ณด๋ฅผ ์ฐพ์œผ๋ ค๋ฉด ์–ด๋””๋กœ ๊ฐ€์•ผํ• ์ง€ ๋Œ€๋žต ๊ฐ์ด ์˜ฌ๊ฒƒ์ด๋‹ค. ํ˜ธํ…”์˜ˆ์•ฝ ์•ฑ,์ปค๋จธ์Šค ์•ฑ, ๊ธˆ์œต ์•ฑ์ฒ˜๋Ÿผ ๊ฐ ์„œ๋น„์Šค ์ธก ๊ฐ€๋Šฅ์„ฑ์„ ๋ฉ˜ํƒˆ๋ชจ๋ธ(Mental Model) ์ด๋ผ๊ณ ํ•œ๋‹ค. ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์„ ์„ค๊ณ„ํ•˜๋Š”๊ฒƒ์€ ๋ฌด์—์„œ ์œ ๋ฅผ ๋งŒ๋“œ๋Š” ์ฐฝ์ž‘ ํ™œ๋™๊ณผ๋Š” ๋‹ค๋ฅด๋‹ค. (๋””์ž์ด๋„ˆ๋Š” ์˜ˆ์ˆ ๊ฐ€๊ฐ€ ์•„๋‹ˆ๋‹ค) ์‚ฌ๋žŒ๋“ค์—๊ฒŒ ์ต์ˆ™ํ•œ ๊ฒฝํ—˜์„ ํ†ตํ•ด ์ง๊ด€์„ฑ์„ ๋†’์—ฌ์•ผํ•œ๋‹ค. ๋งŒ์•ฝ ์ง€๋‚˜์น˜๊ฒŒ ์ฐฝ์˜์ ์ด๊ฑฐ๋‚˜ ๊ด€์Šต์„ ๋ฌด์‹œํ•˜๊ณ  UI๋ฅผ ๋””์ž์ธ ํ•œ๋‹ค๋ฉด ์‚ฌ์šฉ์ž๋Š” ์ด๋ฅผ ๋‚ฏ์„ค๊ฒŒ ์—ฌ๊ธธ ๊ฒƒ์ด๋‹ค. ์ด๋ฅผ '๋ฉ˜ํƒˆ ๋ชจ๋ธ ๋ถ€์กฐํ™” (Memtal Model Discordance)๊ฐ€ ์ผ์–ด๋‚ฌ๋‹ค'๊ณ ..

UI.UX ์ œ๋Œ€๋กœ ์ดํ•ดํ•˜๊ธฐ

์ฑ•ํ„ฐ 01. UI.UX ์ œ๋Œ€๋กœ ์ดํ•ดํ•˜๊ธฐUI: = visual desigen  UX: ์–ด๋–ค ์„œ๋น„์Šค์— ๊ด€๋ จ๋œ ์ƒํ˜ธ์ž‘์šฉ (๊ธฐ๋Šฅ์  or ๊ฐ์ •์ ) *๊ฐ์ •์ ์˜ ์š”์†Œ* 1. ๋ฒ ๊ฒฝ (๋ฐœ์ƒํ•œ ์‹œ๊ฐ„,์žฅ์†Œ ๊ฐ™์€ ๊ตฌ์ฒด์ ์ธ๊ฒฝํ—˜ ์‹œ๊ฐ์ ์ธ ์ƒ‰์ƒ/ํฐํŠธ/์‚ฌ์šฉ์ž์—๊ฒŒ ํ•„์š”ํ•œ์ •์ฑ…) 2. ์š”์ธ (ํ•ด๋‹น๋ฐฐ๊ฒฝ์œผ๋กœ ์–ด๋– ํ•œ ํ–‰๋™์„ํ‚ด) 3. ํ–‰๋™๋ฐฉ์‹ (์‚ฌ์šฉ์ž๊ธฐ ์ธ์‹ ํ›„ ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๊ฑฐ๋‚˜ ํŠน์ •ํ–‰์œ„๋ฅผ ํ•˜๋Š”๊ฒฝ์šฐ) 4.๋‚ด์ ์š•๊ตฌ (์‚ฌ์šฉ์ž๊ธฐ ํ•„์š”๋กœํ•ด์„œ ํ•˜๋Š”๋‚ด์ ์š•๊ตฌ) 5.์ •์„œ์  ๋ฐ˜์‘ (๋Œ€์ƒ์— ๋Œ€ํ•ด์„œ ๊ฐ–๋Š” ์ธ์ง€์ ,์ •์„œ์  ๋ฐ˜์‘) *์ข‹์€ UX๋ž€ ๋ฌด์—‡์ผ๊นŒ* 1. UX๋ฅผ ์ฐฝ์˜์ ์ธ ๊ด€์ ์œผ๋กœ๋งŒ ๋ฐ”๋ผ๋ณด๋ฉด ์˜คํžˆ๋ ค ์‚ฌ์šฉ์„ฑ์„ ๋–จ์–ด๋œจ๋ฆฌ๋Š” ๊ฒฝ์šฐ๊ฐ€ ๋ฐœ์ƒํ•œ๋‹ค. 2. ๋Œ€๋ถ€๋ถ„์˜ ์„œ๋น„์Šค์™€ ์ œํ’ˆ์€ ๊ด€์Šต์„ ๋ฐ”๋‹น์œผ๋กœ ๋””์ž์ธ ๋˜์–ด์žˆ๋‹ค.(ux์˜์—ญ์—์„œ ๊ด€์Šต์ด๋ž€ ์˜ค๋žœ์‹œ๊ฐ„ ์Œ“์•„์˜จ ์‚ฌ์šฉ์ž์˜ ํ–‰๋™ํŒจํ„ด์˜ ์ถ•์ ์ด๋‹ค.)..