Unity 2D 블록 코딩에 대해서 알아보자 (1)

 

---

비주얼 스크립트는 팀 구성원이 코드를 처음부터 작성할 필요 없이

시각적 드래그 & 드롭 그래프로 스크립팅 로직을 만들 수 있도록 지워합니다.

이번 시간에는 Visual Scripting(비주얼 스크립트)에 대해 알아보도록 하겠습니다.

---

 

 

비주얼 스크립트 개요

비주얼 스크립트 장점

 

비주얼 스크립트의 장점은 비주얼 스크립팅은 Unity에서 아이디어를 테스트하고 변경하거나, 작업물을 직접 관리하려는 디자이너와 아티스트 모두에게 매우 유용한 솔루션 입니다. 자세한 설명은 아래의 표에 기재했습니다.

프로그래머가 아니더라도 기술적 지식이 있는 팀원이 만든 커스텀 노드와 그래프를 활용할

비주얼 스크립팅으로 커스텀 노드를 생성하여 팀 내 아티스트에서 디자이너에 이르는 협업을 간소화할 수 있음

프로그래밍 지식 수준에 관계없이 더 많은 팀원들이 프로토타이핑 또는 생산 중에 편리하게 협력 가능

 

비주얼 스크립트 인터페이스 설명

 

인터페이스는 위의 사진의 영문을 아래의 표에 설명을 보시면 됩니다.

(A)	툴바는 Unity 계정, Unity 클라우드 서비스, Unity 콜라보레이트, 재생, 일시정지 및 단계 컨트롤, Unity 검색, 레이어 가시성 메뉴, 에디터 레이아웃 메뉴(에디터 창에 대한 일부 대체 레이아웃을 제공하고 커스텀 레이아웃을 저장할 수 있도록 허용함)에 대한 액세스를 제공
(B)	계층 창은 씬의 모든 게임 오브젝트를 계층 구조에 텍스트로 표시 씬에 있는 각 항목마다 계층 구조에 엔트리가 있으므로 두 창은 본질적으로 연결, 계층 구조는 게임 오브젝트의 상호 연결 방식을 구조로 나타냅
(C)	게임 뷰는 씬 카메라를 통해 최종적으로 렌더링된 게임 모습을 시뮬레이션 Play 버튼을 클릭하면 시뮬레이션이 시작
(D)	씬 뷰에서는 씬을 시각적으로 탐색하고 편집할 수 있습니다. 씬 뷰에는 작업 중인 프로젝트 타입에 따라 3D 또는 2D 원근이 표시
(E)	오버레이에는 씬 뷰와 그 안에 있는 게임 오브젝트를 조작하기 위한 기본 툴이 들어있음 커스텀 오버레이를 추가하여 워크플로를 개선
(F)	인스펙터 창에서는 현재 선택된 게임 오브젝트의 모든 프로퍼티를 보고 편집 가능 게임 오브젝트 타입마다 서로 다른 프로퍼티를 포함하고 있기 때문에 다른 게임 오브젝트를 선택할 때마다 인스펙터 창의 레이아웃과 콘텐츠가 달라짐
(G)	프로젝트 창 에는 프로젝트에서 사용할 수 있는 에셋 라이브러리가 표시 프로젝트로 에셋을 임포트하면 이 창에 나타남
(H)	상태 표시줄은 다양한 Unity 프로세스에 대한 알림을 제공하고, 관련 툴 및 설정에 대한 빠른 액세스를 지원

 

비주얼 스크립트 라이브러리 설명

 

스크립트 기계 (Script Machine)는 개별적인 동작들과 값을 특정 순서로 연결 실행 순서는 스크립트(Script)의 흐름(Flow)로 나타냅니다.자세한 설명은 아래의 표를 보시면 됩니다.

개념	스크립트 그래프(Script Graph)는 매 프레임마다 또는 충돌과 같은 이벤트가 발생할 때 동작이 실행된다. 스크립트 그래프는 분기(branching, 역자 주-if, swith 같은), 루프(loop), 수학(math) 등과 같은 소위 "낮은 수준(low-level)"이라 일컬어지는 로직(logic)에 이용된다. 스크립트 그래프는 "언제 작동할 것인가?, 어떤 동작을 할 것인가? 그리고 어떤 순서로 동작할 것인가?"라는 질문에 가장 잘 대답한다.
머신(공통)	머신(앞쪽 글에서 이해를 위해 시스템으로 번역하였으나 이후 부터는 혼돈을 막기 위해 머신으로 번역함)는 게임 오브젝트에 추가되어 플레이 모드 중 그래프의 로직을 실행하는 구성요소다. 각 그래프는 스크립트 머신(Script Machine)과 상태 머신(State Machine)이 있다. 이들은 모두 비주얼 스크립팅 컴포넌트 분류에 있다. (8페이지 슬라이드 그림 참조)

 

 

상태 그래프(State Graphs)는 서로 다른 상태를 만들고 그 상태들 간에 전환을 생성합니다.

 각 상태(State)는 작은 프로그램 역할을 합니다. 자세한 설명은 아래의 표를 보시면 됩니다.

개념	상태 그래프(State Graph)는 AI 행동, 씬(Scene) 또는 레벨 구조(level structure), 그리고 상태 개념이 요구되는 "고 수준(high-levle)" 로직(logic)을 만드는 데 사용된다. 예를 들어, 몬스터 NPC가 "패트롤(patrol)", "추적(chase)" 및 "공격(attack)" 상태를 가져야 하는 경우, 혹은 어떤 문이 "잠금(locked)", "잠금 해제(unlocked)", "열림(open)" 상태를 가져야 하는 경우이다. 상태 그래프(state graphs)는 "현재 나의 행동은 무엇인가? 그리고 언제 그 행동이 바뀌어야 하는가?"라는 질문에 가장 잘 답한다.
머신(공통)	머신(앞쪽 글에서 이해를 위해 시스템으로 번역하였으나 이후 부터는 혼돈을 막기 위해 머신으로 번역함)는 게임 오브젝트에 추가되어 플레이 모드 중 그래프의 로직을 실행하는 구성요소다. 각 그래프는 스크립트 머신(Script Machine)과 상태 머신(State Machine)이 있다. 이들은 모두 비주얼 스크립팅 컴포넌트 분류에 있다.(8페이지 슬라이드 그림 참조)

 

 

비주얼 스크립트를 추가하는 방법은 메인 카메라 같은 인스펙터를 클릭하면 오른쪽에 컴포넌트를 추가 할 수 있습니다.

 

 

앞으로 2D 프로그래밍을 비주얼 스크립트로 할 경우 필요한 컴포넌트 입니다.

 

 

	임베드(Enbed)	그래프(Graph)
관계	작업한 그래프가 머신(Machine) 자체에 내장되어 진다.	작업한 그래프가 머신이 참조하는 에셋이다.
재이용가능성	다른 머신의 임베드 그래프는 재사용할 수 없지만, 프리팹 인스턴스 간에 공유된다.	동일한 그래프를 여러 개의 머신에 재사용할 수 있다. 같은 프리팹에 있지 않더라도 말이다.
영속성	머신 컴포넌트를 제거하면 내장 그래프가 삭제된다. 또한 스크립트 소스를 그래프(Graph)로 전환하면 내장(Embed) 그래프도 삭제된다	머신 컴포넌트를 제거해도 그래프 에셋은 여전히 존재한다. 소스를 임베드로 전환해도 그래프는 삭제되지 않는다.
씬	임베드 그래프는 프리팹으로 저장되지 않는 그 그래프가 속한 현재 씬의 게임 오브젝트를 가르킨다.	그래프는 어떤 씬에도 귀속되지 않기 때문에 현재 씬의 게임 오브젝트만을 가르킨다고 말할 수 없다.
프리팹	임배드 스크립트 머신(embed script를 가지고 있는 Machine)이 에디터에 존재한다면 프리팹을 인스턴스화하해서 사용해서는 안 된다.	그래프 스크립트 머신(graph script를 가지고 있는 machine)은 모든 프리팹상에서 안전하게 사용할 수 있다.

 

 

그래프 편집기(Graph Editor)는 편집기를 사용하여 Visual Scripting 그래프를 만들고 노드를 생성하고 이를 에지(여기서 에지란 노드와 연결 되어있는 흰색선을 말함)로 연결합니다.

제어 체계를 통해 그래프 편집기에서 일부 기본 단축키 및 동작을 변경합니다.

 

 

퍼지 파인더는 Visual Scripting에서 사용 가능한 모든 노드를 나열하는 검색 가능한 메뉴입니다.

그래프 편집기의 아무 곳이나 마우스 오른쪽 버튼으로 클릭하여 퍼지 파인더를 열 수 있으며,

검색 막대를 사용하여 이름으로 노드를 검색하거나 목록에서 범주를 열어 관련 노드를 볼 수 있습니다.

 

 

 

그래프 인스펙터(Graph Inspector)는 열려 있는 그래프 또는 Graph Editor에서 선택한 노드에 대한 추가 정보를 제공하며

노드에 추가 구성이 필요한 경우 Graph Inspector를 사용하여 이러한 값을 설정합니다.

Graph Inspector를 표시하거나 숨기려면 도구 모음에서 Graph Inspector를 선택합니다.

Graph Inspector를 Graph 창의 다른 쪽으로 이동하려면 Dock Right ( 도크 오른쪽 버튼. 화살표는 직사각형의 오른쪽을 가리킴.)또는 Dock Left ( 도크 왼쪽 버튼. 화살표는 직사각형의 왼쪽을 가리킴.)를 선택합니다.

 

 

칠판(BlockBoard)은 그래프에서 변수를 구성하고 관리하는 옵션을 제공하며,변수를 Graph,Object,Scene,App 및 Saved 의 5개 탭에 걸쳐 5개의 개별 범위로 나눕니다.

블랙보드를 표시하거나 숨기려면 도구 모음에서 블랙보드를 선택칠판 아이콘 문자 "x"는 각괄호로 둘러싸여 있습니다.

흑판을 그래프 창의 다른 쪽으로 이동하려면 오른쪽 도킹 ( 도크 오른쪽 버튼. 화살표는 직사각형의 오른쪽을 가리킴.) 또는 왼쪽 도킹 ( 도크 왼쪽 버튼. 화살표는 직사각형의 왼쪽을 가리킴.)을 선택합니다.

 

아래의 표는 이러한 비주얼 스크립트의 제어체계를 표로 나타낸 것입니다.

제어체계
팬(Pan)	가운데 클릭 및 끌기, 그래프 편집기에서 볼 수 있는 영역을 그래프의 원하는 부분으로 이동
세로로 이동(Pan Vertically)	스크롤, 기본 제어 체계를 사용하여 마우스의 스크롤 휠을 사용하여 그래프 편집기에서 보기를 세로로 이동
확대/축소(Zoom In/Zoom Out)	Ctrl+스크롤, 그래프 창에서 확대/축소 수준을 변경하여 그래프 편집기에 표시되는 그래프의 양을 제어

 

 

모두 프레임(Frame All)은 노드나 항목을 선택하지 않은 상태에서 홈을 누르면 그래프 편집기에서 전체 그래프를 중앙에 맞춰줍니다.

 

 

선택 만들기 (Create Selection)는 그래프에서 선택하려는 노드 또는 항목 주위에 선택 상자를 만들려면 클릭하고 끌어서 놓음

 

 

컨텍스트 메뉴 열기(Open Context Menu)는 상황에 맞는 메뉴를 열어 상태 그래프에서 특정 작업을 수행하거나 스크립트 그래프에서 선택 항목을 조작할 수 있습니다. 새 상태를 만들고 전환을 추가할 수 있습니다.

모두 선택 (Select All)으로 Ctrl+A(macOS: Cmd+A)를 눌러 현재 그래프의 모든 항목을 선택할 수 있습니다.

 

 

노드 그룹(Create Node Group)을 만들려면 노드 그룹을 생성하여 그래프의 관련 섹션을 함께 유지하거나 한 번에 여러 노드를 이동합니다.

노드는 iVsual Scripting에서 스크립트의 가장 기본적인 부분으로 이벤트를 수신하고 변수 값을 가져오고 GameObject의 구성 요소를 수정하는 등의 작업을 수행합니다.

이벤트를 수신하고 변수 값을 가져오고 GameObject의 구성 요소를 수정하는 등의 작업을 수행

노드를 클릭하고 드래그하여 그래프 편집기에서 노드를 이동

한 노드의 포트를 다른 노드의 호환 포트에 연결하여 에지를 생성합니다. 에지는 Visual Scripting 그래프에서 논리 흐름을 형성

 

 

스크립트 그래프에서 노드를 연결하려면 포트를 선택하고 그래프의 빈 영역을 가리키면 연결이 시작합니다.

포트를 선택하고 다른 노드의 기존 포트를 가리키거나 연결할 포트를 선택합니다.

두 노드 사이의 연결을 삭제하려면 그래프 창에서 스크립트 그래프를 연 상태에서

연결의 양쪽 끝에 있는 포트를 마우스 오른쪽 버튼으로 클릭합니다.

 

 

그래프창의 다섯가지 주요 요소
그래프 편집기(Graph Editor)	노드를 생성, 정렬 및 연결
퍼지 파인더(fuzzy finder)	노드를 찾아 그래프에 추가하는 데 사용
그래프 도구 모음(Graph toolbar)	그래프 편집기에서 보기에 특정한 설정을 변경하고 몇 가지 일반적인 레이아웃 작업을 수행
그래프 인스펙터(Graph Inspector)	노드에 대한 자세한 정보를 보고 그래프에 대한 추가 설정을 구성
칠판(BlockBoard)	그래프에서 사용할 변수를 정의하고 편집

 

 

스크립트 그래프에서 노드 추가할려면 그래프 창 에 스크립트 그래프가 열려 있는 상태에서 그래프 편집기의 빈 공간을 마우스 오른쪽 버튼으로 클릭하여 퍼지 파인더를 열면 됩니다.

퍼지 파인더에서 검색창에 검색어를 입력하거나 목록에서 카테고리를 선택하여 관련 노드를 찾습니다.

범주는 퍼지 파인더의 항목 끝에 화살표(>)가 있습니다.

퍼지 파인더에서 항목을 선택하여 해당 노드를 스크립트 그래프에 추가하면 됩니다.

 

비주얼 스크립트에 대한 개요를 간략하게 알아보았습니다. 다음 시간에는 비주얼 스크립트를 어떻게 사용하는지에 대해서 알아보도록 하겠습니다.