2022. 3. 12. 23:43ใ๐ค UXUI/UI ๋ฐฉ๋ฒ๋ก
์ผ๋ง ์ ๋์์ธ์์คํ ์๋ฆฌ์ฆ๋ฅผ ๋ค ๋ง์น๊ณ ๋์
๋์์จ ์๋ก์ด UIUX ๋ฐฉ๋ฒ๋ก ์๋ฆฌ์ฆ!
์ด๋ฒ ์๋ฆฌ์ฆ์์๋ User Flow์ ๋ํด ์์๋ณด๋ ค ํ๋ค.
User Flow๋ ์ด๋ ค์ด ๊ฐ๋ ์ด ์๋ ๊ฒ๋ ์๋๊ณ
์์ํ๊ธฐ ์ด๋ ต์ง๋ ์์์ ๋น๊ต์ ํ ๋งํ๋ค.
๊ทธ๋๋ ์ ๋ง ๋ง์ ์นผ๋ผ์ ๋ค์ ธ๋ณด๋ฉฐ ํผ์
์ ๋ฆฌํด๋ณธ ๋ด์ฉ๋ค์ ๊ฐ๊ณตํด ์ฌ๋ ค๋ณด๋ ค๊ณ ํ๋ค.
๐ฌ User Flow๋ ์ธ์ ์์ํ๋ฉด ๋ ๊น?
๋ด๊ฐ ์ฒ์์ User Flow๋ผ๋ ๊ฐ๋ ์ ์ ํ๊ณ ๋ ๋ค, ๋ ์ค๋ฅธ ์๊ฐ์ด์๋ค. User Flow๋ ์ธ์ ์์ํ๋ ๊ฒ์ด ์ข์๊น? ๋ง์ฝ ๋ด๊ฐ ์์ด๋์ด ๊ธฐํ๋ถํฐ ๋์์ธ ์์ฑ๊น์ง ์ฃผ๋ํ๋ ๊ฐ์ธ ํ๋ก์ ํธ๋ผ๋ฉด, ์๋น์ค์ ๊ดํ ๋ด์ฉ๋ค์ ๋ชจ๋ ์ ํ ํ ๋๋ต์ ์ธ ๋ฉ์ธ ํ๋ฉด ๊ตฌ์ฑ๊ณผ ํจ๊ป ์์ํ๋ ๊ฒ์ด ์ข๋ค. ์ ์ ํ๋ก์ฐ๋ ๊ธฐ์ด OF ๊ธฐ์ด์ด๊ธฐ ๋๋ฌธ์ ์ด๊ธฐ ๋จ๊ณ์ ์์ํด์ผ ํ๋ค. ๋ง์ฝ์ ํ ์์ ์ผ๋ก ์ด๋ฃจ์ด์ง๋ค๋ฉด, ๋ธ๋๋ฉ์ด ์ด๋์ ๋ ๊ตฌ์๋ ํ์ ์งํํ๋ ๊ฒ์ด ์ข๊ฒ ๋ค.
๐ User Flow์ ํท๊ฐ๋ฆฌ๋ ๊ฐ๋ ๋ค ...
์ ์ ํ๋ก์ฐ๊ฐ ๋ญ์ง์ ๋ํด ์์๊ฐ๊ธฐ ์ํด์๋ ๋น์ทํ ๊ฐ๋ ๋ค๊ณผ ๊ตฌ๋ถํ๋ ๊ฒ์ด ํ์๊ฒ ๋ค. ์๋ง ์ ์ ํ๋ก์ฐ๋ฅผ ์ด์ ๋ง ์๊ฒ ๋์๋ค๋ฉด ์์ด์ดํ๋ ์, ํ๋กํ ํ์ , ์ฌ์ดํธ๋งต, ์ ๋๋งต์ ๊ดํ ๊ฐ๋ ์ ๋ค์ด๋ดค๊ฑฐ๋ ๊ณง ๋ค์ด๋ณผ ์์ ์ผ ๊ฒ์ด๋ค. ํนํ ์์ด์ดํ๋ ์๊ณผ ์ ์ ํ๋ก์ฐ๋ ํท๊ฐ๋ฆฌ๋ ๊ฐ๋ ์ด๊ธฐ ๋๋ฌธ์ ์ฌ๊ธฐ์ ํ์คํ ์ ๋ฆฝํ๊ณ ์ง๋๊ฐ์ผ ๋์ค์ ํท๊ฐ๋ฆฌ์ง ์๋๋ค.
๐ ์์ด์ดํ๋ ์์ด๋ : ํ ํ๋ฉด ๋ด์์ ์ด๋ค ๋ถ๋ถ์ด ์ด๋ป๊ฒ ์ฑ์์ ธ์ผ ํ ์ง์ ์ด์ ์ ๋ ํ๋ฉด ๊ธฐํ
๐ ์ ์ ํ๋ก์ฐ๋ : ์ฌ์ฉ์๊ฐ ํด๋น ํ๋ฉด์์ ์ด๋๋ก ๋์ด๊ฐ ๊ฒ์ธ์ง ์์ธกํ๋ฉฐ ์ค๊ณํ๋ ํ๋ฉด ๊ธฐํ
๊ทธ๋ฌ๋๊น ์์ด์ดํ๋ ์์ UI์ ๊ฐ๊น์ด ๊ธฐํ์ด๊ณ , ์ ์ ํ๋ก์ฐ๋ UX์ ๊ฐ๊น์ด ๊ธฐํ์ด๋ผ๊ณ ์๊ฐํ๋ฉด ์ฌ์ธ ๊ฒ์ด๋ค.
์ ์์๊ฐ ๋ฐ๋ก ์์ด์ดํ๋ ์์ด๋ค. ์์ด์ดํ๋ ์์ ์ด๋์ ์ด๋ฏธ์ง๊ฐ ๋ฐฐ์น๋์ด์ผ ํ๋ฉฐ, ์ด๋์ ๊ธ์ด ์์ด์ผ ํ๋์ง๋ฅผ ๊ตฌ์ฑํ๊ณ ๋ธ๋ก ๋ฃ๋ฏ์ด ๊ตฌ์ฑ์์๋ฅผ ๋ฃ์ด๋ณด๋ ๊ฒ์ด๋ค. ์ธํฐํ์ด์ค์ ๋ง์ถฐ์ก๊ธฐ ๋๋ฌธ์ UI์ ๊ฐ๊น์ด ๊ฒ์ด๋ค. ์์ด์ดํ๋ ์์ ๋ณดํต ์ ์ ํ๋ก์ฐ๋ฅผ ํ๊ธฐ ์ ์ด๋ ํ๊ณ ๋ ํ์ ๋ฐ๋ก ์์ํ๊ฒ ๋๋ค. ์์ด์ดํ๋ ์๋ ๋์ค์ ๋ค๋ฃฐ ๊ฐ๋ ์ด๊ธด ํ์ง๋ง, ๋ฐ๋ก ๋ฐฐ์ธ ๊ฐ๋ ์ ์๊ณ UI ๋ ํผ๋ฐ์ค๋ฅผ ๋ง์ด ์ฐพ์๋ณด๋ฉฐ ์ค์ค๋ก ๋น์ฃผ์ผ์ ์ผ๋ก ์์ UI, ์ฌ์ฉ์๊ฐ ํธํ UI๋ฅผ ๊ตฌ์ํด ๋๊ฐ์ผ ํ๊ธฐ ๋๋ฌธ์ ์ธ์ ๋ค๋ฃฐ์ง๋ ๋ชจ๋ฅด๊ฒ ๋ค.
๋ฐ๋ฉด ์ ์ ํ๋ก์ฐ๋ ์์ด์ดํ๋ ์๊ณผ๋ ๋ฌ๋ฆฌ ์ฌ๋ฌ ๊ตฌ์ฒด์ ์ธ ์ค๋ช ๊ณผ ์ ๋ชฉ๋ค์ด ๋ฐ๋ผ ๋ถ๋๋ค. ์๋ํ๋ฉด ์ฌ์ฉ์๊ฐ ์ฒซ ๋ฒ์งธ ํ๋ฉด์์ ์ด๋ค ํ๋์ ํ ๊ฒ์ธ์ง, ๊ทธ ํ๋์ ํ๊ณ ๋๋ฉด ์ด๋ค ํ์ด์ง์ ํ๋์ผ๋ก ๋์ด๊ฐ ๊ฒ์ธ์ง๋ฅผ ์์์ ๋ฐ๋ผ ๋ฐฐ์นํ๊ธฐ ๋๋ฌธ์ด๋ค. ์ ์ด๋ฏธ์ง์์ Step1์ผ๋ก ์ ์ ๋ ์ฐ์ปด ์คํฌ๋ฆฐ์ ์ง์ ํ๋ค. ๊ทธ๋ฆฌ๊ณ ์๋ ๋ก๊ทธ์ธ ๋ฒํผ์ด ์๋ค. ๊ทธ๋ ๋ค๋ฉด ์ ์ ๋ ๊ทธ ๋ก๊ทธ์ธ ๋ฒํผ์ ๋๋ฅผ ๊ฒ์ด๋ค. Step2์์๋ ์ ์ ๊ฐ ์์ ๋ก๊ทธ์ธ์ ํ๋ค. ๊ทธ๋ผ Step3์์๋ ์ ์ ๊ฐ ๋๋์ด ํํ๋ฉด์ผ๋ก ์ง์ ํ๊ฒ ๋์๋ค. ์ด๋ฐ ์ผ๋ จ์ ํ๋ฆ์ Register for product๋ผ๊ณ ์ด๋ฆ ๋ถ์ธ ๊ฒ์ด๋ค. ์ฌ์ฉ์์ ํ๋๊ณผ ์์ง์์ ์ง์คํ์ฌ ๊ตฌ์ฑํ๊ธฐ ๋๋ฌธ์ UI๋ณด๋ค๋ UX์ ๋ ์ง์ค๋์ด ์๋ ๊ธฐํ์ด๋ค.
๐ ์ฌ์ดํธ๋งต : ์ฌ์ดํธ๋งต์ ํ ํ๋ฉด์ ์ด๋ค ๋ฒํผ์ด ์๋์ง ๊ฐ๋จํ๊ฒ ๋ณด์ฌ์ฃผ๋ ์ง๋(์งํ)์ด๋ค. ๋น์ฅ์ ์ ํ์ ์๋ค.
๐ ์ ๋๋งต : ์ ์ ์ ๊ฒฝํ์ ํ๋ฆ์ ๋ฐ๋ผ ๊ธฐ๋กํ ์ง๋์ด๋ค. ์ง๊ธ์ ๊ด๊ณ๊ฐ ์์ผ๋ ๋์ค์ ๋ ์์๋ณด๋๋ก ํ์.
๐ User Flow์ ๊ตฌ์ฑ์์
์ด์ ์ ์ ํ๋ก์ฐ์ ๋ํด ๋๋ต ๊ฐ์ด ์กํ..์๊น? ์ ์ ํ๋ก์ฐ์ ๊ตฌ์ฑ์์๋ ๋๊ฐ์ง์ด๋ค.
1. User Goal : ๋ชฉํ ์ค์
2. Task Flow : ์ ์ ์ ํ๋ ํ๋ฆ
๊ทธ๋ฌ๋๊น ์ ์ ๊ฐ ์ด๋ ํ ๋ชฉํ๋ฅผ ๊ฐ๊ณ ์๊ณ , ๊ทธ ๋ชฉํ๋ฅผ ์ํด ์ด๋ ํ ๊ณผ์ ์ ๊ฑฐ์น๋์ง๋ฅผ ๋ํ๋ธ ๊ฒ์ด ์ ์ ํ๋ก์ฐ์ธ ๊ฒ์ด๋ค.
๋ค๋ง ์ ์ ํ๋ก์ฐ๋ฅผ ๋ง๋ค ๋์ ๊ฒฝ๋ก๊ฐ 3๊ฐ๊ฐ ๋์ด๊ฐ๋ฉด ์ ๋๋ค. ๊ฒฝ๋ก๊ฐ ๋๋ฌด ๋ง๋ค๋ฉด ์์ ๋ถ๋ฆฌํด์ ์๋ก์ด ๋ชฉํ๋ก ๋๊ธฐ๋ ๊ฒ์ด ์ข๋ค. ์ ์ ํ๋ก์ฐ๋ ํญ์ ๊ฐ๊ฒฐํ๊ฒ ์ ๋ฆฌ๋์ด์ผ ํ๋ค. ๋ํ ์ ์ ํ๋ก์ฐ๋ ์ ๋ณด๊ฐ ๊ตฌ์ฒด์ ์ด์ด์ผ ํ๋ค. ์ ์ ๊ฐ ์ ํํ ์ด๋ค ํ๋์ ํ๋์ง๋ฅผ ๊ธฐ๋กํด์ผ ํ๊ณ , ๊ทธ ๊ฒฐ๊ณผ๊ฐ ์ ํํ ๋ฌด์์ธ์ง ์์ ํด์ผ ํ๋ค. ์ ์ ํ๋ก์ฐ๋ ์ฌ์ฉ์์ ํ๋ ํ๋ฆ์ ๊ตฌ์ฒด์ ์ผ๋ก ์์ํด์ผ ํ๋ฏ๋ก ์ธ์ฌํ๊ฒ ์์ ํด์ผ ํ๋ค.
1. ์ ์ ์ ๋ชฉํ๊ฐ ๋ฌด์์ธ๊ฐ?
2. ์ ์ ๊ฐ ๋ชฉํ๋ฅผ ์ํด ์ด๋ค ์์ง์์ ๋ณด์ด๋๊ฐ?
๋ค์ ํฌ์คํ ์์๋ ์ ์ ํ๋ก์ฐ์์ ๋์น์ง ๋ง์์ผ ํ
์ค์ํ ์ ์ ์์๋ณด๊ณ , ์ค์ ๋ก ๋ด๊ฐ ์ ์ ํ๋ก์ฐ๋ฅผ
์ด๋ป๊ฒ ๊ตฌ์ถํ๋์ง ์ฌ๋ก๋ฅผ ํตํด ๊ตฌ์ฒด์ ์ผ๋ก ๋ถ์ํด ๋ณผ ๊ฒ์ด๋ค.
๊ทธ๋ฌ๋ฉด ์๋ง ํฌ์คํ ์ด ๋๋ ๊ฒ ๊ฐ๋ค ๐ค
์์ธ๋ก ์ธ ๊ฒ ์๋...
'๐ค UXUI > UI ๋ฐฉ๋ฒ๋ก ' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
User Flow #2 : ๋๋ง์ ์ ์ ํ๋ก์ฐ ๋ง๋ค๊ธฐ (0) | 2022.03.13 |
---|---|
Design System #4 - UI ๋ผ์ด๋ธ๋ฌ๋ฆฌ ๋ง๋ค๊ธฐ (0) | 2022.03.08 |
Design System #3 - ๋น์ฃผ์ผ๋ญ๊ท์ง ๊ตฌ์ถํ๊ธฐ (0) | 2022.03.06 |
๋์์ธ์์คํ (Design System) ์ค๊ณํ๋ ๋ฐฉ๋ฒ (0) | 2022.03.04 |
๋์์ธ์์คํ (Design System)์ด๋? (0) | 2022.03.03 |