λ‹€μš΄λ‘œλ“œ 없이 μ›ν•˜λŠ” κ²Œμž„ UIλ₯Ό λ°”λ‘œ μ°Ύμ•„λ³΄μ„Έμš”.
λ‹˜, μ•ˆλ…•ν•˜μ„Έμš”!✨ 

κΈ°νšμ΄λ‚˜ λ””μžμΈμ„ ν•˜μ‹€ λ•Œ μ›ν•˜λŠ” 레퍼런슀 ν™”λ©΄ ν•˜λ‚˜λ₯Ό 보렀고 ꡳ이 앱을 λ‹€μš΄λ‘œλ“œν•˜κ³ , 번거둜운 νšŒμ›κ°€μž…μ΄λ‚˜ 본인 μΈμ¦κΉŒμ§€ 해보신 κ²½ν—˜, λ‹€λ“€ ν•œ 번쯀 μžˆμœΌμ‹œμ£ ? μ•„λ§ˆ 이런 λ²ˆκ±°λ‘œμ›€μ„ ν”Όν•˜κ³  쉽고 λΉ λ₯΄κ²Œ μ˜κ°μ„ μ–»κΈ° μœ„ν•΄, μ§€κΈˆ λ‹˜κ»˜μ„œλ„ μœ μ•„μ΄λ³Όμ„ μ• μš©ν•˜κ³  계싀 ν…λ°μš”. πŸ‘€ 사싀 κ²Œμž„ μ—…κ³„μ—μ„œλŠ” 이런 λΆˆνŽΈν•¨μ΄ 훨씬 더 μΌμƒμ μž…λ‹ˆλ‹€.


상점 UI ν•œ μž₯을 ν™•μΈν•˜λ €κ³  λ°€μƒˆ μžλ™ 사λƒ₯을 λŒλ €μ•Ό ν•˜κ³ , νŠΉμ • μ½˜ν…μΈ  화면을 보기 μœ„ν•΄ μ§€λ£¨ν•œ νŠœν† λ¦¬μ–Όμ„ κΉ¨λ©° 눈물겹게 λ ˆλ²¨μ—…μ„ ν•΄μ•Ό ν•˜λŠ” κ²½μš°κ°€ ν—ˆλ‹€ν•˜κ±°λ“ μš”. κ²Œμž„ 업계 μ’…μ‚¬μžλ“€μ˜ 이런 κΉŠμ€ μ• ν™˜μ„ ν•΄κ²°ν•˜κ³ , IT λ©”μ΄μ»€λΆ„λ“€μ—κ²Œλ„ 톑톑 νŠ€λŠ” κ²Œμ΄λ―Έν”ΌμΌ€μ΄μ…˜ 레퍼런슀λ₯Ό μ „ν•΄λ“œλ¦¬κΈ° μœ„ν•΄ λ“œλ””μ–΄ μœ μ•„μ΄λ³Όμ— 'κ²Œμž„ νƒ­'이 μ‹ μ„€λ˜μ—ˆμŠ΅λ‹ˆλ‹€!


이제 νŠœν† λ¦¬μ–Όμ„ 견디지 μ•Šμ•„λ„, 폰 μš©λŸ‰μ„ μ°¨μ§€ν•˜λ©° κ²Œμž„μ„ λ‹€μš΄λ‘œλ“œν•˜μ§€ μ•Šμ•„λ„ λ©λ‹ˆλ‹€. μœ μ•„μ΄λ³Όμ—μ„œ 클릭 ν•œ 번으둜 λ‹€μ–‘ν•œ κ²Œμž„ UI듀을 λ°”λ‘œ 확인해 λ³΄μ„Έμš”!☺️

κ·Έλ ‡λ‹€λ©΄ κ²Œμž„ 레퍼런슀λ₯Ό μ°ΎλŠ” 일은 μ™œ μ΄λ ‡κ²Œ μ–΄λ €μš΄ κ±ΈκΉŒμš”?

κ²Œμž„ UI/UXλŠ” 일반적인 μ»€λ¨ΈμŠ€λ‚˜ 금육, SaaS μ•±κ³Ό 달리 고유의 세계관과 λ…νŠΉν•œ κ·Έλž˜ν”½ μŠ€νƒ€μΌ, 그리고 λ³΅μž‘ν•œ 인벀토리와 ν™”λ €ν•œ μΈν„°λž™μ…˜μ΄ 유기적으둜 맞물렀 μžˆμ–΄μš”. 여기에 μž¦μ€ μ—…λ°μ΄νŠΈκΉŒμ§€ 더해지죠. 완성도 높은 ν”„λ‘œμ νŠΈλ₯Ό μœ„ν•΄ μ •κ΅ν•œ λ ˆνΌλŸ°μŠ€κ°€ ν•„μˆ˜μΈλ°λ„, 막상 싀무에 μ“Έ 자료λ₯Ό 찾으렀면 λ‹€μŒκ³Ό 같은 벽에 λΆ€λ”ͺ히곀 ν–ˆμ–΄μš”.

κΈ°μ‘΄ 레퍼런슀 μˆ˜μ§‘ λ°©μ‹μ˜ λͺ…ν™•ν•œ ν•œκ³„

1) λ‹¨νŽΈμ μΈ μ΄λ―Έμ§€μ˜ ν•œκ³„: ν•€ν„°λ ˆμŠ€νŠΈ λ“±μ—μ„œ 찾은 μŠ€ν¬λ¦°μƒ·μ€ λ‹¨λ©΄λ§Œ 보여쀄 뿐이라, μœ μ €κ°€ μ‹€μ œλ‘œ κ²ͺλŠ” ν”Œλ‘œμš°λ‚˜ UI의 λ§₯락을 νŒŒμ•…ν•˜κΈ° μ–΄λ €μ›Œμš”.

2) ν•΄μ™Έ 레퍼런슀 μ‚¬μ΄νŠΈμ˜ 아쉬움: λ„ˆλ¬΄ μ˜ˆμ „ 자료 μœ„μ£Όλ‘œ μ•„μΉ΄μ΄λΉ™λ˜μ–΄ μžˆμ–΄, λΉ λ₯΄κ²Œ λ³€ν•˜λŠ” μ΅œμ‹  νŠΈλ Œλ“œλ₯Ό 따라가기 μ–΄λ €μ›Œμš”.

3) μ‹œκ°„κ³Ό λ¦¬μ†ŒμŠ€μ˜ λ‚­λΉ„: μ›ν•˜λŠ” ν™”λ©΄(예: κ°•ν™”, κΈΈλ“œ, 상점)을 보렀고 κ²Œμž„μ„ μƒˆλ‘œ λ°›μœΌλ©΄, μ§„μž… μž₯벽을 λ„˜λŠ” λ°μ—λ§Œ λ””μžμΈ ꡬ상 λͺ»μ§€μ•Šμ€ μ—λ„ˆμ§€κ°€ μ†Œλͺ¨λΌμš”.


자료λ₯Ό 'μ‘°μ‚¬ν•˜κ³  μˆ˜μ§‘ν•˜λŠ” κ³Όμ •' μžμ²΄μ—μ„œ μ˜€λŠ” 이 λΉ„νš¨μœ¨μ„ λˆ„κ΅¬λ³΄λ‹€ 잘 μ•ŒκΈ°μ—, μœ μ•„μ΄λ³Όμ΄ κ²Œμž„ μ˜μ—­μœΌλ‘œ λ°œμ„ λ„“ν˜”μŠ΅λ‹ˆλ‹€. 일반 μ•± λ””μžμΈμ˜ ν‘œμ€€κ³Ό μ˜κ°μ„ μ œμ‹œν•΄μ˜¨ μœ μ•„μ΄λ³Όμ΄, 이제 κ²Œμž„ UI/UX μ‹€λ¬΄μžλΆ„λ“€μ„ μœ„ν•œ λ“ λ“ ν•œ 레퍼런슀 창고둜 κ±°λ“­λ‚˜μš”.

싀무 인터뷰(UT)둜 μ •λ¦½ν•œ κ²Œμž„ λ§žμΆ€ν˜• 탐색ꡬ쑰 섀계

μƒˆλ‘­κ²Œ νƒ„μƒν•œ μœ μ•„μ΄λ³Ό κ²Œμž„ 탭은 μ—¬λŸ¬ μ°¨λ‘€μ˜ μ‚¬μš©μž 인터뷰λ₯Ό 거쳐 λ§Œλ“€μ–΄μ‘Œμ–΄μš”. μ–΄λ–€ κΈ°μ€€μœΌλ‘œ μ„€κ³„ν–ˆλŠ”μ§€ λ„€ κ°€μ§€λ‘œ μ†Œκ°œν• κ²Œμš”.

1. ν”Œλ‘œμš°(Flow) 쀑심 레퍼런슀 ꡬ성

μŠ€ν¬λ¦°μƒ· ν•œ μž₯μœΌλ‘œλŠ” UI의 μ§„μ§œ 기획 μ˜λ„μ™€ μ§„μž… λ§₯락을 νŒŒμ•…ν•˜κΈ° μ–΄λ ΅μ£ . μœ μ•„μ΄λ³Ό κ²Œμž„ 탭은 κΈ°μ‘΄ μœ μ•„μ΄λ³Όμ˜ κ°•μ μ΄μ—ˆλ˜ ν”Œλ‘œμš° 쀑심 ν™”λ©΄ ꡬ성을 κ·ΈλŒ€λ‘œ κ°€μ Έμ™”μ–΄μš”. μ›ν•˜λŠ” ν™”λ©΄μ˜ λ‹¨λ©΄λ§Œ λ³΄μ—¬μ£ΌλŠ” 게 μ•„λ‹ˆλΌ, μœ μ €κ°€ μ§„μž…ν•΄ ν–‰λ™ν•˜λŠ” 일련의 과정을 νŒ¨ν„΄λ³„λ‘œ λ§€λ„λŸ½κ²Œ 확인할 수 μžˆμ–΄μš”. 덕뢄에 λ‹€μ–‘ν•œ κ²Œμž„μ΄ μœ μ € μΈν„°λž™μ…˜μ„ μ–΄λ–»κ²Œ μ„€κ³„ν–ˆλŠ”μ§€, κ·Έ 기획 μ˜λ„μ™€ λ§₯λ½κΉŒμ§€ μ§κ΄€μ μœΌλ‘œ νŒŒμ•…ν•  수 있죠.

2. ν˜„μ—…μ˜ λͺ©μ†Œλ¦¬λ₯Ό λ°˜μ˜ν•œ 8개의 μž₯λ₯΄ λΆ„λ₯˜

λͺ¨ν˜Έν–ˆλ˜ μž₯λ₯΄ ꡬ뢄을 싀무 κ΄€μ μœΌλ‘œ μ„ΈλΆ„ν™”ν•˜κ³ , 싀사RPG·캐주얼·퍼즐 λ“± μ‹€λ¬΄μžλ“€μ΄ κ°€μž₯ ν•„μš”λ‘œ ν–ˆλ˜ 8개 μž₯λ₯΄λ‘œ κ΅¬μ„±ν–ˆμ–΄μš”.

3. κ²Œμž„ μ „μš© μ»΄ν¬λ„ŒνŠΈ νƒœκ·Έ μ‹ μ„€

μ‘°μž‘ν‚€, μΏ¨νƒ€μž„, HPλ°”μ²˜λŸΌ κ²Œμž„μ˜ νŽΈμ˜μ„±μ„ μ’Œμš°ν•˜λŠ” μ»΄ν¬λ„ŒνŠΈ μš”μ†Œ 12쒅을 μƒˆλ‘­κ²Œ μΆ”κ°€ν•΄μ„œ 총 50κ°€μ§€μ˜ μ»΄ν¬λ„ŒνŠΈλ₯Ό 필터링할 수 μžˆμ–΄μš”.

μΆ”κ°€λœ μ»΄ν¬λ„ŒνŠΈ: λ„€λΉ„κ²Œμ΄μ…˜&νƒ­λ°”, λ“±κΈ‰&ν‹°μ–΄, μ•„μ΄μ½˜ κ·Έλž˜ν”½, μ‘°μž‘ν‚€, 지도&λ§΅, 잠금/λ―Έν•΄κΈˆ, 캐릭터, μΏ¨νƒ€μž„, 타이머, ν”„λ‘œν•„ 이미지, HPλ°” κ²Œμ΄μ§€, μ—°μΆœ

4. 이미지 λ‚΄ ν…μŠ€νŠΈκΉŒμ§€ μΈμ‹ν•˜λŠ” 기술 λ„μž…

μŠ€ν¬λ¦°μƒ· 속 λ²„νŠΌλͺ…, 메뉴λͺ…, μ•„μ΄ν…œλͺ…κΉŒμ§€ OCR둜 검색할 수 μžˆμ–΄μš”. μ›ν•˜λŠ” ν‚€μ›Œλ“œλ§Œ μž…λ ₯ν•˜λ©΄ ν•΄λ‹Ή ν…μŠ€νŠΈκ°€ ν¬ν•¨λœ κ²Œμž„ 화면을 λΉ λ₯΄κ²Œ μ°Ύμ•„ 레퍼런슀 탐색 μ‹œκ°„μ„ μ€„μ—¬μ€λ‹ˆλ‹€.

5. κ²Œμž„ 맞좀 맀좜 ν•„ν„°, μ—°μΆœλ§Œ 보기 ν•„ν„° 제곡

여기에 μ‹€μ œ κ²Œμž„ λΉ„μ¦ˆλ‹ˆμŠ€μ˜ νŠΉμ„±μ„ μ„Έμ‹¬ν•˜κ²Œ λ°˜μ˜ν•œ ν•„ν„° κΈ°λŠ₯도 λ”ν•΄μ‘Œλ‹΅λ‹ˆλ‹€. κ²Œμž„ μ‹œμž₯μ—μ„œλŠ” MAU보닀 맀좜 μ§€ν‘œκ°€ 더 μ€‘μš”ν•˜λ‹€λŠ” μ‹€λ¬΄μž ν”Όλ“œλ°±μ„ λ°˜μ˜ν•΄ μ›” 맀좜 ꡬ간별 ν•„ν„°λ₯Ό μΆ”κ°€ν–ˆμ–΄μš”. λ˜ν•œ μΈν„°λž™μ…˜μ΄ 핡심인 κ²Œμž„ νŠΉμ„±μ— 맞좰 'μ—°μΆœλ§Œ 보기 ν•„ν„°'도 더해 탐색 νš¨μœ¨μ„ λ†’μ˜€μ–΄μš”.

3쀄 μš”μ•½

1. 싀무 μΈν„°λ·°λ‘œ μ •λ¦½ν•œ μž₯λ₯΄Β·νŒ¨ν„΄Β·μ»΄ν¬λ„ŒνŠΈ λΆ„λ₯˜ μ„€κ³„λ‘œ μ›ν•˜λŠ” 레퍼런슀λ₯Ό ν•œ λ²ˆμ— 찾을 수 μžˆμ–΄μš”.

2. κ²Œμž„ λΉ„μ¦ˆλ‹ˆμŠ€μ˜ 핡심인 맀좜 필터와 μ—°μΆœ μš”μ†Œλ₯Ό λͺ¨μ•„λ³΄λŠ” ν•„ν„°λ‘œ 탐색 νš¨μœ¨μ„ λ†’μ˜€μ–΄μš”.

3. ν”Œλ‘œμš° 쀑심 레퍼런슀 κ΅¬μ„±μœΌλ‘œ μœ μ €μ˜ 동선과 UX λ§₯락을 ν•œλˆˆμ— νŒŒμ•…ν•  수 μžˆμ–΄μš”.

더 μžμ„Έν•œ λ‚΄μš©μ„ ν™•μΈν•˜κ³  μ‹Άλ‹€λ©΄ μ•„λž˜ 아티클을 ν™•μΈν•΄λ³΄μ„Έμš”!  
κ²Œμž„ μ „μš© μœ μ•„μ΄λ³Ό 단톑방, μƒˆλ‘œ μƒκ²Όμ–΄μš”!
μœ μ•„μ΄λ³Ό κ²Œμž„ μ „μš© 단톑방이 μƒκ²Όμ–΄μš”.
μœ μ•„μ΄λ³Όμ˜ 일원이 λ˜μ–΄ μ§€κΈˆ λ°”λ‘œ μž…μž₯ν•΄λ³΄μ„Έμš”!
μ΄μ œλŠ” κ²Œμž„ 레퍼런슀 μˆ˜μ§‘λ„ μœ μ•„μ΄λ³Όμ— λ§‘κ²¨λ‘μ„Έμš”.