d r t w i n

본 예제를 진행하기 위하여 필요한 소스 파일은 아래의 것을 다운받으세요. 다운로드 : Rabbit_Source.zip Rabbit_Source.unitypackage (동일한 것임) 본 과정을 완성하였을때의 결과물은 다음 영상과 같습니다. 유니티를 활용하여 아동용 앱북 만들기의 첫번...

애니메이션을 만드는 기본 방법을 배웁니다. 가장 중요한 기능이기 때문에, 이 부분은 앱을 만들기 위해서 반드시 익혀야만 하는 기능입니다. 애니메이션은 녹화 기능을 이용하면 큰 어려움없이 움직임을 기록할 수 있습니다. 애니메이션을 생성하게 되면 Anim...

호수 애니메이션을 만들어봅니다. 평상시에는 물결 애니메이션을 보여주다가, 호수를 클릭하면 물고기가 튀어오르는 연출을 해봅니다. 중요한 점은, 애니메이션을 위한 소스 준비할때 모두 동일한 크기로 만들어야 한다는 점입니다. 만일 움직임이 묘사된 부분...

토끼가 사다리를 타고 내려온 후, 화면 가운데 대기하는.. 그리고 토끼를 클릭하게 되면 사다리 아래로 내려가는 장면을 보여주는 연출을 해봅니다. 캐릭터가 화면 바깥으로 사라지는 상황이 연출의 엔딩이 되는 경우, 사용자 입장에서는 단 한번 밖에 누를 수...

사운드를 추가하여 소리를 내는 방법을 배워봅니다. 사운드를 재생시키기 원하는 이미지를 선택하여 AudioSource 컴포넌트를 추가하고 AudioClip 항목에 mp3 파일을 지정하는 것으로 쉽게 추가할 수 있습니다. 사운드 기능은 별도의 함수로 분리하여 구현하는 ...

사운드를 추가하고 난 후 알게되는 두가지 문제는.. 첫째 소리의 타이밍이 애니메이션과 틀리기 때문에 재생시점의 조정이 필요하다는 점 둘째 클릭할 때마다 소리가 즉시 발생하기 때문에 재생의 제한이 필요하다는 점입니다. 먼저 첫번째 문제의 해결을 위해...

다음은 두번째 문제로, 재생하는 동안 중복 재생이 발생하는 문제를 해결합니다. 이의 해결방안은 역시나 해당 IEnumerate 함수는 yield return new WaitForSeconds 라는 명령어를 통해서 애니메이션이 재생되는 시간동안에 입력이 발생해도 이를 무시하도록 ...

화면 상의 한 오브젝트를 클릭 시, 눌려진 오브젝트만 애니메이션 반응하는 것이 아니라 다른 오브젝트에도 동작 반응을 이끌어내는 것, 아마도 멋진 장면 연출을 위해 꼭 필요한 상황일 것입니다. 어찌보면 다소 어려운 개념처럼 느껴질 수 있겠지만, 원리는 ...

두번째 장면을 만들어봅니다. 이 장면에는 3개의 애니메이션을 구현할 예정입니다. 그런데 첫번째 장면과의 차이점이라고 한다면 3개의 애니메이션이 동시에 연출되는 것이 아니라 맨처음 하나만 존재하고, 그것을 클릭하면 애니메이션이 서서히 사라지면서 다...

만들어진 3개의 애니메이션을 순서대로 구동될 수 있도록 해주어야 합니다. 이를 위해서는 개별적인 애니메이션에서 다른 애니메이션을 구동시킬 수 있도록 해주는게 필요합니다. 따라서 애니메이션 창에서 이벤트 기능을 통해서 이를 구현하는 방법을 배워봅...

세번째 장면은 드래그드롭 장면을 만들어보는 것입니다. 배경과 캐릭터 소스를 배치하여 기본적인 연출을 한 후, Canvas 요소에 대해 배워봅니다. 특히 Canvas는 UI를 만들기 위해 필요한 가장 상위 오브젝트이며, 처음에 함께 생성되는 EventSystem의 역할도 ...

버튼 및 텍스트를 하나 만들고 이들의 기본 속성을 살펴봅니다. 특히 중요한 것은 Rect Transform의 개념 및 Anchor Preset 설정입니다. UI요소는 사각형 프레임 위에 놓일때의 좌표체계에 영향을 받기 때문에 레이아웃을 구조화할때 사전에 정렬부터 지정해놓...

드래그 요소를 만들기 위해서 UI요소 중에서 Image를 하나 생성한 후, 이 소스이미지를 바꿔봅니다. Panel은 드래그될 아이템을 담는 일종의 용기 개념으로 설정해야 합니다. Panel은 그 안에 담기는 드래그 아이템을 정렬해주는 기능을 갖추어야 보기 좋은 레...

드래그 기능은 사전에 만들어놓은 Draggable 스크립트를 활용하여 구현해봅니다. 드롭존 기능 또한 DropZone 스크립트를 적용하면 쉽게 구현됩니다. 드래그 아이템의 외형적인 짝을 맞추기 위한 조건을 만들어줍니다. 더불어 해당되는 짝만 받아들이는 드롭존 ...

드래그드롭 성공 시 뒷배경에 재미있는 이펙트를 보이게 하기 위해서, 상용 애셋을 활용해봅니다. 에셋은 아래에서 다운로드 하세요. 다운로드 : Cartoon FX Remaster 1.1.0.zip 먼저 원하는 애셋 효과를 탐색해서 마음에 드는 것을 찾아야 합니다. 이펙트가 ...

드래그드롭이 완료된 직후에 밋밋한 상황을 향상시키기 위해서, 맞춰진 드롭아이템이 움직이는 애니메이션 효과를 연출해봅시다. 나뭇가지의 크기가 반복되는 장면을 만들면서 DopeSheet가 아닌 Curve를 활용해봅니다. 그래프로 미세한 움직임을 제어할 수 있...

본 예제에서는 3개의 드롭아이템이 제대로 놓여질 때 이 상황을 판정하여 최종 애니메이션을 구현하는 방식으로 접근하고 있습니다. 때문에 Update 함수를 통해 ITEM1~3이 완료되는지 체크하는 bool 변수를 포함하고 있습니다. 드래그드롭이 성공적으로 완료되...

최종 애니메이션은 거미캐릭터가 디폴트위치로부터 여러 경로를 거쳐서 드롭아이템을 수거한 후, 가운데로 와서 최종 반복모션을 하고 있는 식으로 구현합니다. 드롭아이템이 사라지는 타이밍은 이 애니메이션의 타임라인에 Event 기능을 추가해서 함수를 실행...

메인화면을 만들어봅니다. 일반 페이지와 달리 메인페이지는 타이틀 제목과 버튼 인터페이스로 구성됩니다. 우선 전체 스토리에 알맞는 비주얼을 배치하여 화면 구성을 완성해봅니다. 그리고 파티클을 활용한 이펙트를 만들어봅니다. Legacy타입의 Particle 효...

메인화면의 기능구현을 쉽게 하기 위하여, 제가 미리 만들어놓은 프리팹이 있습니다. 아래의 것을 다운로드 하세요. 다운로드 : SceneManager v1.0.zip SceneManager v1.0.unitypackage import 된 프리팹은 UI라는 폴더를 새롭게 보여줄 것입니다. 그 중에서 m...