웹 디자인의 방향
르네상스 때까지만 해도 예술(art)이란 기술(skill)을 뜻했다. 즉, 장인 정신과 가까운 무언가를 타나냈다. 또, 뛰어난 예술가들은 뛰어난 공학자들이기도 했다. 레오나르도 다 빈치를 보라.
내 주변 사람들은 알겠지만, 나는 야간개발팀의 일원이다. 야간개발팀은 현재 VLAAH라는 서비스를 만들고 있는데, 퇴근 혹은 하교 후 저녁 늦게 만나서 작업을 하기 때문에 야간개발팀이라는 별명을 갖게 되었다. 멤버는 총 넷(나, shinvee, 소리미르, 이흥섭)이다.
이 글에서 소개할까 하는 사람은 바로 막내 이흥섭 군이다. 야간개발팀에는 엄밀히 말해 디자이너가 없다. 기획자도 없다. 누구나 프로그래밍을 하고, 누구나 디자인을 하며, 모두 기획을 한다. 하지만 아무래도 각자 주력하는 부분이 있긴 하다. shinvee 선배는 기획에 더 힘을 쏟고, 나의 경우 프로그래밍에 좀 더 신경을 쓴다. 이흥섭 군도 비슷하게 다른 멤버보다 디자인에 무척 고민한다.
흥섭이의 이력은 꽤나 특이하다. 중학교 때까지만 해도 흥섭이는 픽셀 아트(pixel art) 쪽에서 굉장히 날리던 사람이었다. 픽셀 아트가 뭐냐 하면, 점묘법(pointillism)을 떠올리면 쉽게 이해할 수 있는데, 말 그대로 픽셀 하나 하나를 손으로 찍어서 전체의 큰 그림을 만드는 방법이다. 도트 그래픽(dot graphic)이라는 말로도 불리는데, 그 특유의 질감 덕분에 주로 게임에서 많이 쓰인다. 실제로 흥섭이는 게임 회사로부터 같이 일해보지 않겠냐는 제의도 몇 번 받았다고 한다(중학교 때!).
그러다가 내가 다니던 선린인터넷고등학교로 입학하게 되면서 뭔가 틀어지게(?) 된다. (야간개발팀 멤버는 모두 선린 출신이다.) 내 덕분에 Python 프로그래밍을 시작하게 되고, 애는 어느 순간 프로그래머를 자처하기 시작했다. 세상에, Python을 수족처럼 다루고, Erlang, Haskell을 공부하는 디자이너는 거의 없을 것이다. 물론 웹 표준 마크업, CSS 등은 기본이다. VLAAH 마크업은 거의 흥섭이가 다 했다. 나중에 흥섭이가 아닌 다른 셋이 망쳐놓은(?) 부분도 좀 있긴 하지만, VLAAH 마크업은 굉장히 순수하다. 순수하다는 것이 무슨 의미냐면, 디자인하기 어렵다는 핑계로 <div id="wrap"> 따위의 쓸데 없는 마크업을 만들지 않는다는 뜻이다. id는 주소를 부여하기 위해서 존재하지, CSS하기 쉬우라고 존재하는 것이 아니라는 것이 야간개발팀의 마크업 철학이다. 예상할 수 있겠지만, 흥섭이는 JavaScript 괴물이기도 한데, MooTools를 써서 간단한 플래시 애니메이션 수준의 것들을 만들어낸다.
이런 특이한 이력의 디자이너에 대해서 얘기해봤는데, 그럼 이런 디자이너의 작업 방식은 뭔가 다른 부분이 있을까? 물론 있다. VLAAH 블로그에 올라온 Colorful VLAAH라는 글을 읽어보시라. (흥섭 군이 직접 포스팅했다.)
테마 하나에 필요한 색은 세 개입니다. 기본 색, 밝은 색, 어두운 색. 그리고 비트맵 이미지에도 알파 체널을 제외하면 빨강, 녹색, 파랑, 세 개의 체널이 있죠. 빨강, 녹색, 파랑만으로 이뤄진 칩셋 프로토타입을 만들고 각 체널에 원하는 색을 대응시켜 바꿔치기할 수 있을 것 같았습니다.
PHP로 프로그램을 작성하기 시작했습니다. 우선 간단히 두 색을 일정한 비율로 섞어주는 과정을 프로그래밍했습니다. 이제 섞을 비율만 알아내면 칩셋을 원하는 색으로 만들 수 있습니다. GD 라이브러리를 이용해 칩셋 프로토타입 이미지로부터 필요한 체널을 뽑아낼 수 있었고 간단한 계산으로 섞을 비율도 얻어낼 수 있었습니다. 그리고 자동화하는데 성공했죠.
이런 식으로 디자인 작업 자체를 직접 자동화시키려는 시도조차 하는 디자이너가 어디 있을까? 위 글에서는 나오지 않았지만, 흥섭이는 VLAAH의 CSS 코드 생성기도 만들어서 쓰고 있다. 그야말로 고통 없는 웹 개발(painless web development)이다. 어딘가에서는 포토샵 하나만 아는 그래픽 디자이너들이 웹 디자이너를 자처하며 그림을 그리고 있는데, 여기있는 흥섭이는 디자인해주는 도구를 직접 만들어서 디자인한다. 자, 이제 이 글의 제목이 이해가 되지 않는가? 웹 디자인의 방향. 나는 이것이야 말로 올바른 웹 디자인의 방향이라고 생각한다.
덧. 주변에 혹시 이런 디자이너의 사례가 있으면 알려주시라. 아, 흥섭아 미안해, 너 디자이너라고 하면 싫어하지?

May 15th, 2008 at 10:13 AM
홍민희의 생각…
후배 이흥섭은 천재라고 생각한다. 예전부터 주변 사람들에게 그의 유별난 장점들을 조금씩 얘기해주곤 했는데, 이번 기회에 아예 대놓고 블로그에 흥섭이 칭찬 글을 써보았다. 내가 생각하…
May 15th, 2008 at 10:56 AM
흐흐. 저도 vlog 조금 전에 읽고 감탄했습니다. 요즘 홍민희님하고 야간개발팀 덕에 새로운 자극을 계속 받아서 좋군요. :) 과학고·카이스트가 너무 애들을 빡시게 굴리다보니 이런 부분에서 창의적인 발상을 유도하는 부분이 약한 듯 싶습니다.
May 15th, 2008 at 9:38 PM
저도 흥섭의 저것을 보고 놀랐습니다.
새로운 자극이네요.
May 15th, 2008 at 11:52 PM
셀샤스의 생각…
시각 디자인과를 다니면서 느끼는건데, 디자인은 예술보다는 사실 공학쪽에 더 가까운 분야임에도 불구하고 공학을 경시하는 풍토가 짙다. 민희선배 말마따라 이런 자세는 썩 좋지 않은 것 …
May 16th, 2008 at 2:18 PM
저도 그 훌륭한 모습들을 많이 배워야 할텐데 말이죠, 하하.
May 20th, 2008 at 2:56 PM
아무도 따라올 수 없는, 디제잉도 하고 디자인도 하고 프로그래머도 하는 디제이너 흥섭이
June 1st, 2008 at 2:50 PM
[…] VLOG에 Colorful VLAAH를 씀으로써 그 바람을 해소했습니다. 민희 선배는 직접 웹 디자인의 방향이라는 칭찬 글까지 […]