본문 바로가기

Developer/3D Planar Nets

3D 전개도 앱 개발기-1

Planar Nets, 전개도.


여타의 개발처럼 전개도 앱 개발 또한 그 적절한 동기가 있었으니, 그 중요성에 비해 효과적인 학습 수단이 없다는 것이었다. 입체를 학습하는데 있어서는 3D(+AR, VR) 소프트웨어의 학습 효과성이 전통적 교수방법 및 매체의 그것을 크게 능가한다는 것을 부연설명하지는 않겠다.

 

 중요한 것은, 입체의 학습에 있어서 전개도가 차지하는 비중과 중요성이 다른 학습 요소에 비해 상당히 큼에도 불구하고, 이를 학습하기 위한 적절한 교육용 소프트웨어가 존재하지 않는다는 점이다. 물론, 전개도 학습에 대한 관련 소프트웨어가 활용되고 있지 않은 것은 아니나, 1) 학습자의 능동적 조작을 지원하지 못하는 점, 2) 다양한 형태와 수준의 입체도형을 학습자에게 제공해주지 못하는 점, 3) 게임화된 학습 환경을 제공해주지 못하는 점에 있어 그 한계점이 명확하다고 할 수 있다.

 

 이에 나는 다음과 같은 개발 기준을 설정하게 되었다(이러한 개발 기준은 개발 과정에서 수정/추가되어왔다.)

  • 다양한 형태의 입체도형을 제공할 것. 
  • 학습자의 능동적 조작을 지원할 것.
  • 게임화된 학습 환경을 통해 보상과 몰입을 적절히 제공할 것.
  • 공간감각과 관련된 학습 활동과 연계할 것.

 3D 전개도 앱 개발기에서는, Unity3D를 활용한 프로그램 개발과정에서 마주쳤던 다양한 형태의 질문과 이에 대한 해결 과정(삽질기)와 얻게 된 인사이트들, 소소한 팁과 생각들을 글로써 남겨두고자 한다.

 

 


다양한 형태의 입체도형을 어떻게 제공할 것인가?

 

초중등 수준에서 활용되는 입체도형의 종류는 크게 각뿔과 각기둥으로 나눌 수 있다. 각뿔과 각기둥은 각각 밑면이 삼각형~육각형의 입체도형으로 선정할 수 있으며, 그 수는 총 12개가 된다. 자, 그럼 어떻게 만들 것인가?

처음 시도했던 방법은 유니티 애셋 중 하나인 Probuilder를 이용해 입체를 직접 만드는 것이었다.

일단, 입체도형을 구성하는 면을 만들고, 그 면을 적당히 회전시키고 이리붙이고 저리붙여 입체를 완성하고자 했다.

n각형의 면은 하단의 그림처럼 1개의 Plane을 갖고, n개의 Edge를 갖도록 했다.

이처럼 하나의 면을 Plane과 n개의 Edge로 분리함으로써, 향후 다양한 활동에 활용하려고 하였다.

 

 

그러나 프로그램 개발 도중에, 완전한 형태의 자유도와 다양성을 제공해주기 위해 위 방법은 폐기되고 말았다.

 

 


완전한 형태의 자유도와 다양성

 

이제 이 프로그램에서는 각기둥과 각뿔, 총 12 종류의 정형화된 입체도형을 보여주는 것이 아니라, 랜덤하게 형성되는 다양한 형태의 각기둥과 각뿔을 제공해줄 필요성이 있었다. 즉, 밑면이 정n각형이 아니라, 그냥 n각형이어야 하고, 높이가 고정되는 것이 아니라, 가변적이어야 했다. 이는, 위 방법, Probuilder를 통한 방법이 개똥이 되었음을 의미했다. 아니, 원래 Probuilder로 만드는 방법이 개똥이었을지도 모른다.

 

여하튼, 완전한 형태의 자유도와 다양성을 위해 입체도형을 만드는 새로운 방법은, 각 입체도형의 고유 속성값을 토대로 유니티에서 직접 입체도형을 조립하도록 하는 것이었다.

그 속성값은 사실 간단한데, 

각뿔의 경우 밑면 n개 꼭지점의 좌표정보와, 뿔의 좌표정보

각기둥의 경우 밑면 n개 꼭지점과 좌표정보와 높이 h만 있으면 된다.

 

이를 통해 생성할 수 있는 각기둥과 각뿔 입체도형의 종류는 다음과 같다.

public enum FigureType {Corn_Triangle_Same, Corn_Triangle_Iso, Corn_Triangle_Right, 
                        Corn_Square_Same, Corn_Square_Right, 
                        Corn_Pentagon_Same, 
                        Corn_Hexagon_Same, 
                        Pillar_Triangle_Same, Pillar_Triangle_Iso, Pillar_Triangle_Right,
                        Pillar_Square_Same, Pillar_Square_Right, 
                        Pillar_Pentagon_Same, Pillar_Hexagon_Same,
                        Center_Corn_Custom,		//밑면 중앙에 수직
                        Tilted_Corn_Custom,		
                        Flat_Pillar_Custom,		//윗면이 평평
                        Tilted_Pillar_Custom
}; 

 

각 입체도형은 다음과 같은 계층 구조로 구성된다.

 

Figure

  • Face1
    • Plane
    • EdgeParent
      • Edge1
    • DotParent
      • Dot1

 

활용 스크립트 및 생성 과정은 다음과 같다.

- 입체도형의 생성과 관리는 담당하는 FigureManager는 개별 Figure에 존재함.

- 각 Figure의 Plane, EdgeParnet, DotParent에는 각각의 Managing script가 존재함.

- 입체도형 생성을 위한 FigureData는 외부에서 생성되어 FigureManager에 입력됨.

- FigureData를 입력받은 FigureManager는 이를 토대로 도형을 생성함.

 

 

IEnumerator startInitializing_FigureGO(GameObject go){ 
    FigureManager figureManager = go.GetComponent<FigureManager>();
    figureManager.setFigureData(figureData);
    yield return StartCoroutine(figureManager.generateInitialFigure());  
}

 

이렇게 생성된 Figure의 하이어라키는 다음과 같이 나타난다.

 

 

이제, 완전히 custom한 형태의 입체도형도 만들 수 있게 되었다.

'Developer > 3D Planar Nets' 카테고리의 다른 글

3D 전개도 앱 개발기-2  (0) 2020.05.12