scaleform.minarto.com

플래시와 원 본문

Core

플래시와 원

미나토 2012. 7. 16. 19:20


음... 이건 사실 스케디모에 그냥 가볍게 올렸던 글인데 블로그에 조금 수정을 가미해서 옮깁니다


전에 카페 게시판에 이런 질문 글이 올라왔습니다.


원을 회전시키면 지글거리듯이 흔들린다... 라는 얘기였죠.

다음의 이미지 처럼 원을 드로잉한 후 돌려보시면 확인하실 수 잇을 겁니다.



(올리신 이미지를 퍼왔습니다.... 한나님 용서를 잇힝~~~)


이 질문에는 여러가지 답변들이 달렸답니다...



제가 쓰려는건 답은 아니고요... 이 원인에 대해서 쓰려고 합니다.


일단 플래시의 원은 말이죠... 원이 아닙니다.


정확히는 원에 가까운 베지어 곡선이죠...


예전에 (한 2,000년도 초반???) 플래시에 최초의 벡터 그래픽 드로잉 API가 생기고 난 후 (lineTo, curveTo), 한 플래시 커뮤니티에서 열띤 논의가 벌어졌답니다.

그 전에는 원을 표현하려면 늘 드로잉의 원 툴로 그리거나, 원형 이미지를 써야 했습니다.

이제는 런타임 단에서 드로잉 API가 생겨났으니 툴이 아닌 프로그래밍으로 원을 그리려면 어떻게 해야 하느냐는 것입니다...

무척 여러가지 다양한 방법이 나왔습니다. 기상천외한 방법도 있었고...

저도 그런 제안을 했던 녀석 중의 한명이었고, 저는 다음과 같은 방법을 제안했었죠...


그건 제가 e-book 에도 썼던 내용인데요... 원의 접선의 방정식을 이용합니다.


이건 방법이 궁금한 분만 보시면 됩니다.

오늘 그 얘기를 하려는 건 아니고요... 원의 접선의 방정식을 이용하되... 그건 원이 아닙니다. 근사치이죠...


사실 원은 수학이라는 이론 속에서만 완전한 녀석입니다. 세상에 완전한 원이 어디 있나요? 원자 단위 까지 쪼개본다면 말이죠...
그렇게 생각해보면 위의 방법들도 사기(?)는 아닌 셈이죠...


프로그래밍에서 원을 그리는 방법은 늘, 성능과 디자인 사이에서의 팽팽한 줄다리기 입니다.

얼마나 원에 가깝게 그리느냐이지... 원을 그리겠다가 아니라는 거죠...


3d 엔진도 마찬가지입니다. 원 처럼 그리기 위해 여러가지 방법을 쓰죠... 폴리곤도 썼다가 넙스도 쓰고, 아니면 텍스처로 속이기도 하죠...
하지만 이 역시 모두 완전한 원이란 없습니다.


플래시도 이러한 방법을 사용합니다. 플래시의 드로잉 툴에서 사용하는 방법은 360도를 45도 각도로 잘게 쪼개어 둥그스름하게 이어주는 방식입니다.
그래서 개발자들도 원을 프로그래밍으로 직접 그릴 때는, 이 45도 방식을 이용합니다. 플래시의 이 일명 45도 방식이 원에 가깝게 보이게 하거든요...

하지만 그러다보니, 오차가 발생합니다.

말씀하셨던 대로, 원을 돌려보면 확 티가 나죠...


위의 질문에 다른 분들도 말씀해주셨지만, 대부분의 해결방식은 원을 돌리지 않는 방법입니다.

마스크가 되었건 구멍을 뚫었건... 핵심은 원을 돌리지 않는거죠... 돌리는건 원했던 원보다 조금 더 큰 어떤 오브젝트이죠...

하지만 그게 안되겠다 싶으면 말이죠...


저 45도를 더 잘게 쪼개야 합니다. 45도로 그렸을 때 오차가 100 이었다면... 22.5도로 그리게 되면 오차가 50으로 줄겠죠...
더 잘게 나눈다면???
이건 플래시 개발자가 직접 프로그래밍 해줄 수 있습니다. 툴로는 안됩니다.

플래시 IDE 툴은 
"45도의 오차 정도로 합의보자"...
라고 만들어져 있으니까요...


툴을 걷어내고, 개발자가 뛰어들면 오차는 줄어듭니다.

하지만 그 성능은??? 반으로 쪼개면 두배 이상의 성능이 소모가 되는건 당연한 일입니다. 하지만 이것도 여러가지 프로그래밍 기법으로  그 소모를 낮출 수 있습니다.
이제 여기서부터는 개발자의 몫이죠...


플래시라는 놈은 비쥬얼을 직접 다루는 놈이 되다보니, 성능과 퀄리티 상에서 늘 밸런스를 갖추어야 합니다.


하지만 말이죠...

플래시 개발자가 좋은 프레임웍을 만들어서 생산성이 높아져 놀 시간이 많이 생겼다고..., 렌더러나 VM이 빨라져서 성능이 남아돈다고  생각하면 큰 오산입니다.

이제 부터는 그 남는 성능으로 더 나은 퀄리티를 표현해야죠...