๐ ์ด ๊ธ์ ๋ฒ์จ 4๋ ๋ ๋์ ๊ธ์ธ๋ฐ์.
2020๋
9์ 1์ผ ๊ธฐ์ค์ผ๋ก ์ต์ ๋ด์ฉ์ ์
๋ฐ์ดํธ ํ์ต๋๋ค. ์๋ ๋งํฌ๋ฅผ ํด๋ฆญํด์ฃผ์ธ์!
ํ๋ก๋ํธ ๋งค๋์ ์ ํด, UI ๋์์ด๋์ ํด
IT ํ์ฅ์์๋ ํ๋ฉด UI๋ฅผ ์ค๊ณํ ๋ ๋๋ถ๋ถ ํ์ํฌ์ธํธ๋ฅผ ์ฌ์ฉํฉ๋๋ค. ์ ๋ํ ํ์ํฌ์ธํธ๋ก ์๋ง์ ์คํ ๋ฆฌ๋ณด๋๋ฅผ ์ ์ํ๋๋ฐ์. ํ์ํฌ์ธํธ๋ก ํ๋ฉด์ ์ค๊ณํ๋ฉด์ ๋ค์๊ณผ ๊ฐ์ ๋ถํธํจ์ ๋๊ผ์ต๋๋ค.
ํ์ํฌ์ธํธ ์ค๊ณ์ ๋ถํธํ ์
1. ์ ํ๋ ๊ณต๊ฐ์ ํ์ด์ง ๊ฒฝ๋ก, ํ๋ฉด UI, ๋์คํฌ๋ฆฝ์ ๋ฑ ๋ค์ํ ๋ด์ฉ์ ๋ด์์ผ ํ๋ค. ๊ทธ๋ฌ๋ค ๋ณด๋ ํ๋ฉด์ด ์ ์ ๋ณต์กํด์ง๋ค. ๊ฐ์ธ์ ์ผ๋ก๋ ๋ค์ ํ์ด์ง๋ก ๋๊ธฐ์ง ์๊ธฐ ์ํด ์ต๋ํ ์ฑ์ฌ๋ฃ์๊ณ ํฐํธ ์ฌ์ด์ฆ๋ ์ ์ ์์์ก๋ค.
2. ์์ ์ฌํญ์ด ๋ฐ์ํ๋ฉด ๋ชจ๋ ํ๋ฉด์ ์ผ์ผ์ด ์์ ํด์ผ ํ๋ค. ํ์ด์ง๊ฐ ์ ์ผ๋ฉด ํฌ๊ฒ ๋ฌธ์ ๋์ง ์์ง๋ง, ํ์ด์ง๊ฐ ๋ง์์ง๋ฉด ๋ฉ๋ด๋ช ํ๋๋ง ์์ ํด๋ ๋ชจ๋ ํ์ด์ง๋ฅผ ๊ฑด๋๋ ค์ผ ํ๋ ๋ ธ๊ฐ๋ค ์์ ์ด ๋น๋ฒํ ๋ฐ์ํ๋ค.
3. ์คํ ๋ฆฌ๋ณด๋๋ฅผ ๋ฐ์๋ณด๋ ๋ํ, ํด๋ผ์ด์ธํธ, ๋์์ด๋, ๊ฐ๋ฐ์ ๋ฑ์ด ๋ฌธ์๋ง์ผ๋ก ๊ธฐํ์์ ์๋๋ฅผ 100% ์ดํดํ์ง ๋ชปํ๋ค. ๊ทธ๋ฌ๋ค ๋ณด๋ ๊ฒฐ๊ณผ๋ฌผ์ด ๋์ ๋ณด์ฌ์ง๋ ๋์์ธ ๋จ๊ณ์ ์ค์ ๊ตฌํ๋๋ ๊ฐ๋ฐ ๋จ๊ณ์์ ๋ฏธ์ฒ ์์ธกํ์ง ๋ชปํ๋ ์ด์๋ค์ด ๋ฐ์ํ๋ค.
์์ ๊ฐ์ ์ด์ ๋ก ํ์ํฌ์ธํธ๋ฅผ ๋์ฒดํ ์ ์๋ ํด์ ์ฐพ์๋ณด๊ฒ ๋์๊ณ , Axure๋ฅผ ์๊ฒ ๋์ด ์ค๋ฌด์์ ์ฝ 6๋ ์ด์ ์ฌ์ฉํ๊ณ ์์ต๋๋ค. ์ด์ 5์๋ถํฐ ์ ์์ผ๋ก Axure ๊ฐ์๋ฅผ ์งํํ ์์ ์ธ๋ฐ, ๊ฐ์ ์งํ์ ์์ ์์ฅ์ ๋์์๋ ํด์ ๋ํ ์ดํด๊ฐ ํ์ํ ๊ฒ ๊ฐ์ ํ์ฌ ์ถ์๋ ๋๋ถ๋ถ์ ํด์ ์ด์ฉํด ๋ณด๊ณ , ์ง์ ์ฌ์ฉํด๋ณธ ๊ฒฝํ์ ๋ฐํ์ผ๋ก ๊ฐ ํด์ ๋ํ ๋ถ๋ฅ ๋ฐ ๊ฐ๋ต ๋ฆฌ๋ทฐ๋ฅผ ๋จ๊ฒจ๋ด ๋๋ค.
ํด์ ์๊ฐํ๊ธฐ์ ์์, ์กฐ๊ธ์ ํท๊ฐ๋ฆฌ๋ ์ฉ์ด๋ฅผ ๋จผ์ ์ ์ํด๋ณด๊ฒ ์ต๋๋ค.
- ์์ด์ดํ๋ ์(Wireframe) : UI ์ค์ฌ์ ํ๋ฉด ๋ ์ด์์
- ๋ชฉ์ (Mockup) : ์ค๋ฌผ๊ณผ ํก์ฌํ ์ ์ ์ธ ํํ์ ๋ชจํ
- ํ๋กํ ํ์ (Prototype) : ๋ค์ํ ์ธํฐ๋์ ์ด ๊ฒฐํฉ๋์ด ์ค์ ์๋น์ค์ฒ๋ผ ์๋ํ๋ ๋ชจํ
- ์คํ ๋ฆฌ๋ณด๋(Storyboard) : ์ ์ฑ , ํ๋ก์ธ์ค, ์์ด์ดํ๋ ์, ๋์คํฌ๋ฆฝ์ ๋ฑ์ด ๋ชจ๋ ํฌํจ๋ ์ค๊ณ ๋ฌธ์
์ข์ธก๋ถํฐ ์์ด์ดํ๋ ์, ๋ชฉ์ , ํ๋กํ ํ์ ์. ๋ชจ๋ฐ์ผ์์๋ ์์์ ์๋ ์์ ๋๋ค. |
์์์ ์์ด์ดํ๋ ์, ๋ชฉ์ , ํ๋กํ ํ์ ์ ๋ถ๋ฆฌํด์ ์ ์ํ์ง๋ง, ์๋ก ๊ฐ์ ๊ต์งํฉ์ผ๋ก ๊ฒน์น๋ ๋ถ๋ถ์ด ์๋นํ ๋ง์ต๋๋ค.
---
์ฉ์ด ์ ๋ฆฌ๊ฐ ๋์์ผ๋ ํด์ ์ฑ๊ฒฉ์ ๋ฐ๋ผ ๋ถ๋ฅํด๋ณด๊ฒ ์ต๋๋ค.
ํ๋กํ ํ์ดํ ํด์ ์์ ์์์ ๋ฐ๋ผ 2๊ฐ์ง ๊ทธ๋ฃน์ผ๋ก ๊ตฌ๋ถํ ์ ์์ต๋๋ค.
์ฒซ์งธ. ๊ธฐํ ๋จ๊ณ์์ ์ฌ์ฉํ๋ ํด๋ก ํ๋ฉด UI ์ค๊ณ ๋ฐ ์ธํฐ๋์ ์ ์ฉ์ ์ต์ ํ๋ ํด.
๋์งธ. ๋์์ธ ์์ ํ ์ฌ์ฉํ๋ ํด๋ก ๋์์ธ๋ ์ด๋ฏธ์ง์ ์ธํฐ๋์ ์ ์ฉ์ ์ต์ ํ๋ ํด.
๊ธฐํ ๋จ๊ณ์ ํด๋ถํฐ, ๋์์ธ ์ดํ์ ํด๊น์ง
๊ฐ๊ฐ ์ด๋ค ํน์ฅ์ ์ด ์๋์ง ์ง๊ธ๋ถํฐ ํ๋์ฉ ์ดํด๋ณด๊ฒ ์ต๋๋ค.
- ํ๋ฉด์ค๊ณ ํด -
ํ์ ๋ชฉ์
ํ์ ๋ชฉ์ ์ ํ์ํฌ์ธํธ์ ์ถ๊ฐ ๋ฉ๋ด(add-on)๋ฅผ ์ค์นํด ๋ชฉ์ ๊ธฐ๋ฅ์ ์ฌ์ฉํ ์ ์๋๋ก ์ง์ํ๋ ํด์ ๋๋ค. ํ์ ๋ชฉ์ ์ ์ค์นํ๋ฉด ํ์ํฌ์ธํธ ์๋จ์ PowerMockup ๋ฉ๋ด๊ฐ ์ถ๊ฐ๋๊ณ , ๋ฏธ๋ฆฌ ์ ์ํด ๋์ ๋ ์ด์์, ์ปดํฌ๋ํธ, ๋ด๋น๊ฒ์ด์ ๋ฑ ๋ค์ํ ๋ชฉ์ ์ ๋๋๊ทธํด์ ์ฌ์ฉํ ์ ์์ต๋๋ค. ํ์ํฌ์ธํธ์์๋ ์ง์ ๊ทธ๋ฆด ์๋ ์์ง๋ง ๋ฏธ๋ฆฌ ๋ง๋ค์ด๋์ ์ํ์ ๋ฐ๋ก ์ฌ์ฉํ ์ ์์ด ํ๋ฉด ์ค๊ณ ์๊ฐ์ ๋จ์ถํ ์ ์์ต๋๋ค.
- ์คํํ๊ฒฝ : ์๋์ฐ
- ๊ฐ๊ฒฉ : ๊ฐ์ธ $59.99 (ํํ ์ฝ 7๋ง ์), ํ์ ๋ชฉ์ ๋ฆฌ๋ทฐ๋ฅผ ํฌ์คํ ํ๋ฉด ๋ฌด๋ฃ ๋ผ์ด์ ์ค ์ทจ๋ ๊ฐ๋ฅ
- ์ถ์ฒ : ํ์ํฌ์ธํธ ํ๋ฉด ์ค๊ณ ์๊ฐ์ ๋จ์ถ์ํค๊ณ ์ถ์ ์ฌ์ฉ์์๊ฒ ์ ํฉํจ
- ๊ณต์ ์ฌ์ดํธ : http://www.powermockup.com
- ๊ด๋ จ ๋์์ : http://youtu.be/OrSxE0XnWLw
๋ฐ์ฌ๋ฏน ๋ชฉ์
์ค์ผ์นํ ๋๋์ผ๋ก ๋น ๋ฅด๊ณ ์ฌํํ๊ฒ ์๋น์ค ์ปจ์ ์ ์ ๋ฌํ ์ ์๋ ๋ชฉ์ ํด์ ๋๋ค. ๋ํ ์ผํ ํ๋ฉด ๊ตฌ์ฑ์ ์ด๋ ต์ง๋ง ๊ฐ๋จํ ์ค์ผ์นํ ๋๋ ํ์ํฌ์ธํธ๋ณด๋ค ํธ๋ฆฌํ๊ฒ ์์ ํ ์ ์์ต๋๋ค. ์๋ฌธ์ ๊ทธ๋ด์ธํ๊ฒ ๋ณด์ด์ง๋ง ํ๊ธ์ ์ด์ง ์์ฝ์ต๋๋ค.
- ์คํํ๊ฒฝ : ์๋์ฐ, ๋งฅ, ์น ๋ธ๋ผ์ฐ์
- ๊ฐ๊ฒฉ : ๊ฐ์ธ $89 (ํํ ์ฝ 10๋ง 4์ฒ ์)
- ์ถ์ฒ : ์์ด๋์ด๋ฅผ ๋จ์๊ฐ์ ๋น ๋ฅด๊ฒ ์ค์ผ์นํ๊ณ ์ถ์ ์ฌ์ฉ์์๊ฒ ์ ํฉํจ
- ํ์ต ๋์ด๋ : ์ฌ์
- ๊ณต์ ์ฌ์ดํธ : http://balsamiq.com
- ๊ด๋ จ ๋์์ : http://youtu.be/MxWTGBQE7zE
์นด์นด์ค ์ค๋ธ
์ ) ๋ค์์นด์นด์ค์์ ์ ์ํ ์จ๋ผ์ธ ํ๋กํ ํ์ดํ ํด์ ๋๋ค. ์ง๊ด์ ์ธ ์ธํฐํ์ด์ค๊ฐ ์ฅ์ ์ผ๋ก ์ฒ์ ์ฌ์ฉํ๋ ์ฌ์ฉ์๋ ์์ฝ๊ฒ ํ๋ฉด์ ๊ทธ๋ฆด ์ ์๊ณ , ์จ๋ผ์ธ์ผ๋ก ์ ์ํ ํ๋ฉด์ QR์ฝ๋ ๋ฐ ๋จ์ถ URL์ ํตํด ๊ณต์ ํ ์ ์์ต๋๋ค. ๋ฐ์ฌ๋ฏน ๋ชฉ์ ๊ณผ ๋ง์ฐฌ๊ฐ์ง๋ก ๋ํ ์ผํ ์ค๊ณ๋ณด๋ค๋ ์๋น์ค ์ปจ์ ์ ๊ฐ๋จํ ๊ณต์ ํ๊ธฐ์ ์ ํฉํฉ๋๋ค. ๋์์ธ ์์ ์ด๋ฏธ์ง๋ฅผ ์ ๋ก๋ํด์ ๋ชจ๋ฐ์ผ ๋ฑ์ ๋๋ฐ์ด์ค์์ ํ ์คํธํด ๋ณผ ์๋ ์์ต๋๋ค.
- ์คํํ๊ฒฝ : ์น ๋ธ๋ผ์ฐ์
- ๊ฐ๊ฒฉ : ๋ฌด๋ฃ
- ์ถ์ฒ : ์์ด๋์ด๋ฅผ ๋จ์๊ฐ์ ๋น ๋ฅด๊ฒ ์ค์ผ์นํ๊ณ ์ถ์ ์ฌ์ฉ์์๊ฒ ์ ํฉํจ
- ํ์ต ๋์ด๋ : ์ฌ์
- ๊ณต์ ์ฌ์ดํธ : http://ovenapp.io
- ํ๋กํ ํ์ดํ ํด -
UXํ (UXPin)
์น ๋ธ๋ผ์ฐ์ ๋ฅผ ํตํด ์์ด์ดํ๋ ์๊ณผ ํ๋กํ ํ์ดํ ์์ ์ ๋์์ ํ ์ ์๋ ํด์ ๋๋ค. ๊ตฌ๊ธ ๊ธ๋ผ์ค๋ฅผ ํฌํจํ ๋ค์ํ ๋๋ฐ์ด์ค ํ๊ฒฝ์ ๋ง์ถ์ด ์ค๊ณ๊ฐ ๊ฐ๋ฅํ๋ฉฐ, ๋ค์ํ ๋ชฉ์ ์ ์ง์ํ๋ ๊ฒ์ผ๋ก ์ ๋ช ํฉ๋๋ค. ์ค์ ํ๋ก์ ํธ์ UXPin์ ๋์ ํ๋ ์ง์ธ์ด ๋ช ๊ฐ์ง ๋จ์ ์ ์ง์ ํด ์ฃผ์ จ๋๋ฐ์. ์น ๋ธ๋ผ์ฐ์ ๊ธฐ๋ฐ์ด๋ค ๋ณด๋ ์ธ๊ตญ์ธ์ด ๋ง์ด ํ๋ํ๋ ์ ๋ ์๊ฐ ๋์ ํด์ ์๋๊ฐ ๋๋ ค์ง๊ณ , ์๋์ฐ์์ ํ๊ธ ํ์ดํ ์ง์์ด ์ํํ์ง ์๋ค๊ณ ํฉ๋๋ค. ๋งฅ์์๋ ์ ๋๋ค๊ณ ํ๋ค์.
- ์คํํ๊ฒฝ : ์น ๋ธ๋ผ์ฐ์
- ๊ฐ๊ฒฉ : ์์ ์ก, ํ๋ก ๋ฒ์ ๊ธฐ์ค ๋งค์ $29 (ํํ ์ฝ 3๋ง 4์ฒ ์)
- ์ถ์ฒ : ์์ด์ดํ๋ ์๋ถํฐ ํ๋กํ ํ์ ๊น์ง ํ ๋ฒ์ ์ ์ํ๊ณ ์ถ์ ์ฌ์ฉ์์๊ฒ ์ ํฉํจ
- ํ์ต ๋์ด๋ : ์ด๋ ค์
- ๊ณต์ ์ฌ์ดํธ : http://uxpin.com
- ๊ด๋ จ ๋์์ : http://youtu.be/DdTgeFrCxYo
์ก์์ด (AXURE)
์์ ์๊ฐํ ์ฌ๋ฌ ํด๋ค์ด ํ๋ฉด UI ์ค๊ณ์ ํฌ์ปค์ค ๋์ด ์๋ ๋ฐ๋ฉด์, Axure๋ ์คํ ๋ฆฌ๋ณด๋์ ํฌํจ๋๋ ์ ์ฑ , ํ๋ก์ฐ ์ฐจํธ, ๋์คํฌ๋ฆฝ์ ๊น์ง ๋ชจ๋ ์์ฑํ ์ ์๋๋ก ์ง์ํ๊ณ ์์ต๋๋ค. ํ ํ๋ก์ ํธ๋ก ํ์ ๋ ๊ฐ๋ฅํ๊ธฐ์ ๊ตญ๋ด ๊ธฐํ ํ๊ฒฝ์ ๊ฐ์ฅ ์ ํฉํ ํด์ด๋ผ๊ณ ์๊ฐ๋ฉ๋๋ค. ์ถ๋ ฅ๋ฌผ์ ๊ฒฝ์ฐ ์ต์ ์ ์กฐ๊ธ๋ง ์ค์ ํ๋ฉด ํ์ํฌ์ธํธ๋งํผ์ ์๋์ง๋ง ๋ณด๊ธฐ ์ข๊ฒ ๊ตฌ์ฑํ ์ ์์ต๋๋ค. ๋จ์ ์ ๋ค๋ฅธ ํด๋ค์ ๋นํด ๊ฐ๊ฒฉ์ด ๋น์๋๋ค.
- ์คํํ๊ฒฝ : ์๋์ฐ, ๋งฅ
- ๊ฐ๊ฒฉ : ์คํ ๋๋ ๋ฒ์ $289 (ํํ ์ฝ 33๋ง 7์ฒ ์), ํ์์ ๋ฌด๋ฃ ๋ผ์ด์ ์ค ๋ฐ๊ธ, ์์ ์ก ์๊ธ์ ์ถ์ ์์
- ์ถ์ฒ : ์์ด์ดํ๋ ์๋ถํฐ ํ๋กํ ํ์ ๊น์ง ํ ๋ฒ์ ์ ์ํ๊ณ ์ถ์ ์ฌ์ฉ์์๊ฒ ์ ํฉํจ
- ํ์ต ๋์ด๋ : ์ค๊ฐ ~ ์ด๋ ค์
- ๊ณต์ ์ฌ์ดํธ : http://www.axure.com
- ๊ด๋ จ ์ํ : http://bit.ly/1XyRB33
๋ค์ด๋ฒ ํ๋กํ ๋์ฐ
๋ค์ด๋ฒ์์ ๋ง๋ ํ๋กํ ํ์ดํ ํด. ์ด๋ฐ ๋ง ํ๊ธฐ๋ ์กฐ๊ธ ๊ทธ๋ ์ง๋ง Axure๋ฅผ ๊ทธ๋๋ก ์นดํผํด์ ์ฝ๊ฐ์ ๊ธฐ๋ฅ์ ์ปค์คํฐ๋ง์ด์งํ ํด. Axure์ ๋น๊ตํ๋ฉด ์ ์ฒด์ ์ธ ์์ฑ๋๊ฐ ๋จ์ด์ง์ง๋ง ๋ฌด๋ฃ๋ก ์ฌ์ฉํ ์ ์๋ค๋ ์ ์ด ๊ฐ์ฅ ํฐ ๋ฉ๋ฆฌํธ์ ๋๋ค.
- ์คํํ๊ฒฝ : ์๋์ฐ
- ๊ฐ๊ฒฉ : ๋ฌด๋ฃ
- ์ถ์ฒ : ์์ด์ดํ๋ ์๋ถํฐ ํ๋กํ ํ์ ๊น์ง ํ ๋ฒ์ ์ ์ํ๊ณ ์ถ์ ์ฌ์ฉ์์๊ฒ ์ ํฉํจ
- ํ์ต ๋์ด๋ : ์ค๊ฐ ~ ์ด๋ ค์
- ๊ณต์ ์ฌ์ดํธ : http://protonow.navercorp.com
- UI ๋์์ธ ํด -
์ค์ผ์น (Sketch)
๋์์ธ ํด์ ๊ฝค ์ค๋ ์๊ฐ ๋์ ํฌํ ์ต์ด ๋ ์ ํด์์ง๋ง, ์ต๊ทผ ๋ค๋๋๋ '๋ณดํค๋ฏธ์ ์ฝ๋ฉ'ํ์ด ๋ง๋ UI ๋์์ธ ํ๋ก๊ทธ๋จ ์ค์ผ์น๊ฐ ์ถ์๋๋ฉด์ ๋ง์ UI ๋์์ด๋๋ค์ด ์ด ํด์ ์ฌ์ฉํ๊ธฐ ์์ํ์ต๋๋ค. ํฌํ ์ต์ ์ฌ์ง ํธ์ง์ ์ต์ ํ๋ ํด์ด๊ธฐ์ UI ๋์์ธ ์ธ์๋ ๊ด๋ฒ์ํ ๊ธฐ๋ฅ์ ์ ๊ณตํ๊ณ ์๋๋ฐ์. ์ค์ผ์น์ ๊ฒฝ์ฐ UI ๋์์ธ์ ๊ผญ ํ์ํ ๊ธฐ๋ฅ๋ง์ ๋ด๊ณ ์์ด ํฌํ ์ต๋ณด๋ค ์ข ๋ ๊ฐ๋ณ๊ณ ํธ๋ฆฌํ๊ฒ ๋์์ธํ ์ ์์ต๋๋ค.
์ง์ ์ฌ์ฉํด ๋ณธ ๊ฒฐ๊ณผ ํ์ํฌ์ธํธ/ํค๋ ธํธ๋ฅผ ๋ค๋ค๋ ์ฌ๋์ด๋ผ๋ฉด ์ฝ๊ฒ ์ ์ํ ์ ์์ต๋๋ค. ๋ฐ๋ผ์, ์ ์ ๊ฐ์ ๊ธฐํ์๋ ๋์์ธ์ ํ ์ ์๋ ๊ธฐํ๊ฐ ์๊ฒผ์ต๋๋ค. ์ฐฝ์์ ๊ฐ๊ฐ์ ๋ฐํํด์ผ ํ๋ ์ํธ ๋์์ธ์ ๋น์ฐํ ์ด๋ ต๊ฒ ์ง๋ง, ๋ค์ํ ๋ชฉ์ &ํ ํ๋ฆฟ์ ํ์ฉํ ๋ ์ด์์ ์ค์ฌ์ ๋์์ธ์ด๋ผ๋ฉด ํ๋ฉด ์ค๊ณ๋ฅผ ์ค๋ํ๋ ๊ธฐํ์๊ฐ ๋์ ํด๋ณผ ๋งํฉ๋๋ค. ์ค์ผ์น ํ๋ก๊ทธ๋จ๊ณผ ์ฐ๋๋๋ ์ ํ๋ฆฐ ํ๋ฌ๊ทธ์ธ(https://zeplin.io)์ ์ค์นํ๋ฉด ๋์์ธ ๊ฐ์ด๋๊น์ง ์๋์ผ๋ก ์์ฑ๋ฉ๋๋ค. ๊ฐ์ธ์ ์ผ๋ก๋ Axure ์ธ์ ๊ผญ ๋ฐฐ์ฐ๊ณ ์ถ์ ํด ์ค ํ๋์ ๋๋ค.
- ์คํํ๊ฒฝ : ๋งฅ
- ๊ฐ๊ฒฉ : $99 (ํํ ์ฝ 11๋ง 5์ฒ ์)
- ์ถ์ฒ : UI ๋์์ธ์ ์ต์ ํ๋ ๋์์ธ ํ๋ก๊ทธ๋จ์ ์ฌ์ฉํด๋ณด๊ณ ์ถ์ ์ฌ์ฉ์์๊ฒ ์ ํฉํจ
- ํ์ต ๋์ด๋ : ์ค๊ฐ
- ๊ณต์ ์ฌ์ดํธ : http://www.sketchapp.com
- ๊ด๋ จ ๋์์ : http://youtu.be/YdIeiCyKwpI
- ๊ด๋ จ ํฌ์คํ : http://brunch.co.kr/@jihere1001
์ด๋๋น ์ต์คํผ๋ฆฌ์ธ์ค ๋์์ธ CC (Adobe XD)
์ด๋๋น์์ ์๋กญ๊ฒ ์ถ์ํ UI ๋์์ธ & ํ๋กํ ํ์ดํ ํด์ ๋๋ค. ์ค์ผ์น์ ๋ง์ฐฌ๊ฐ์ง๋ก UI ๋์์ธ์ ์ต์ ํ๋ ํด๋ก ์ฝ๊ณ ์ง๊ด์ ์ธ ์ธํฐํ์ด์ค๊ฐ ์ฅ์ ์ ๋๋ค. ์ํธ๋ณด๋ ๊ธฐ๋ฐ์ ํ๋ฉด๊ตฌ์ฑ์ ์ค์ผ์น์ ์ ์ฌํ๋ฉฐ ํฌํ ์ต, ์ผ๋ฌ์คํธ์์ ์ฐ๋์ ์๋ฒฝํ๊ฒ ์ง์ํฉ๋๋ค. ๋ํ, ์ค์ผ์น์์ ์์ ํ ํ์ผ๋ ๋ถ๋ฌ์์ ์ฌ์ฉํ ์ ์์ต๋๋ค. ์ค์ผ์น์ ๋น๊ตํ ์ฅ์ ์ผ๋ก๋ ํ๋กํ ํ์ ๊ธฐ๋ฅ์ ํ์ฌํ๊ณ ์์ด UI ๋์์ธ ํ ์ธํฐ๋์ ์ ๋น ๋ฅด๊ฒ ์ ์ฉํ๊ณ ์์ฐํด๋ณผ ์ ์์ต๋๋ค. ํ์ง๋ง, ์ค์ผ์น ๋๋น ๊ธฐ๋ฅ์ด ์ ์ฝ์ ์ด๊ณ ๊ณต์ ๋ ํผ๋ฐ์ค ๋ฐ ์ฐ๋ ํ๋ฌ๊ทธ์ธ์ด ์ ์ด ์์ง์ ์ค์ผ์น๋ฅผ ๋์ฒดํ๊ธฐ ์ด๋ ค์ธ ๊ฒ์ผ๋ก ๋ณด์ ๋๋ค.
- ์คํํ๊ฒฝ : ๋งฅ
- ๊ฐ๊ฒฉ : ๋ฌด๋ฃ (์ด๋๋น ๊ณ์ ํ์)
- ์ถ์ฒ : UI ๋์์ธ์ ์ต์ ํ๋ ๋์์ธ ํ๋ก๊ทธ๋จ์ ์ฌ์ฉํด๋ณด๊ณ ์ถ์ ์ฌ์ฉ์์๊ฒ ์ ํฉํจ
- ํ์ต ๋์ด๋ : ์ค๊ฐ
- ๊ณต์ ์ฌ์ดํธ : https://www.adobe.com/kr/products/experience-design.html
- ๊ด๋ จ ๋์์ : http://adobe.ly/1VLFAb5
- ๋์์ธ ์ฐ์ถ๋ฌผ๋ก ์์ ํ๋ ํ๋กํ ํ์ดํ ํด -
์ธ๋น์ (Invision)
์ธ๋น์ (InVision)์ ์ฐ๋ฒ, ํธ์ํฐ, ์์ด๋น์ค๋น ๋ฑ์ ๊ณ ๊ฐ์ฌ๋ก ๋๊ณ ์๋ ํ๋กํ ํ์ดํ ํด๋ก, 2015๋ 4,500๋ง ๋ฌ๋ฌ(ํํ ์ฝ 514์ต ์)์ ํฌ์๋ฅผ ์ ์นํ์ ์ ๋๋ก ํซํ ์๋น์ค์ ๋๋ค.
ํด ์ฌ์ฉ๋ฐฉ๋ฒ์ ๊ฐ๋จํฉ๋๋ค. ํฌํ ์ต, ์ค์ผ์น ๋ฑ์ผ๋ก ๋์์ด๋๊ฐ ์์ ํ ์์ ๋ฌผ์ ์ฌ์ดํธ์ ์ ๋ก๋ํ ๋ค์. UI๋ฅผ ์ฐ๊ฒฐํด ๊ฐ๋จํ ์ธํฐ๋์ ์ ์ ์ฉํ ์ ์์ต๋๋ค. ์ธ๋น์ ์ ์ต๊ณ ๊ฐ์ ์ ํ์ ๊ธฐ๋ฅ์ผ๋ก, ํ๋ก์ ํธ ์ฐธ์ฌ์ ๊ฐ์ ๋ค์ํ ํํ๋ก ํผ๋๋ฐฑ์ ์ฃผ๊ณ ๋ฐ์ ์ ์์ต๋๋ค.
- ์คํํ๊ฒฝ : ์น ๋ธ๋ผ์ฐ์
- ๊ฐ๊ฒฉ : ์์ ์ก, ํ๋กํ์ ๋ ๋ฒ์ $22 (ํํ ์ฝ 2๋ง 5์ฒ ์)
- ์ถ์ฒ : ์ฌ๋, ํธ๋ ๋ก์ ๊ฐ์ ํ์ ๋ชจ๋ธ์ ์ ์ฌ์ฉํ๋ ์ฌ์ฉ์์๊ฒ ์ถ์ฒ
- ํ์ต ๋์ด๋ : ์ฌ์
- ๊ณต์ ์ฌ์ดํธ : http://www.invisionapp.com
- ๊ด๋ จ ๋์์ : http://bit.ly/22K9It8
- ์ ์ฌ ํด : ๋ง๋ฒจ(Marvel), ํ๋ฆฐํ (Flinto). ํ๋ฆฐํ ์ ๊ฒฝ์ฐ ์นด์นด์ค์์ ์ฌ์ฉํ๋ค๊ณ ๋ค์์ต๋๋ค.
ํฝ์ฌ์์ดํธ (Pixate)
ํฝ์ฌ์์ดํธ๋ 2015๋ ๊ตฌ๊ธ์ด ์ธ์ํ ํ๋กํ ํ์ดํ ํด๋ก ํ์ฌ ์๋ง์กด, ์ ํ, ํ์ด์ค๋ถ, ๊ตฌ๊ธ ๋ฑ์ ํฌํจํด ๋ค์ํ ํ์ฌ์์ ์ฌ์ฉํ๊ณ ์์ต๋๋ค.
์ด ํด์ ๋ชจ๋ฐ์ผ ์ฑ ํ๋กํ ํ์ดํ์ ์ต์ ํ๋์ด ์์ผ๋ฉฐ ์์์ ์๊ฐํ ์ธ๋น์ , ๋ง๋ธ, ํ๋ฆฐํ ๋ณด๋ค ๋์ฑ ๋ํ ์ผํ ์ธํฐ๋์ ์ ์ค์ ํ ์ ์์ต๋๋ค. ์ฌ์ฉ๋ฐฉ๋ฒ์ ์ ํด๋ค๊ณผ ๋ง์ฐฌ๊ฐ์ง๋ก ๋์์ธ ํ์ผ์ ์ ๋ก๋ํ ๋ค์ ์ธํฐ๋์ ์ ์ ์ฉํ๋ ๋ฐฉ์์ ๋๋ค. ์ฌ์ฉ๋ฐฉ๋ฒ์ด ์กฐ๊ธ ์ด๋ ค์ด ํธ์ธ๋ฐ ๊ฐ์ด๋๋ฅผ ๋ณด๋ฉด ์ฝ๊ฒ ๋ฐ๋ผ ํ ์ ์๋ค๊ณ ํฉ๋๋ค.
- ์คํํ๊ฒฝ : ์๋์ฐ, ๋งฅ
- ๊ฐ๊ฒฉ : ๋ฌด๋ฃ
- ์ถ์ฒ : ์ข์ ํด์ด๋ฉด์ ๊ฐ๊ฒฉ๋ ๋ฌด๋ฃ. ํ๋กํ ํ์ดํ์ ๊ด์ฌ ์๋ ๋์์ด๋์๊ฒ ์ถ์ฒ.
- ํ์ต ๋์ด๋ : ์ค๊ฐ
- ๊ณต์ ์ฌ์ดํธ : http://www.pixate.com
- ๊ด๋ จ ๋์์ : http://www.pixate.com/education/video-tutorials
ํ๋ ์ด๋จธ (Framer)
Coffee Script๋ผ๊ณ ํ๋ ๊ฐ๋ฐ ์ธ์ด๋ฅผ ์ฌ์ฉํ๋ ์ฝ๋ ๊ธฐ๋ฐ์ ํ๋กํ ํ์ดํ ํด์ ๋๋ค. ๋ค๋ฅธ ํ๋กํ ํ์ดํ ํด์ html ๊ธฐ๋ฐ์ผ๋ก ์ถ๋ ฅ๋์ด ์ธํฐ๋์ ์ ์ด์ํ ๋ถ๋ถ์ด ๋ฐ์ํ๊ธฐ๋ ํ๋๋ฐ, ํ๋ ์ด๋จธ๋ ์ฝ๋ ๊ธฐ๋ฐ์ผ๋ก ์๋๋์ด ์ค์ ์์ ๋ฌผ๊ณผ ํก์ฌํ๊ฒ ์๋ํฉ๋๋ค. ํ์ง๋ง ์์ ๋์ด๋๊ฐ ์๊ธฐ์ ๋ค๋ฅธ ํด๋ค์ ๋นํด ์ด๋ ค์ด ํธ์ ๋๋ค.
- ์คํํ๊ฒฝ : ๋งฅ
- ๊ฐ๊ฒฉ : $129 (ํํ ์ฝ 15๋ง 2์ฒ ์)
- ์ถ์ฒ : ์ฝ๋ ์์ ์ด ์ต์ํ๊ณ , ํ์ด ํ๋ฆฌํฐ ํ๋กํ ํ์ดํ์ ๊ด์ฌ ์๋ ์ฌ์ฉ์์๊ฒ ์ถ์ฒ
- ํ์ต ๋์ด๋ : ์ด๋ ค์
- ๊ณต์ ์ฌ์ดํธ : http://framerjs.com
- ๊ด๋ จ ์ํ : http://framerjs.com/examples
๋์์ธ ํ๋กํ ํ์ดํ ํด์ ์ข ๋ฅ๊ฐ ๋๋ฌด ๋ง์์ ์ฑ๊ฒฉ์ด ๋ค๋ฅธ ํด์ ๋ฝ์์ ์ ๋ฆฌํด๋ดค์ต๋๋ค. ์์์ ์๊ฐํ ํด ์ธ์๋ Proto.io, Origami, ProtoPie ๋ฑ ๋ค์ํ ํด์ด ์์ผ๋ ์ข ๋ ์์ธํ ๋ณด๊ณ ์ถ์ผ์ ๋ถ๋ค์ ์๋ ๋งํฌ๋ฅผ ์ฐธ์กฐํ์๊ธฐ ๋ฐ๋๋๋ค.
http://www.cooper.com/prototyping-tools
http://www.prototypingtools.co
์ ๋ฆฌํ๋ฉด,
ํ์ํฌ์ธํธ์ ํฌํ ์ต์ด ์ ๋ถ์๋ IT ์์
ํ๊ฒฝ์ด ๋น ๋ฅด๊ฒ ๋ณํํ๊ณ ์์ต๋๋ค. ์๋ก์ด ๊ธฐ์ ์ ํ์ตํ๋ ๊ฒ์ด ๋ค์ ๋ถ๋ด๋ ์ ์์ง๋ง ๊ฐ์ธ ๊ฒฝ์๋ ฅ์ ๊ฐ์ถ๊ธฐ ์ํด์๋ ์๋์ ํ๋ฆ์ ์ฝ๊ณ ๊ทธ๋ ๊ทธ๋ ํ์ํ ๊ธฐ์ ์ ์ตํ๋ ๊ฒ์ด ์ค์ํ์ง ์์๊น ์๊ฐํด๋ด
๋๋ค. ๊ธฐํ์๋ผ๋ฉด Axure ํด์ ๊ผญ ํ ๋ฒ ๋ฐฐ์๋ณด์๊ธธ ๊ฐ๋ ฅ ์ถ์ฒํฉ๋๋ค. ^^
๐ ์ด ๊ธ์ ๋ฒ์จ 4๋ ๋ ๋์ ๊ธ์ธ๋ฐ์.
2020๋
9์ 1์ผ ๊ธฐ์ค์ผ๋ก ์ต์ ๋ด์ฉ์ ์
๋ฐ์ดํธ ํ์ต๋๋ค. ์๋ ๊ธ๋ ํจ๊ป ์ฝ์ด์ฃผ์ธ์!
ํ๋ก๋ํธ ๋งค๋์ ์ ํด, UI ๋์์ด๋์ ํด
'IT ๊ธฐํ > ์๋น์ค ๊ธฐํ' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
์ ๊ท Web & Mobile ์๋น์ค ๊ตฌ์ถ ํ๋ก์ธ์ค (7) | 2016.04.25 |
---|---|
[Good UX] ๋ฒ ์ค๋ฎค์ง ํด์ธ ๊ฐ์๋ช ํ๊ธ ํ๊ธฐ (3) | 2016.04.16 |
ํ ๋ฒ์ฏค ๋ค์ด๋ดค๋ ํ๋ฉด์ค๊ณ & ํ๋กํ ํ์ดํ ํด ์ด์ ๋ฆฌ (38) | 2016.03.30 |
๋ฐฑ์คํผ์ค(BackOffiice) ์ฐธ๊ณ ์ฌ์ดํธ ๋ชจ์ (0) | 2016.03.21 |
๋ชจ๋ฐ์ผ ๋๋ฐ์ด์ค๋ณ ํด์๋ ๋ฐ ์์ธ์คํ ํ์ธ ๋ฐฉ๋ฒ (1) | 2016.03.21 |
๊ธฐํ์์๊ฒ ๊ผญ ํ์ํ ์ฐ์ถ๋ฌผ ๋ชจ์ (์น๋ง์ฌ ๋งฅ๋น๋ ์๋ฃ ๋งํฌ) (14) | 2016.03.07 |
์์คํ์ด๋ผ๋ ํด๋ ์์ต๋๋ค. ๊ตญ๋ด ๊ฐ๋ฐ์ฌ......๊ธฐ๋ฅ ๋ง๊ณ ์ข์ ๋ฏ ํฉ๋๋ค.^^
http://www.aspenux.com/docs/help/ux/intro_ux.html
๋น๋ฐ๋๊ธ์ ๋๋ค
์ ๋ง ๋ชฉ์ ํ๋ก๊ทธ๋จ์ผ ์ฐพ๋ค์ฐพ๋ค๊ฐ ํฌ๊ธฐํ๋ ค๋ ์ฐจ ๋ฐ๊ฒฌํ์ต๋๋ค~!
์ข์ ์ ๋ณด ๊ฐ์ฌํฉ๋๋ค!
์ข์ ์ ๋ณด๋ค์ ^^
๊ฐ์ธ์ ์ผ๋ก ๋ฐ์ฌ๋ฏน๊ณผ ํ๋กํ ๋์ฐ ํ์๋ชฉ์ AxureRP-Pro๋ฅผ ์จ๋ดค๋๋ฐ์
์ ์ ์ธ ํ์ด์ง๋ ํ์๋ชฉ์ ์ด ํ๋ฉด์ ์ง์ ์ธํฐ๋ ์ ์ ๋ฃ๊ณ ๊ทธ๋ฆฌ๊ธฐ์๋ AxureRP์ด ์ต๊ณ ์ธ๊ฒ ๊ฐ์ต๋๋ค.
์ค ์ ๋ง ์ ์ ๋ฆฌํด์ฃผ์ จ๋ค์. ๋ช๋ ์ ์ ๋ฐ์ฌ๋ฏน ๋ชฉ์ ํ ๋ฒ ์จ๋ณธ๊ฒ ๋ค์๋๋ฐ, ๊ต์ฅํ ๋ง๊ตฐ์~ ์นด์นด์ค๋ ๋ค์ด๋ฒ๊น์ง.. ์ง์ง ํฐ ๋์์ด ๋ ๊ฑฐ ๊ฐ์์-
์๊ฐํด ์ฃผ์ ํด๊ณผ ์กฐ๊ธ ๋ค๋ฅธ ์ปจ์ ์ด์ง๋ง .. ์ ๋ ์ต๋ํ ์๋ํ๋ ํ๋กํ ํ์ ์ ๊ฐ์ฅ ๋น ๋ฅด๊ฒ ๋ง๋ค๊ธฐ ์ํ
๋ฐ์ดํ๋ฌ๊ทธ๋ผ๋ ๋๊ตฌ๋ฅผ ๋ง๋ค์์ต๋๋ค. ํ๋กํ ํ์ดํ์ ๊ด์ฌ์ด ๋ง์ผ์๋ค๋ฉด ์ฌ์ฉํด๋ณด์๊ณ ์๊ฐ์ ๋ถํ๋๋ฆฝ๋๋ค ^^;
https://youtu.be/xn1Oc5Z23Ks
protoshare ์ถ์ฒํฉ๋๋ค. ๊ธฐ๋ณธ์์ ์ก์ด๋ ๊ตฌ๊ธ๋๋ผ์ด๋ธ์์ ๋ฌด๋ฃ์ ๋๋ค.
์, ์กฐ์์๋ ์ ๋ง ๊น๋ํ๊ณ ๊ฐ๊ฒฐํ ์๋ฃ ๊ฐ์ฌํฉ๋๋ค!! ์ ๋ง ํฐ ๋์์ด ๋์์ด์. ์ ๋ง ๊ฐ์ฌํฉ๋๋ค!!! ๋ธ๋ก๊ทธ ๋ถ๋งํฌํด๋๊ณ ๋๊ณ ๋๊ณ ์ฐธ๊ณ ํ๋ฉด์ ๋ด์ผ๊ฒ ์ต๋๋ค. ์ ๋ง ์ข๋ค์.
PM ๋ ์ ์ตํ ์ ๋ณด๊ณต์ ๊ฐ์ฌ ํฉ๋๋น ใ ใ ใ
์๋ ํ์ธ์ ์ข์ ์ ๋ณด ๊ฐ์ฌํฉ๋๋ค.
์ฒดํํ์์ ์ ๊ธฐ๋ฅ์ ๋ค์ฌ์ฉํ ์์๋์?
Thanks for sharing!
I'm working in company that provides mobile software development services
https://www.cleveroad.com/services
And this article was really useful for me
๋งค์ฐ ์ ์ฉํ ์ ๋ณด ์ ๋๋ค! ์ ๋ฆฌ๋ ๊น๋ํ๋ค์! ๊ฐ์ฌํฉ๋๋ค!
์ ๋ง ๊ฐ์ฌํฉ๋๋ค
Pixate๋ ์๋น์ค ์ข ๋ฃ๋์๋ค์. ์ข์ ๊ธ์ ๋๋ฌด ๋ฆ๊ฒ ๋ณด๊ฒ๋์ด ์ํ๊น์ต๋๋ค.
์ง์ง ์ข์ ๊ธ์ด๋ค์
pixate๋ ๊ตฟ๋ฐ์ด๋ฅผ ์ธ์ณค๋ค์.
๋ค์ด๋ฒํ๋กํ ๋์ฐ๋ ์ข ๋ฃ ๋์๋ค์ ๋ค์ด๋ก๋๋ ๊ฐ๋ฅํ๋ค์ ^^
๋น๋ฐ๋๊ธ์ ๋๋ค
์ข์ ํฌ์คํ ์ ๋ณด๊ณ ๊ฐ๋๋ค! ๊ฐ์ฌํฉ๋๋ค!!
์ข์ ์ ๋ณด ๊ฐ์ฌํฉ๋๋ค. ์ ๋ ๊ธฐํ์๋ก์ ํฐ ๋์๋์์ต๋๋ค.