๐ŸŽฎ Unity ํƒ€์›Œ ๋””ํŽœ์Šค ๊ฐœ๋ฐœ๊ธฐ - [UI] ๋‘ ์”ฌ์„ ๋™์‹œ์— ๋ณด์—ฌ์ฃผ๋Š” ๋“€์–ผ ๋ทฐ UI ๋งŒ๋“ค๊ธฐ

5P2RS5ยท2026๋…„ 2์›” 19์ผ

์ปดํ“จํ„ฐ ์‚ด๋ฆฌ๊ธฐ

๋ชฉ๋ก ๋ณด๊ธฐ
8/8
post-thumbnail

2D ํ•˜์ด๋ธŒ๋ฆฌ๋“œ ํƒ€์›Œ ๋””ํŽœ์Šค ๊ฒŒ์ž„์˜ ํ•ต์‹ฌ ์‹œ์Šคํ…œ ๊ฐœ๋ฐœ ๊ณผ์ •
(์ง€๊ธˆ๊นŒ์ง€์˜ ์ž‘์—…๋ฌผ์„ AI๊ฐ€ ์ž‘์„ฑํ•ด์ค€ ๊ฐœ๋ฐœ์ผ์ง€)

Computer Defense๋Š” ๋‘ ๊ฐœ์˜ ์”ฌ์ด ๋™์‹œ์— ๋Œ์•„๊ฐ€๋Š” ๊ฒŒ์ž„์ด๋‹ค.

  • MainField : ํƒ€์›Œ๋ฅผ ์„ธ์›Œ ์ ์„ ๋ง‰๋Š” ์ „์žฅ
  • Core : ์„œ๋ฒ„๋ฅผ ๊ด€๋ฆฌํ•˜๋Š” ๊ณต๊ฐ„

ํƒ€์›Œ๊ฐ€ ๊ณต๊ฒฉํ•˜๋ฉด ์„œ๋ฒ„ ์˜จ๋„๊ฐ€ ์˜ค๋ฅธ๋‹ค.
์„œ๋ฒ„๊ฐ€ ๊ณผ์—ด๋˜๋ฉด ํƒ€์›Œ๊ฐ€ ๋ฉˆ์ถ˜๋‹ค.

์ฒ˜์Œ ๊ธฐํšํ•  ๋•Œ๋Š” โ€œ์•„, ์ด๊ฑฐ ์žฌ๋ฐŒ๊ฒ ๋‹คโ€ ์ •๋„์˜€๋Š”๋ฐ
๋ง‰์ƒ ๋งŒ๋“ค๋‹ค ๋ณด๋‹ˆ ๋ฌธ์ œ๊ฐ€ ๋ฐ”๋กœ ๋ณด์˜€๋‹ค.


TAB ์ „ํ™˜์€ ์ƒ๊ฐ๋ณด๋‹ค ๋ถˆ์นœ์ ˆํ–ˆ๋‹ค

์ฒ˜์Œ์—” TAB ํ‚ค๋กœ ์”ฌ์„ ์ „ํ™˜ํ•˜๊ฒŒ ๋งŒ๋“ค์—ˆ๋‹ค.

์ „์žฅ ๋ณด๊ณ , TAB
์„œ๋ฒ„ ๋ณด๊ณ , TAB
๋‹ค์‹œ ์ „์žฅ ๋ณด๊ณ โ€ฆ

์ด๊ฒŒ ๊ดœ์ฐฎ์„ ์ค„ ์•Œ์•˜๋‹ค.

๊ทธ๋Ÿฐ๋ฐ ํ”Œ๋ ˆ์ดํ•ด๋ณด๋‹ˆ๊นŒ ๊ณ„์† ์ด๋Ÿฐ ์ƒํ™ฉ์ด ๋‚˜์™”๋‹ค.

ํƒ€์›Œ๋งŒ ์—ด์‹ฌํžˆ ์ง“๋‹ค๊ฐ€
๊ฐ‘์ž๊ธฐ ๋ชจ๋“  ํƒ€์›Œ๊ฐ€ ๋ฉˆ์ถ˜๋‹ค.

์„œ๋ฒ„๊ฐ€ ์ด๋ฏธ ๊ณผ์—ด์ด์—ˆ๋Š”๋ฐ
ํ”Œ๋ ˆ์ด์–ด๊ฐ€ ๋ชป ๋ณด๊ณ  ์žˆ์—ˆ๋˜ ๊ฑฐ๋‹ค.

์ด๊ฑด ์ „๋žต ์‹คํŒจ๊ฐ€ ์•„๋‹ˆ๋ผ
UI ์„ค๊ณ„ ์‹คํŒจ์˜€๋‹ค.

๊ทธ๋ž˜์„œ ๊ฒฐ๋ก ์„ ๋ฐ”๊ฟจ๋‹ค.

๋‘ ์”ฌ์„ ๊ทธ๋ƒฅ ๋™์‹œ์— ๋ณด์—ฌ์ฃผ์ž.


RenderTexture๋กœ ๋‘ ์”ฌ์„ ๋ถ™์ด๊ธฐ

๊ตฌ์กฐ ์ž์ฒด๋Š” ์ƒ๊ฐ๋ณด๋‹ค ๋‹จ์ˆœํ–ˆ๋‹ค.

๊ฐ ์”ฌ ์นด๋ฉ”๋ผ๊ฐ€ ํ™”๋ฉด์— ์ง์ ‘ ๊ทธ๋ฆฌ๋Š” ๋Œ€์‹ 
RenderTexture์— ๋ Œ๋”๋งํ•˜๊ฒŒ ๋งŒ๋“ค๊ณ 
๊ทธ๊ฑธ UI RawImage์— ๋ถ™์˜€๋‹ค.

[MainField Camera] โ†’ RenderTexture โ†’ RawImage (์™ผ์ชฝ)
[Core Camera] โ†’ RenderTexture โ†’ RawImage (์˜ค๋ฅธ์ชฝ)

์ด ๋‹จ๊ณ„๊นŒ์ง€๋Š” โ€œ์–ด? ์‰ฌ์šด๋ฐ?โ€ ์‹ถ์—ˆ๋‹ค.

์ง„์งœ ๋ฌธ์ œ๋Š” ๊ทธ ๋‹ค์Œ์ด์—ˆ๋‹ค.


50:50์€ ์ƒ๊ฐ๋ณด๋‹ค ์• ๋งคํ•˜๋‹ค

์ฒ˜์Œ์—” ํ™”๋ฉด์„ ๋”ฑ ๋ฐ˜์œผ๋กœ ๋‚˜๋ˆด๋‹ค.
๊ทผ๋ฐ ๋‘˜ ๋‹ค ์• ๋งคํ•˜๊ฒŒ ์ž‘๋‹ค.

๊ทธ๋ž˜์„œ ๊ธฐ๋ณธ ๋น„์œจ์„ ์ด๋ ‡๊ฒŒ ์žก์•˜๋‹ค.
-> MainField 60% : Core 40%
. ์ „์žฅ์ด ๋ฉ”์ธ์ด๋‹ˆ๊นŒ ์‚ด์ง ๋” ํฌ๊ฒŒ.
. ๊ทธ๋ฆฌ๊ณ  TAB์„ ๋ˆ„๋ฅด๋ฉด ํฌ์ปค์Šค๊ฐ€ ์ด๋™ํ•˜๊ฒŒ ๋งŒ๋“ค์—ˆ๋‹ค.
๊ธฐ๋ณธ (60:40)
โ†’ Core ํฌ์ปค์Šค (20:80)
โ†’ Main ํฌ์ปค์Šค (80:20)
โ†’ ๋‹ค์‹œ ๊ธฐ๋ณธ

์ฆ‰๊ฐ ๋ฐ”๋€Œ๋ฉด ๋„ˆ๋ฌด ํŠ€์–ด์„œ
0.3์ดˆ ์ •๋„ ์• ๋‹ˆ๋ฉ”์ด์…˜์„ ๋„ฃ์—ˆ๋‹ค.

์—ฌ๊ธฐ๊นŒ์ง€๋Š” ๊ฝค ๋งŒ์กฑ์Šค๋Ÿฌ์› ๋‹ค.


ํ™”๋ฉด์ด ์ฐŒ๊ทธ๋Ÿฌ์ง„๋‹ค

๋””๋ฐ”์ด๋”๋ฅผ ๋“œ๋ž˜๊ทธํ•ด์„œ ๋น„์œจ์„ ๋ฐ”๊ฟ€ ์ˆ˜ ์žˆ๊ฒŒ ๋งŒ๋“ค์—ˆ๋‹ค.

๊ทธ๋ฆฌ๊ณ  ๋ฐ”๋กœ ์ด์ƒํ•œ ๊ฑธ ๋ฐœ๊ฒฌํ–ˆ๋‹ค.

MainField๋ฅผ ์ค„์ด๋ฉด
์บ๋ฆญํ„ฐ๊ฐ€ ํ™€์ญ‰ํ•ด์ง„๋‹ค.

ํƒ€์ผ๋งต์ด ๋ˆŒ๋ฆฐ๋‹ค.

์™œ์ง€?

RawImage๊ฐ€ RenderTexture๋ฅผ
์˜์—ญ์— ๋งž์ถฐ ์Šค์ผ€์ผ๋งํ•˜๊ณ  ์žˆ์—ˆ๋‹ค.

๋‚˜๋Š” ์••์ถ•์„ ์›ํ•œ ๊ฒŒ ์•„๋‹ˆ๋ผ
์ž˜๋ผ๋‚ด๊ธฐ๋ฅผ ์›ํ–ˆ๋‹ค.


uvRect๋กœ ํ•ด๊ฒฐ

RawImage์˜ uvRect๋ฅผ ์กฐ์ ˆํ•˜๋ฉด
ํ…์Šค์ฒ˜์˜ ์ผ๋ถ€๋งŒ ํ‘œ์‹œํ•  ์ˆ˜ ์žˆ๋‹ค.

๋น„์œจ์ด ์ค„์–ด๋“ค๋ฉด
์–‘์ชฝ์ด ์ž˜๋ ค๋‚˜๊ฐ€๊ฒŒ ๊ณ„์‚ฐํ–ˆ๋‹ค.

์—ฌ๊ธฐ์„œ ๋˜ ํ•œ ๋ฒˆ ์‚ฝ์งˆํ–ˆ๋‹ค.

์™ผ์ชฝ๋ถ€ํ„ฐ ์ž˜๋ผ๋‚ด๋ฉด
๋””๋ฐ”์ด๋” ์œ„์น˜๋ž‘ ํ™”๋ฉด ๊ฒฝ๊ณ„๊ฐ€ ์•ˆ ๋งž๋Š”๋‹ค.

๊ฒฐ๊ตญ ์ค‘์•™ ๊ธฐ์ค€์œผ๋กœ ์ž๋ฅด๋Š” ๋ฐฉ์‹์œผ๋กœ ์ˆ˜์ •.

์ด ๋ถ€๋ถ„์—์„œ โ€œ์•„, UI๋Š” ์ง„์งœ ๋””ํ…Œ์ผ ์‹ธ์›€์ด๊ตฌ๋‚˜โ€ ์‹ถ์—ˆ๋‹ค.


์นด๋ฉ”๋ผ๊ฐ€ ๋„ˆ๋ฌด ๋งŽ์•˜๋‹ค

์”ฌ์ด 3๊ฐœ์˜€๋Š”๋ฐ
์นด๋ฉ”๋ผ๊ฐ€ 5๊ฐœ์˜€๋‹ค.

๊ทธ์ค‘ 3๊ฐœ๊ฐ€ MainCamera ํƒœ๊ทธ.

๊ทธ ์ƒํƒœ์—์„œ Camera.main์„ ์“ฐ๊ณ  ์žˆ์—ˆ๋‹ค.

๋‹น์—ฐํžˆ ํด๋ฆญ ์ขŒํ‘œ๊ฐ€ ๊ฐ€๋” ํ‹€์–ด์กŒ๋‹ค.

๋ฒ„๊ทธ ์›์ธ์„ ์ฐพ๋Š” ๋ฐ ์ƒ๊ฐ๋ณด๋‹ค ์˜ค๋ž˜ ๊ฑธ๋ ธ๋‹ค.

ํ•ด๊ฒฐ์€ ๋‹จ์ˆœํ–ˆ๋‹ค.

  • Persistent ์”ฌ ์นด๋ฉ”๋ผ๋Š” ๋ Œ๋”๋ง ์•ˆ ํ•˜๊ฒŒ ์ •๋ฆฌ
  • Camera.main ์•ˆ ์“ฐ๊ณ  ์ง์ ‘ ์ฐธ์กฐ

์ด๊ฑฐ ์ •๋ฆฌํ•˜๊ณ  ๋‚˜๋‹ˆ๊นŒ
์ž…๋ ฅ ๊ด€๋ จ ์ด์ƒํ•œ ๋ฒ„๊ทธ๊ฐ€ ์‹น ์‚ฌ๋ผ์กŒ๋‹ค.


์นด๋ฉ”๋ผ๋„ ์—ญํ• ์ด ๋‹ฌ๋ผ์•ผ ํ–ˆ๋‹ค

์ฒ˜์Œ์—” ๋‘ ์นด๋ฉ”๋ผ ๋‹ค ํ”Œ๋ ˆ์ด์–ด๋ฅผ ๋”ฐ๋ผ๋‹ค๋…”๋‹ค.

๊ทผ๋ฐ MainField๋Š” ํ”Œ๋ ˆ์ด์–ด๊ฐ€ ์—†๋Š” ์”ฌ์ด๋‹ค.

์ „์žฅ์€ ๋„“๊ฒŒ ๋ณด๊ณ  ์‹ถ๊ณ ,
Core๋Š” ํ”Œ๋ ˆ์ด์–ด ์ค‘์‹ฌ์ด ๋งž๋‹ค.

๊ทธ๋ž˜์„œ ์ด๋ ‡๊ฒŒ ๋ฐ”๊ฟจ๋‹ค.

  • MainField : ๋“œ๋ž˜๊ทธ ํŒจ๋‹ + ์คŒ
  • Core : ํ”Œ๋ ˆ์ด์–ด ์ถ”์  + ์คŒ

RawImage ์œ„์—์„œ ๋ฐœ์ƒํ•˜๋Š” ๋งˆ์šฐ์Šค ์ด๋ฒคํŠธ๋ฅผ
ํ•ด๋‹น ์”ฌ ์นด๋ฉ”๋ผ๋กœ ๋„˜๊ฒจ์ฃผ๋Š” ๋ฐฉ์‹์œผ๋กœ ์ฒ˜๋ฆฌํ–ˆ๋‹ค.

์™ผ์ชฝ์—์„œ ์Šคํฌ๋กคํ•˜๋ฉด ์™ผ์ชฝ๋งŒ ์คŒ.
์˜ค๋ฅธ์ชฝ์—์„œ ์Šคํฌ๋กคํ•˜๋ฉด ์˜ค๋ฅธ์ชฝ๋งŒ ์คŒ.

์ด๊ฒŒ ์ƒ๊ฐ๋ณด๋‹ค ๋งŒ์กฑ๋„๊ฐ€ ๋†’์•˜๋‹ค.


์ง€๊ธˆ ๋‚ด๊ฐ€ ์–ด๋””๋ฅผ ์กฐ์ž‘ ์ค‘์ธ์ง€ ๋ณด์—ฌ์ฃผ๊ธฐ

๋‘ ํ™”๋ฉด์ด ๋™์‹œ์— ๋ณด์ด๋ฉด
์กฐ์ž‘ ์ค‘์ธ ์”ฌ์ด ํ—ท๊ฐˆ๋ฆฐ๋‹ค.

๊ทธ๋ž˜์„œ ๋น„ํ™œ์„ฑ ์”ฌ ์œ„์—
๋ฐ˜ํˆฌ๋ช… ์˜ค๋ฒ„๋ ˆ์ด๋ฅผ ์”Œ์› ๋‹ค.

๋‹จ์ˆœํ•œ UI Image ํ•˜๋‚˜.

๊ทผ๋ฐ ์ด๊ฑฐ ํ•˜๋‚˜๋กœ ์ฒด๊ฐ์ด ๊ฝค ๋‹ฌ๋ผ์กŒ๋‹ค.

๊ธฐ๋ณธ(60:40) ์ƒํƒœ์—์„œ๋Š”
๋‘˜ ๋‹ค ํ™œ์„ฑ์œผ๋กœ ๋‘์—ˆ๋‹ค.


์ƒ๊ฐ๋ณด๋‹ค ์ผ์ด ์ปค์กŒ๋‹ค

์ฒ˜์Œ์—” ๊ทธ๋ƒฅ

โ€œ๋‘ ํ™”๋ฉด ๋‚˜๋ž€ํžˆ ๋‘๋ฉด ๋˜๊ฒ ์ง€โ€

๋ผ๊ณ  ์ƒ๊ฐํ–ˆ๋‹ค.

๊ทผ๋ฐ ์‹ค์ œ๋กœ๋Š”:

  • ํ…์Šค์ฒ˜๋ฅผ ์ž๋ฅด๋Š” ๋ฌธ์ œ
  • ์นด๋ฉ”๋ผ ํƒœ๊ทธ ์ถฉ๋Œ
  • ์ž…๋ ฅ ์ขŒํ‘œ ๊ผฌ์ž„
  • ์นด๋ฉ”๋ผ ์—ญํ•  ์žฌ์„ค๊ณ„
  • ํ™œ์„ฑ ์”ฌ ์‹œ๊ฐํ™”

ํ•˜๋‚˜ ๊ณ ์น˜๋ฉด ๋‹ค๋ฅธ ๊ฒŒ ์˜ํ–ฅ์„ ๋ฐ›์•˜๋‹ค.

์ด๊ฑด UI ์ž‘์—…์ด ์•„๋‹ˆ๋ผ
๊ฒŒ์ž„ ๊ตฌ์กฐ๋ฅผ ๋‹ค์‹œ ์ •๋ฆฌํ•˜๋Š” ์ž‘์—…์— ๊ฐ€๊นŒ์› ๋‹ค.


profile
โ˜€๏ธ Infra_Architecture ๐Ÿ” ๐ŸŒ” Game_Dev

0๊ฐœ์˜ ๋Œ“๊ธ€