![[스타워즈] 세기의 대결, BB-8과 R2D2](https://i.ytimg.com/vi/A_A5e9F4CI0/hqdefault.jpg)
콘텐츠
최근 스타 워즈 공식 포스터와 예고편이 공개되면서 다음 작품에 대한 기대감이 사상 최고 수준에 이르렀습니다. 웹 디자이너 Carlos Sánchez García는 새 영화를 고대하는 팬 중 한 명입니다. 따라서 그는 참을성있게 기다리는 동안 새 캐릭터 BB-8 전용 사이트를 만들었습니다.
BB-8은 어떻게 작동합니까? 캐릭터 디자인, 컨셉, 그에게 생명을 불어 넣는 데 걸린 기술이면의 영감을 탐구합니다. 우리는 García와 그가 어떻게 웹 사이트를 만들 었는지에 대해 이야기를 나누었습니다.
howbb8works.com을 만든 이유는 무엇입니까?
많은 사람들과 마찬가지로 BB-8은 The Force Awakens의 티저 예고편에서 본 순간 깜짝 놀랐습니다. J.J. Abrams는 그것이 CGI가 아니라고 확인했지만 실제 소품으로 인터넷이 폭발하고 추측이 시작되었습니다. 저는 지난 2 년 동안 3D 웹 기술로 작업 해 왔으며 WebGL을 사용하여 BB-8의 애니메이션 3D 모델을 보여 주면 사람들의 마음을 사로 잡을 것이라고 확신했습니다.
과정에 대해 말씀해 주시겠습니까?
CGI 아티스트 Emilio Gelardo보다 더 나은 협력자를 찾을 수 없었습니다. 그는 우리가 가지고있는 모든 정보를 바탕으로 두 가지 다른 메커니즘을 고안 한 다음이를 모델링하고 애니메이션했습니다.
그런 다음 사이트를 구상하기 시작했습니다. 스토리 텔링을 사용하여 BB-8에 대해 알고있는 모든 것을 공개하고 싶었습니다. 완전히 반응하는 한 페이지 형식 (스테로이드에 대한 블로그 게시물과 거의 비슷 함)이 이에 적합했습니다.
와이어 프레임 몇 개를 만들고 정보 아키텍처를 알아 냈지만 고화질 모형에서는 작업하지 않았습니다. 대신에 바로 코딩을 시작했는데, 이는 사이드 프로젝트에서 작업 할 때만 따르는 접근 방식입니다.
어떤 어려움에 직면 했습니까?
웹에서 3D 콘텐츠로 작업 할 때의 주요 과제 중 하나는 성능입니다. Verold 3D 엔진은 WebGL을 사용하여 브라우저에서 3D 그래픽을 렌더링하는 JavaScript 라이브러리 인 three.js를 기반으로합니다.
WebGL은 GPU를 사용하여 그래픽을 가속화하지만 3D 콘텐츠를 제대로 사용하지 않으면 성능에 심각한 영향을 미칠 수 있습니다. Verold와 같은 도구를 사용하여 성능에 미치는 영향을 최소화하면서 대화 형 3D 경험을 활용할 수있었습니다.
이 프로젝트를 진행하면서 새로운 것을 배웠습니까?
이 프로젝트는 3D가 청중을 참여시키는 매우 효과적인 방법이 될 수 있음을 확인했습니다. 캔버스를 깨고 3D를 다른 DOM 요소처럼 보이게하면 사용자는 매우 자연스러운 방식으로 캔버스와 상호 작용합니다.
나는 또한 로봇 공학과 스타 워즈에 대해 많은 새로운 것을 배웠습니다. 홀로 노믹 모션이 무엇인지 몰랐고 Ralph McQuarrie가 원래 R2-D2를 구르는 공으로 상상했다는 사실도 몰랐습니다!
이 기사는 원래 넷 매거진 270 호에 실 렸습니다.
