Minicube.kr - 블로그닷컴 Ver 3.03

UI개발자의 역할은 제가 생각하기로는 좁은 의미, 그리고 넓은 의미가 있다고 봅니다.

우선 좁은 의미로 보면, UI개발자의 주 업무는 디자이너가 디자인한 사이트를 구조화 하고 HTML과 CSS를 사용하여 실제로 사용자가 보는 화면을 제작하는 것입니다.
그 과정에서 디자이너와 프로그래머 사이의 의견을 조율하고 협상(?)을 하고, 각각의 브라우저에서 같은 디자인으로 보일 수 있도록 크로스 브라우징에도 신경을 써야 합니다. 또한 퍼포먼스의 하향을 유발하는 비표준 방식을 지양하고, 웹표준을 준수하여 페이지를 제작해야 하죠.
또한 화려하고 동적인 인터페이스를 부여하는 자바스크립트 개발(예. ajax)이나 플래시 개발도 UI개발의 범주에 들어가므로 이 분야까지 할 수 있다면 금상첨화입니다.

따라서 UI개발자가 하는 일은 XHTML/CSS를 통한 화면 제작, 웹표준 준수, 개발단과 디자인단의 조율, ajax와 플래시를 사용한 RIA제작 등이 주 업무라고 볼 수 있겠습니다.

그렇다면 좀더 멀리 미래를 예측하는 마음으로 넓은 의미로써 "UI개발자"가 하는 일을 더 전문화 시킬 수 있을까요?

예전에는 UI개발이라는 영역 자체가 존재하지 않았습니다. 디자인 파트 또는 프로그래밍 파트의 지원역으로서 단순히 psd를 슬라이싱해서 HTML로 코딩한 후 개발단에 넘겨주는 작업만 해왔죠. 그나마 최근에야 웹표준과 크로스 브라우징, Windows Vista라는 이슈에 맞물려서 겨우 'UI개발'이라는 모호한 단어로 표현하면서 발전을 도모하고 있는 상황이지요.
극단적으로 말하자면 웹서비스개발에 있어서 'UI개발'이라는 영역은 있어도 되고 없어도 되는 영역입니다. UI개발자가 가지고 있는 롤은 기획파트, 디자인파트, 개발 파트에서도 다 나눠서 할 수 있는 일들이죠.
또한 웹 기술 중에서는 상당히 진입장벽(?)이 낮은 관계로, 현재로선 웹에 조금 관심이 있는 고등학교/대학교 졸업 출신이 새로 6개월 정도 빡세게(?) 교육을 받는다면 누구나 할 수 있는 그런 일입니다.
가뜩이나 한국은 개발자로서의 생명이 매우 짧은 불운한 나라라는 점은 더욱 UI개발자를 암울하게 하고 있습니다.

이 상황에서 제가 하고 있는 UI개발이라는 新영역의 일을 어떻게 구체화하고 꼭 필요한 영역으로 포지셔닝할 수 있을까 하고 고민을 많이 했습니다.
그래서 막연하게 생각해왔지만, 디자인과 개발 파트의 지식을 동시에 어느정도 알고 있어야 하는 특성상 의외로 테크니컬 컨설턴트의 역할을 할 수 있을 수도 있고, 웹에 있어서의 UI라는 것을 전체적으로 총괄하는 인터페이스 전문가로서의 역할도 있을 수 있다고 생각해왔습니다. 어쨌든 이 고민은 UI개발자로서 계속 진행형(?)입니다만...

제가 이번에 옮긴 회사에서 신규 입사자들과 함께 회사 소개와 팀 소개, UI개발에 대한 좋은 이야기를 듣고 UI개발의 길찾기에 조금은 더 도움이 된 것 같습니다.

UI개발이란 말 그대로 User Interface를 개발하는 것을 말합니다. 사용자는 어떠한 조작 부분을 조작하여 기계를 사용할 수 있게 됩니다. 따라서 사용자는 항상 조작부분에 해당하는 인터페이스를 사용하죠. 이 과정에서 사용자 경험이 발생하게 되는데, 사용자 경험을 만드는 일이 바로 UI개발이라는 거죠.
웹개발을 하는 사람들을 모두 포함하여 모든 사람들은 사용자가 될 수 있습니다. 물론 UI개발자도 이에 포함되는데, 기획 파트를 제외하면 디자인 파트나 프로그래밍 파트에서는 일반적으로 사용자보다는 디자인 또는 기술을 우선하는 경향이 없지않아 있습니다. 일반 사용자의 역할과 개발자 사이의 갭을 연결시켜 줄 수 있는 역할을 바로 UI개발 파트에서 할 수 있지 않을까요?
이 일을 위해서 UI개발자는 사이트를 개발하는 과정에서 사용자경험에서 나오는 피드백을 받거나 직접 자신이 피드백을 하는 일도 맡아야 합니다. 어느정도 기획과 UX파트에서 하는 일을 가져온다고 볼 수 있겠네요.

UI개발 작업에서 가장 중요한 포인트는 사용성, 접근성, 행동유발 입니다.

사용성이란 말 그대로 인터페이스를 통한 조작을 통해 얼마나 잘 사용할 수 있는지를 나타내는 정도입니다. 대표적인 예로 들 수 있는 것이 많이 볼 수 있는 TV나 VTR의 리모콘입니다. 리모콘.. 빡빡한 버튼... 아시죠?
그에 비해 애플의 간결한 인터페이스. 애플이 찬사를 받는 이유는 그 특유의 디자인 때문일 수도 있겠지만, 어떻게 보면 직관적이고 심플한 인터페이스의 힘이 더 크다고 볼 수 있지 않을까요? 다만 사용성과 기능성은 서로 TradeOff 관계에 있기 때문에 둘 간의 조율점을 찾는 것는 고민거리죠.
접근성은 최대한 많은 사용자들이 인터페이스를 사용할 수 있도록 설계하는 것입니다. 모든 사용자를 만족시킬 수 있는 것은 현실적으로 불가능합니다. 유닉스에서 사용하는 linx 브라우저까지 완벽하게 지원해 줄 수 있는 시간과 리소스를 가진 회사는 거의 없다고 보면 됩니다. 구글은 과연 가능할까요..?
또한 접근성 면에서 가장 민감한 부분이 장애인 사용성 부분인데요. 장애인이 접속해서 잘 사용할 수 있는 사이트가 접근성이 좋다는 말과 동일한 의미라고는 볼 수 없습니다. 이건 마치 IE에서 당장 렌더링 문제가 발생하는 것을 해결하기 위해 CSS핵을 사용하는 것과 같은 거죠. 이러한 극도의 접근성을 보장하기 위해서 오히려 99%에 이를 수도 있는 일반 사용자의 접근성을 역차별하는 일은 있으면 안되겠죠? 따라서 접근성이란 모든 사람들을 위한 인터페이스보단 최대한 많은 사용자를 위한 인터페이스를 구현하는 것이 접근성의 의미라고 생각합니다.
행동유발이라는 것은.. 간단하게 해당 인터페이스를 어떻게 사용하는지 미리 인지시키고 이를 그대로 따르게 하는 것을 말합니다. 간단하게 체크박스와 라디오버튼의 예를 볼 수 있는데, 우리들은 말을 따로 하지 않아도 체크박스는 여러 개를 한꺼번에 선택할 수 있고, 라디오버튼은 한 그룹중 하나만 선택할 수 있다는 것을 알고 있으며 이대로 행하는 것을 말합니다.
버튼은 누르라고 있지 빼라고 있는 것은 아니자나요..? ^^;

웹은 아직 발전 중에 있습니다. 데스크탑 애플리케이션도 미약하지만 천천히 웹 애플리케이션으로 진화하고 있는 중이죠. 아시다시피 구글 오피스가 대표적 예라고 볼 수 있는데, 앞으로는 '마이너리티 리포트'에서 등장했던 손가락을 이용한 UI가 실제로 웹으로 등장할 수도 있지 않을까 상상할 수 있지 않나요?
 
(과연 제가 은퇴(?)할 때까지 그러한 인터페이스가 실제로 등장하고 만들 수 있을까요...?)

크리에이티브 커먼즈 라이센스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.

얼마 전 회사에서 진행했던 세미나 발표자료입니다. 웹페이지 속도를 개선할 수 있는 방법을 UI개발 시점에서 살펴본 것이구요. 이 발표자료의 원본은 2007년 6월 8일 영국 런던에서 있었던 @media 2007 conference 에서 Nate Koechley 라는 분이 High performance for Web sites - 14 Rules for faster pages 라는 주제로 발표하신 자료입니다.
웹페이지의 속도를 빠르게 하고 효율성을 높여줄 수 있는 14가지 룰과 그와 관련된 배경지식을 다루고 있구요. UI개발과 관련이 있지만, 서버사이드 스크립트 차원이나 서버 차원에서 다루어지는 것도 있습니다.

우선 제가 속한 팀이 UI개발 팀이기 때문에 팀 업무영역에 관련된 것들만 추려서 발표자료를 만들어서 발표했었구요, 실제 발표내용은 스크립트로 넣었으니 참조하세요.

여담이지만, 지금 이 발표자료는 국내 포털 내의 관련 팀들도 다 한번씩 리뷰를 거쳤다는 소문이 있군요. ㅋㅋㅋ

제작은 Office 97-2003을 위한 PPT 파일, 그리고 Office 2007을 위한 PPTX 파일로 구분하여 올렸습니다. 몰랐는데, Office 2007의 pptx 문서형은 각종 자료와 xml파일의 압축파일 같은 형태로 되어 있네요;;;

발표자료 - 효율적인 웹페이지 제작을 위한 기법 (97-2003) (1.9MB)
발표자료 - 효율적인 웹페이지 제작을 위한 기법 (2007) (0.6MB)

Nate Koechley's BLOG and current post
High Performance for web sites presentation for PPT (25MB)
High Performance for web sites presentation for PDF (3MB)

크리에이티브 커먼즈 라이센스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.

두세달 전 마이크로소프트에서 발표한 새로운 UI환경인 Surface. 철지난 포스팅이지만, 나름 UI나 UX에 관심이 많기 때문에 언젠가 포스팅하려고 했습니다.
자세한 자료는 마이크로소프트 홈페이지에 소개되어 있구요. 영문자료이긴 하지만, 플래시로 잘 꾸며놨네요.

Product name은 Microsoft Surface
애플의 i-Phone을 표절했다느니 하는 소리도 있었고 실제로 멀티터치 부분은 닮은 것도 사실이지만, 2001년부터 시작되어 이제야 결실을 맺게 된 상당히 오래 연구되어 온 프로젝트입니다.

30" Table-like Display 형태의 멀티터치 스크린을 통한 혁신적인 UI 를 제공하는 것이 특징입니다. 전통적인 입력도구인 마우스나 키보드가 존재하지 않죠. 4대 특징은 다음과 같습니다.

1. Direct Interaction(직접 상호작용) : 사용자들은 실제로 디지털 정보를 손으로 "잡을(Grap)" 수 있고, 전통적인 마우스나 키보드를 사용하지 않고, 손동작을 통해 상호작용이 가능.
   
2. Multi-Touch Contract(멀티터치) : 기존의 one point만 입력 가능한 터치스크린과 달리 복수의 입력(Dozens and dozens of Touchs)을 한꺼번에 지속적으로 받을 수 있음.
   
3. Multi-User Experience(다중사용자 경험) : Horizontal Form Factor 는 여러 사람이 동시에 작업을 가능할 수 있도록 함.
   
4. Object Recognition(물체인식) : 스크린 위에 특정 물체를 놓으면 이를 인식하여 Surface 에서 반응할 수 있으며, 디지털 정보를 제어하는 것이 가능함.

Microsoft Surface Computing의 큰 특징은 멀티터치가 가능한 30인치의 평면 형태(Table-like)의 디스플레이이며, 이 스크린은 복수의 입력(Dozens and dozens of Touchs)을 받아들일 수 있습니다. 크기는 높이가 22인치, 테이블은 42" x 21" 이며, 표면 소재는 아크릴, 내부 프레임은 코팅처리된 강철입니다.
커스터마이즈된 Windows Vista 를 OS로 사용하며, 통신환경으로는 Ethernet 10/100, Wireless 802.11b/g, Bluetooth 2.0 이 사용되며, 2007년 말부터는 전국의 호텔이나 레스토랑, 공공장소에 설치될 예정이라고 합니다. (물론 미국 현지 이야기입니다. ㅠㅠ)
여담으로 Surface 개발 프로젝트에서 멀티터치 개발을 총괄한 사람은 한인 2세인 Jefferson Han 으로 알려져 있습니다.

발표 당시 상당히 재미있게 봤습니다. UI나 UX에 관해 상당히 관심이 있기 때문에, 여기에 관련된 자료를 찾아보고 있는데, 예전에 막연히 생각했던 것들 중에 일부가 실제로 구현이 되는 것을 보게 되니 신기하네요.

미래가 배경인 영화중에 "마이너리티 리포트"와 "아일랜드"를 기억하시나요? 마이너리티 리포트에 나왔던 3D UI 라던가, 아일랜드에서 악당 보스가 쓰던 Table-like 컴퓨터... (그거 몇인치인가요? ㅠㅠ 부러워라) 이것들이 실제로 구현될 날도 얼마 남지 않은 것 같습니다.

데모 영상 만으로는 실제로 할 수 있는 일을 냉정히 보자면 미디어(사진,동영상) 정리, 자료교환 등이 고작입니다. 하지만, 앞으로 Microsoft에서 Surface Computing에 관한 SDK와 많은 자료를 공개한다면 훨씬 다양한 용도의 소프트웨어를 통해 이 UI환경을 사용할 수 있을 것 같습니다.

앞으로의 컴퓨팅은 어떻게 변할지, 어떻게 편리하게 될 지 상상하면 참 즐거워집니다 :)

크리에이티브 커먼즈 라이센스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.