비주얼 스크립팅을 처음 공부할 때 그리고 매뉴얼을 한글로 작성하면서 매우 헷갈리게 만드는 단어가 그래프, Graph이다. 비주얼 스크립팅이라는 말속에는 그래프라는 이미지의 의미가 담겨져 있는데, 처음 시작할 때 단순히 그 그래프 라는 이미지의 의미만 떠올리며 메뉴얼이나 설명서를 읽다 보면 무슨 말인지 이해하기 어렵게 되는 경우들이 있다. 따라서 기술적 개념이나 메뉴의 명칭에 익숙하지 않은 완전 초보자들을 위해 정리해 본다.
1. 코딩을 하다, 작업을 하다. 그래프를 그리다.
비주얼 스크립팅은 C#, PHP, Python, JAVA, LISP 같이 프로그래밍 언어 코드를 사용하지 않는다. 여기서 코딩을 한다는 것은 그래픽컬한 유닛(혹은 노드)들을 배치하고 논리적으로 연결하여 마치 그래프를 그려나가듯 작업해서 어떤 기능을 동작하도록 하는 것을 의미한다. 즉, "그래프(Graph)를 작성한다", "그래프 작업을 한다"라고 말하면 코딩을 한다는 의미가 된다.
2. 작업한 결과물을 지칭한 그래프, Graph
앞의 맥락에서 그래프 작업을 통해 그려진 작업 결과물 또한 그래프(Graph)라고 지칭하고 있다. "그래프 내부를 보면" 혹은 "그래프가 동작한다." 같은 말이 뜻하는 의미가 된다.
3. Script Graph / State Graph -- 스크립트의 형태에 따른 구분을 위한 그래프
게임 오브젝트에 Add Component를 해서 Machine을 검색하면 위와 같이 두 개의 Machine이 있다.
Script Graph는 Script Machine에서 작성한 그래프(Graph)를 의미하고, State Graph는 State Machine에서 작성한 그래프(Graph)를 의미한다. 참고로 여기서 알아야 할 것은 State Machine안에 있는 State Graph는 많은 Script Graph들로 작성이 된다는 것이다. 즉, State Graph는 상태(State)의 의미나 기능을 정의한 그래프(Graph)들인데 그 그래프들 내부는 Script Graph들로 채워져 있다는 것이다. 따라서 우리가 작업하는 Graph는 99%가 Script Graph인 것이다. 하지만 State Graph의 활용 역시 매우 중요하다.
4. Embed / Graph -- Graph가 존재하는 방식에서 Graph 에셋 파일을 참조한다는 의미로 활용
Embed는 작업한 그래프들이 Machine 컴포넌트 안에 내장이 되어진다는 의미이다. 즉, Transform에 좌표나 스케일이 있는 것 처럼 Machine 컴포넌트 안에 작업한 그래프들이 들어 있게 된다. 따라서 Machine 컴포넌트를 지우면 모두 날아간다.
Graph는 작업한 그래프들이 그래프 에셋 파일로 저장이 되어 있고 그 저장된 파일을 링크하여 참조해서 사용한다는 의미이다. Machine 컴포넌트가 삭제되어도 그래프 에셋 파일은 삭제되지 않는다.
이런 의미를 생각하면 Embed Graph 즉, 내장된 그래프, Graph Graph 그래프 에셋파일을 참조하는 그래프라는 말이 만들어져야 하는데 매우 어색해서 Embed 그리고 Graph 라고만 사용한다. 그래서 헷갈린다. 설명 맥락에 따라 그래프라는 단어를 이해해야 한다.
5. Graph Variable -- 지역 변수 개념으로써 그래프
그래프 편집창의 블랙보드(Blackboard)를 보면 변수탭들이 있다. 제일 왼쪽(앞쪽)에 Graph 탭이 있다. 그래프 변수(Graph Variable)를 의미한다. 현재 그래프(Graph)에만 그 변수가 생존하기 때문에 명칭을 그렇게 붙인 듯 하다. 즉, 다른 그래프에서는 사용할 수 없다.
6. 유니티의 메뉴 명칭
1> Edit Graph : 링크된(혹은 선택된) 그래프를 편집할 수 있도록 오픈한다.
2> Graph Inspector : 선택한 유닛들에 대한 정보와 편집할 수 있는 요소들이 나타난다.
3> Script Graph : 그래프 편집창이다. 작업 그래프가 Script Graph라는 것을 알 수 있다. State Graph라면 State Graph라고 표시된다.
4> Graph : Graph Variabe 탭
5> Visual Scripting Graph : 위의 이미지에 보이는 편집창을 띄운다. Machine 컴포넌트가 있는 경우 대부분 자동으로 오픈된다. 혹은 Edit Graph를 클릭하면 된다. 따라서 위의 메뉴를 찾아갈 필요는 없다.
6> Fuzzy Finde > Graph : 퍼지 파인더 안에 Graph 그룹은 작업자가 생성해 놓은 Graph 에셋 파일들이 자동으로 들어가 있다. Super Unit 같은 경우 퍼지 파인더에서 찾아 넣어도 편리하다.
참고: 파일을 공용 저장소(repository)에 푸시(push)한 경우 이 방법은 커밋 기록(commit history)에서 삭제되지 않는다. 비주얼 스크립팅 파일을 불법적으로 재배포하고 있는 경우. 저장소(repository)를 비공개로 설정하거나 비주얼 스크립팅 파일을 포함하지 않는 새 트리를 사용하여 새로운 저장로(repository)를 시작해야 한다.
반복된 작업을 빠르게 하기 위해 창 레이아웃(에디터 구성)과 바로 가기 키를 설정할 수 있다.이 글에서는 이러한 바로 가기뿐만 아니라 창 설정에 대한 개요를 제공한다.키보드 단축키를 사용하여 많은 비주얼 스크립팅 기능을 바로 실행할 수 있다. 비주얼 스크립팅 에디터는 3개의 메인 창이 있는데 "Window > Visual Scripting"에서 확인할 수 있다.
Graph(그래프): 메인 그래프 에디터.
Graph Inspector(그래프 인스펙터): 유닛과 기타 그래프 요소의 세부 정보를 확인하고 설정할 수 있는 인스펙터.
Blackboard(블랙 보드): 유닛의 입력 및 출력 포트를 편집한다. 또한 변수들을 정의하고 편집할 수 있다.
팁: 윈도우들을 배치하는 레이아웃 순서는 선호하는 방식으로 하면되지만, 다음을 고려하는 것이 좋다.
Graph Window(그래프 창)와 씬(scene) 뷰는 동일한 공간에 배치한다.
Graph Inspector창은 Unity Inspector 창이 다른 창들의 옆에 독립적으로 있는 것처럼 배치한다.
역자 주) 위의 팁을 참고하면 아래처럼 하라는 것인데, 모니터 2개의 경우 Graph Window를 별도 창에 놓거나 Shit+Space Bar로 전체 화면으로 하는게 편리합니다.
그래프 창 최대화
전체 화면을 차지하도록 그래프 창을 최대화할 수 있다.이렇게 하면 Graph Inspector(그래프 인스펙터)와 변수 탭이 사이드에 잘 나타나게 된다.최대화하면 복잡한 그래프를 보다 보기 쉽게 시각화할 수 있다.최대화하는 방법에는 다음 세 가지가 있다.
마우스를 Graph Window(그래프 윈도우) 위에 놓고 Shift+Space를 클릭한다.
Graph Window 배경을 마우스로 더블 클릭한다.
도구 모음에서 최대화(Full Screen)를 선택한다.
사이드바의 레이아웃 단추를 사용하여 최대화된 뷰포트 주변의 각 패널들을 재정렬하거나 이동할 수 있다.
참고: 듀얼 모니터를 사용하는 경우 두 번째 모니터에서 비주얼 스크립팅 작업을 진행하는 것이 편리하다.이렇게 하면 그래프 편집 공간이 더 넓어지고 유니티 레이아웃이 그대로 유지된다. 전체 편집화면에서 사이드 바 윈도우(Graph Window, Blackboard)는 자동적으로 필요한 크기를 먼저 확보하도록 되어있다.
그래프 창
그래프를 선택하면 도구 모음이 그래프 창에 표시된다.
토글/이동/확대축소:
그래프 인스펙터를 닫거나 열기다.
블랙보드를 닫거나 열기한다.
그래프 인스펙터, 블랙보드를 화면의 왼쪽 혹은 오른쪽으로 이동시킨다. (참고-위 이미지에서는 보이지 않음)
그래프 윈도우(그래프 편집창)을 확대하거나 축소한다.
Relationships 옵션: 유닛의 내부 연결을 표시한다(스크립트 그래프에만 해당)
Value 옵션: 비주얼 스크립팅이 값을 예측하여 그래프의 연결선에 그 값을 표시한다(스크립트 그래프에만 해당).
Carry 옵션이 토글되면 현재 선택 영역의 하위 유닛들이 함께 움직인다.이것은 각 유닛을 수동으로 선택하지 않고 그래프의 많은 부분을 한 꺼번에 이동 및 배치하는데 유용하다.
Overview(개요) 버튼은 Graph Window 화면내에 작업된 전체 Graph가 모두 보여지도록 확대 또는 축소된다.
그래프 윈도우에서 두 요소(또는 그 이상)를 선택하면 정렬(Align) 및 분배(Distribute) 드롭다운 메뉴가 활성화되는데 이 메뉴를 통해 자동 레이아웃 작업을 할 수 있다.
바로 가기 및 키 바인딩
그래프 창을 이동 및 확대/축소하는 방법에는 두 가지 제어 체계가 있다. "Edit>Preferences>Visual Scripting"에서 제어 체계를 설정할 수 있다.기본 설정은 언리얼(Unreal)이다.
* Unreal : 마우스 휠 클릭 - 화면 좌우상하 이동 / 마우스 휠 회전 - 화면 확대 또는 축소
* Unity: 마우스 휠 클릭 - 화면 좌우상하 이동 / 마우스 휠 회전 - 상하이동 (여기서 화면 획대 축소는 Ctrl + 휠 회전)
참고: 트랙패드가 있고 두 손가락으로 그래프를 탐색하려면 해당 설정을 Unity로 변경하면 된다.
비주얼 스크립팅에는 두 가지 구성 옵션을 사용할 수 있다. "Edit(편집) > 프로젝트 설정(Project Settings) > 비주얼 스크립팅(Visual Scripting)"을 통해 다음의 두 가지 옵션에 구성 요소들을 업데이트(추가)할 수 있다.
* 타입 옵션(Type Options): 변수와 유닛들의 타입(type) 옵션. MonoBehaviour type은 기본적으로 포함되어져 있다. * 노드 라이브러리(Node Library): 유닛으로 사용하고자 하는 어셈블리(assemblies) 옵션. 기본적으로 모든 프로젝트와 유니티 어셈블리가 포함되어져 있다. 새 어셈블리를 추가하려면 "Add(+)"를 통해 추가한다.
각 옵션에는 그것이 무엇을 하는지 설명하는 툴팁이 있다. 옵션의 기능을 잘 모를 경우 기본값을 그대로 두고 나중에 변경할 수 있다.
참고: 일부 옵션은 재시작(restart)이 필요할 수 있다. 따라서 구성 변경 사항이 적용되지 않은 경우 편집기를 다시 시작한다.
역자 주) Type Options과 Node Library는 아직 이해하기 어렵습니다. 추후 숙련도가 올라가고 더 많은 기능의 사용이 필요해지게 될경우 자연스럽게 이해할 수 있게 됩니다.
비주얼 스크립팅은 코드를 쓰지 않고도 게임이나 응용 프로그램에 대한 로직을 만들 수 있게 해준다. 비주얼 스크립팅은 프로그래머뿐 아니라 기획자와 그래픽 디자이너 모두가 최종 로직을 설계하거나 프로토타입을 신속하게 만들수 있도록 하는 시각적 단위(비주얼 유닛, Visual Unit) 기반 그래프(Graph)들로 이루어져 있다. 비주얼 스크립팅은 프로그래머가 보다 고급 작업을 위해 사용하거나 다른 팀원이 사용할 수 있는 사용자 지정 유닛(커스텀 유닛, custom unit)을 만들수 있는 API도 제공한다.
비주얼 스크립팅은 함수, 연산자 또는 변수들을 그래픽 요소(graphical element)로 표현하고, 에지(여기서는 유닛들을 연결하는 선)를 사용하여 포트에 장치를 연결하는 방식의 개념에 기초하고 있다. 즉, 코드를 한 줄씩 써야 하는 대신, 모든 것을 시각적으로 작성한다.
설치(Installation) 2021.1 버전부터는 기본 패키지로 비주얼 스크립팅이 설치된다. 패키지 관리자에서 확인할 수 있다. 2019년형 LTS, 2020년형 LTS 등 이전 버전의 Unity는 Unity Asset Store를 통해 설치해야 한다.
비주얼 스크립팅 환경설정(Configuring visual scripting) 필요에 따라 "Edit > project setting"과 "Edit > preferences"에서 기본 설정을 변경할 수 있습니다.
화면 레이아웃 및 바로 가기 사용(Using Windows and shortcuts) 화면 레이아웃을 설정하고 바로 가기 키를 설정할 수도 있습니다.
비주얼 스크립팅 업데이트(Updating visual scripting) 비주얼 스크립팅 업데이트 하는 방법은 이곳에서 확인하세요.
시스템 요구 사항(System Requirements) 비주얼 스크립팅은 추가적인 다른 프로그램(external dependency)을 필요로 하지 않는다.
현재 2021 Unity Version에서 Visual Script를 실행하면 다음과 같은 에러가 발생됩니다.
--------- Error Message ---------
Failed to fetch inherited attributes on Unity.Plastic.Antlr3.Runtime.Tree.CommonTree.
System.TypeLoadException: Could not load type Antlr.Runtime.Tree.AntlrRuntime_BaseTreeDebugView while decoding custom attribute: (null)
at (wrapper managed-to-native) System.MonoCustomAttrs.GetCustomAttributesInternal(System.Reflection.ICustomAttributeProvider,System.Type,bool)
at System.MonoCustomAttrs.GetCustomAttributesBase (System.Reflection.ICustomAttributeProvider obj, System.Type attributeType, System.Boolean inheritedOnly) [0x00013] in <695d1cc93cca45069c528c15c9fdd749>:0
at System.MonoCustomAttrs.GetCustomAttributes (System.Reflection.ICustomAttributeProvider obj, System.Type attributeType, System.Boolean inherit) [0x002b3] in <695d1cc93cca45069c528c15c9fdd749>:0
at System.RuntimeType.GetCustomAttributes (System.Type attributeType, System.Boolean inherit) [0x00038] in <695d1cc93cca45069c528c15c9fdd749>:0
at System.Attribute.GetCustomAttributes (System.Reflection.MemberInfo element, System.Boolean inherit) [0x00052] in <695d1cc93cca45069c528c15c9fdd749>:0
at Unity.VisualScripting.AttributeUtility+AttributeCache..ctor (System.Reflection.MemberInfo element) [0x0002c] in D:\ProjectsDev\001 Purple Ocean Git\8 Visual Script Tutorial\Visual Script Tutorial\Library\PackageCache\com.unity.visualscripting@1.6.1\Runtime\VisualScripting.Core\Reflection\AttributeUtility.cs:56
이는 Unity에 기본적으로 설치된 "Version Control" 기능과 충돌이 나기 때문입니다.
이를 해결하기 위해서는 Version Control을 제거(Remove)하면 됩니다.
Version Control은 Unity "Collaborate" 기능과 "Plastic SCM"을 이용하는 것과 관련이 됩니다. 위 기능을 이미 아시는 분이라면 스스로 판단하시면 되지만 그렇지 않다면 사용할 일이 없을 듯 합니다. 게임 또는 앱을 만드는 유니티 본연의 기능과는 무관하고 팀작업을하거나 파일 관리를 지원하는 것인데 대부분 git이나 SVN을 사용할 가능성이 높고 개인 프로젝트라면 굳이 필요치 않습니다. 과감히 삭제하셔도 무관합니다.
"Unity > Window > Package Manager"에서 Version Control을 찾아 우측 하단의 "Remove"버튼을 눌러 제거해주세요.
이 글을 읽고 있다면 이미 비주얼 스크립트가 무엇인지 어느 정도는 알고 있으리라 판단이 됩니다. 따라서 복잡한 설명은 생략하고 한 가지만 말씀드린다면 어려운 코딩작업이 없이도 PC, 모바일(ANDROID, APPLE), WebGL 등 다양한 플랫폼의 앱이나 게임을 만드는게 가능하다는 것입니다. 그런데 중요한 것은 어느 수준의 어플리케이션을 개발할 수 있는가인데 적어도 이글에 관심이 있는 분이 상상하시는 것 정도는 모두 개발 가능하다고 감히 말씀드릴 수 있습니다.
유니티 비주얼 스크립트 혹은 볼트(Bolt) 스크립트에 대한 탄생 배경이나 지나온 과정들에 대한 이야기는 네이버 혹은 구글 검색을 통해 확인해 보시기 바랍니다.
<유니티 설치하기>
Visual Script를 사용하기 위해서는 유니티를 먼저 설치해야 합니다. 파워풀한 유니티 엔진을 코딩없이 사용할 수 있다는 것이 매우 놀라울 따름입니다.
유니티는 2021년도 최신버전을 설치해야합니다.
이전 버전들과는 달리 Visual Script가 기본으로 탑재되어 있기 때문에 별도의 Visual Script Package를 설치할 필요없이 바로 사용이 가능합니다.
