2010년 1월 29일 금요일
2010년 1월 28일 목요일
2010년 1월 22일 금요일
3) 웹기획의 기본 - 조직 규모에 따른 웹기획자의 역할
지금까지 웹사이트를 구축하고 운영하는데 전반적으로 어떤 조직이 필요하고, 어떤 역할을 수행하는지 알아보았다. 이제 조직 규모에 따라 실제 웹기획자가 어떤 역할을 수행하게 되는지 살펴보자.
그림 1-4 대규모 조직에서 웹기획자의 역할
그림 1-4는 대규모 조직에서 웹기획자가 수행하는 업무 역할을 나타낸다. 이 경우는 조직에 충분히 많은 사람이 있고 각각의 역할을 담당하는 조직이 별도로 존재하는 경우이다. 웹 기획을 위한 인력도 별도 조직으로 구성되는데, 이 때는 웹기획을 위한 조직이 하나의 부서가 되거나 여러 개의 역할을 하는 팀으로 구성되기도 한다.
사이트 기획 역할은 웹기획자의 가장 핵심적인 업무이므로 변하지 않지만, 프로젝트 관리 역할은 약간 논의 할 필요가 있다. 대형 조직에서 프로젝트 관리는 별도의 전문적인 프로젝트 매니저 조직이 존재하기도 하고, 기획 부서나 사업 부서가 그 업무를 수행하기도 한다.
이 그림에서 프로젝트 관리를 웹기획자의 영역으로 포함한 이유는 별도의 프로젝트 매니저가 존재하는 경우에도 기획자는 자신이 기획한 서비스가 제대로 디자인되고 개발되는지 점검해야 하기 때문이다. 기획 의도에 맞게 디자인 시안이 나왔는지, 개발자가 설계서의 내용을 잘못 이해해서 다르게 구현하고 있는 것은 아닌지 기획자는 항상 확인하고 문제가 있을 경우 그것을 바로 잡아야 한다.
이와 같이 별도의 프로젝트 매니저 조직이 있거나 그 업무 역할이 여러 조직에 분산해서 주어진 경우, 웹기획자는 자신이 기획한 내용에 대한 디자인과 개발 진행을 점검하는 정도의 제한적인 프로젝트 관리를 수행하면 된다.
그림 1-5 소규모 조직에서 웹기획자의 역할
이번에는 소규모 조직에서 웹기획자의 역할에 대해서 알아보자. 작은 기업들에서는 적은 인력으로 많은 업무 역할을 처리해야 하기 때문에 한 사람이 여러 가지 업무를 맡게 된다. 실제 "웹기획자"라고 불리는 사람들이 처리해야 하는 넓은 범위의 일은 위의 그림과 같다. 작은 조직에서 웹기획자의 역할은 사실상 디자인, 개발을 제외한 모든 것이라고 이야기 할 수 있다. 어떤 경우는 개발시 데이터베이스 구조 설계와 간단한 디자인까지도 기획자가 수행할 때가 있는 것을 감안하면, 사실상 순수 개발과 디자인을 제외한 전반적인 업무를 웹기획자가 처리하게 된다고 볼 수도 있다.
실제 웹기획자의 업무는 위에서 예로 든 대규모 조직과 소규모 조직의 중간 정도에서 결정되게 된다. 웹기획자의 경우 자신의 업무 범위가 어디까지인지를 떠나 위의 그림에서 보이는 전반적인 웹기획 관련 업무에 대한 경험과 지식을 가지고 있어야 좋은 기획을 할 수 있다. 처음부터 끝까지 순수한 웹기획 영역의 일만 수행해서 전문성을 키우는 것도 의미가 있지만, 다양한 개념과 지식으로 무장하고 어떤 종류의 프로젝트에도 대응할 수 있는 자세를 갖추는 것이 좋다. 특히 사업 기획, 마케팅 기획 분야의 기초 이론과 방법론들을 배우고, 최근의 기술적인 트렌드를 알고 새로운 기술로 어떤 사이트를 만들 수 있는지 아는 것은 다양한 기획 업무를 위해서 필수적이라고 할 수 있다.
조직의 규모에 따른 차이와 함께 기업내의 정치적인 파워가 어디에 있는지에 따라서 조직의 형태와 역할이 결정되는 경우도 종종 있다.
기획 조직의 힘이 강한 회사의 경우 디자인과 개발에 대한 최종 승인을 모두 기획자가 하고, 기획자가 정한 일정과 기획 내용에 따라 다른 조직이 움직인다. 이 때, 개발 조직의 역량이 부족하면 기술적인 설계나 데이터베이스 설계까지 기획자가 진행하기도 한다.
디자인 조직의 힘이 강한 회사에서는 디자인의 가치를 가장 우선해서 사이트가 만들어진다. 기획자의 기획은 디자이너가 생각하는 디자인 방향에 따라 변경되고, 개발자는 디자인된 요소가 구현 가능한지 우선 점검해야 한다.
개발 조직의 힘이 강한 회사는 모든 일정이 개발팀의 일정에 맞춰지는 경향이 있다. 기획자의 기획은 개발자의 개발 일정상 불가하다는 이야기에 축소, 변경되고 전체 사이트 구축 일정을 개발팀에서 사실상 좌우하게 된다.
원문 : http://bahn.textcube.com/entry/web-dev-role
2) 웹기획의 기본 - 웹사이트 구축을 위한 조직 형태와 역할
웹사이트를 구축하고 운영하기 위해서는 아래와 같은 조직들이 필요하다. 조직이 작은 경우 한 두 명의 담당자가 여러 가지 업무를 동시에 수행하기도 하고, 조직이 크고 인원이 많은 경우는 각각의 조직들이 별도의 팀으로 구성되거나 하나의 부서 아래에 여러 팀으로 구성되기도 한다. 각각의 조직과 그 역할에 대해서 간단히 살펴본다.
그림 1-3 웹사이트 구축을 위한 조직 형태
사업 기획
사업 기획 조직은 장단기 사업 계획을 세우고 진행하며, 그 진행상황을 점검하고 관리하는 조직이다. 회사의 매출에 관한 총체적인 관리를 사업 기획 조직에서 하게 되며, 매출 목표를 달성하기 위한 여러 압박을 받을 수 있다. 영업 조직이 중요한 역할을 하는 회사일 경우 영업 조직과 사업 기획 조직은 긴밀한 연관 관계를 가지게 된다.
사업 기획 조직은 회사의 사업 목표를 만들고, 수익 모델과 서비스 모델을 만든다. 업계의 트렌드와 경쟁 상황을 분석하고 그 사이에서 어떤 식으로 자사의 서비스나 제품을 성공적으로 판매할 것인지 고민한다. 매출을 채널별로 분석하고 자금을 투입해서 활성화 할 부분과 아닌 부분을 찾아내서 적절한 초치를 취한다. 비슷한 형태로는 전략 기획, 서비스 기획이라는 이름의 조직을 볼 수 있는데 모두 비슷한 일을 하는 것으로 생각할 수 있다.
마케팅 기획, 마케팅 실행
마케팅 조직은 회사의 제품과 서비스 현황을 파악, 분석하고 그것의 판매를 촉진하는 마케팅과 광고 및 홍보 활동을 담당한다. 마케팅, 광고, 홍보는 별도의 조직으로 나눠지기도 하는데, 그럴 경우 마케팅은 사용자, 트래픽, 매출에 관한 현황을 파악하고 관리하며, 광고는 온/오프라인 광고 제작, 홍보는 언론 관련 보도자료 작성 및 채널 관리를 하는 식으로 역할이 나눠질 수 있다.
마케팅 조직의 역할은 여러 부분이 사업 기획 조직과 겹치는 경향이 있다. 사용자 조사, 사이트 통계의 분석과 관리, 상품 구성 및 가격 결정, 매출 관리 등은 마케팅과 사업 기획에서 필요에 따라 비슷한 업무를 별도로 또는 함께 수행하게 되는 것들이다. 사내의 조직 구성과 내부적인 사정에 따라 각 조직의 세부 역할과 범위가 결정된다.
웹사이트와 관련해서 마케팅 기획에서는 사이트의 구성에 따라 방문자를 회원으로, 회원을 구매 고객으로 전환하는 전환율을 어떻게 높일 수 있을지 고민한다. 또한 오랫동안 방문과 구매가 없는 휴면 고객을 어떻게 활동 고객으로 만들 수 있을지, 장바구니에 담긴 제품에 대한 결제율을 높일 방법이 없을지 등을 항상 연구한다.
개발 이후 서비스 오픈 시점의 마케팅 실행 단계에서는 서비스 활성화를 위한 다각적인 마케팅 캠페인을 진행한다. 미리 의도한 방향으로 회사 이미지(Corporate Identity)와 브랜드 이미지(Brand Identity)를 만들고 서비스에 대한 일관된 메시지를 온/오프라인의 다양한 채널을 통해 고객에게 알린다.
사이트 기획
웹기획자가 실질적으로 수행하는 가장 핵심적인 업무는 이 사이트 기획 업무이다. 이 책의 대부분의 내용은 사이트 기획에 관한 내용으로 채워져 있다. 웹사이트의 논리적인 구조와 뼈대를 만들고 거기 살을 붙여 실제 사이트를 구축할 수 있는 전체 설계도를 만드는 것이 웹기획자의 역할이다.
사이트 기획을 할 때는 콘텐트를 이해하기 쉽고, 찾기 쉬운 구조로 만드는 인포메이션 아키텍처 및 내비게이션 설계, 그리고 사용자가 혼란을 느끼지 않고 직관적으로 사이트를 이용할 수 있게 하는 유저빌리티 설계가 중요하다. 또한 작성된 콘텐트의 품질을 높이는 것도 중요한데, 이를 위해서 웹 상의 글쓰기를 담당하고 작성된 콘텐트의 검수를 진행하는 전문 인력을 따로 두기도 한다.
사이트 기획시 고려해야 할 점은, 기획을 할 때 항상 상위 단계 기획의 결과를 고민하고 반영해야 한다는 사실이다. 사업 목표와 마케팅 방향이 설정되지 않고 설계되는 사이트는 목표가 없고 가야 할 방향을 모르는 혼란스런 사이트가 될 가능성이 커진다. 명확한 사업 목표와 마케팅에 대한 전략적 방향이 설정되어 있다면 사이트의 큰 틀부터 세세한 콘텐트까지 한가지 방향을 바라보며 설계될 수 있고, 그런 일관성이 사용자를 설득하고 그들의 행동을 이끌어 내는 힘이 될 수 있다.
사용자 조사, 벤치마킹 등의 리서치 단계에서 사업 기획, 마케팅 기획, 사이트 기획에서 비슷한 업무를 수행하긴 하지만 실제로는 원하는 점이 다른 경우가 많다. 사용자 조사의 경우, 마케팅적으로 판매 채널의 관점에서 나눈 그룹과 웹 사이트를 구축을 위해서 만드는 사이트 이용 패턴별 사용자 그룹은 차이가 있게 마련이다. 필요할 경우 사이트 구축을 위한 이런 조사들을 설계 전에 수행해야 한다.
프로젝트 관리
프로젝트 관리를 담당하는 사람을 프로젝트 매니저(Project Manager)라고 하며 보통 간단하게 PM 또는 프로젝트 PM이라고 부르기도 한다. 프로젝트 매니저는 프로젝트의 진행상황을 점검하고 보고하며, 필요한 기간과 인력을 산정하고, 비용을 책정하고 집행하는 일을 한다. 또한, 변경되는 프로젝트 요소들에 대한 관리를 하고 진행 상황에 따라 일정과 인력을 조정하며, 프로젝트가 실패할 수 있는 위험 요소들을 점검한다.
프로젝트 매니저는 사실 가장 논란이 많고 조직에 따라 역할에 차이가 많은 위치이다. 프로젝트 매니저에게는 일정 부분의 권한과 책임이 주어지게 되는데, 그 정도에 따라 프로젝트의 진행 형태가 결정되게 된다. 많은 경우 프로젝트 매니저는 웹기획에서 개발 완료 후 보고까지의 사이트 구축 과정을 관리하는 관리자를 이야기한다. 이 경우 전략 기획과 마케팅 등의 과정은 관리 범위에서 빠진다.
좀 더 넓은 의미의 프로젝트 매니저는 해당 서비스의 전략기획 단계에서 출시 후 마케팅까지 전체를 담당하고 관리하는 역할을 한다. 프로젝트 매니저 역할을 더 넓게 생각할 경우, 기획조직이 아닌 사업조직에서 프로젝트에 관한 총괄 매니저를 맡는 경우를 이야기 할 수 있다. 이 경우는 매출과 마케팅 등을 포함한 제품 전체에 대한 책임과 권한을 사업부의 프로젝트 매니저에게 주게 되며, 이럴 때 프로젝트 매니저를 프로덕트 매니저(Product Manager)라고도 이야기 할 수 있다. 이와 같이 프로젝트의 범위를 어디서 어디까지로 정하는지에 따라 프로젝트 매니저의 역할도 달라진다.
디자인
디자인 조직은 사이트 기획 단계에서 만들어진 기획서에 맞게 화면 디자인을 진행한다. 신규 사이트를 디자인 한다고 가정했을 때 디자인 작업은 시안 작성 -> 시안 검토 및 확정 -> 스타일 가이드 작성 -> 세부 페이지 디자인의 순서로 진행된다. 시안 작성시 우선 사이트를 위한 다수개의 시안을 작성하고, 경영진을 비롯한 관련 주요 멤버의 의견을 취합하여 수정 시안을 작성하고, 최종적으로 그 중 하나를 확정하게 된다.
디자인 작업을 위해서는 전체적인 사이트 디자인의 틀을 정의하는 스타일 가이드가 필요한데, 많은 수의 디자이너가 작업하는 대형 사이트와 외부의 디자인 인력을 사용하는 사이트, 그리고 콘텐트 공급자(CP: Content Provider)와의 작업이 많은 사이트는 디자인의 일관성을 유지하기 위해서 상세한 수준의 스타일 가이드를 만들 필요가 있다. 스타일 가이드는 시각적인 디자인 요소의 형태와 크기에 대해서만 간단히 정의할 수도 있지만, 최근에는 표준적인 html 코드 작성법과 css 사용법, 웹 접근성 준수 방안까지 모두 포함해서 가이드를 제공할 필요성이 생기고 있다. 해당 개념들은 이후 장에서 소개될 예정인데, 스타일 가이드에 대한 상세한 소개는 이 책의 범위를 벗어난 주제이므로 관련 관련 사이트[1]를 참고하여 내용을 파악하기 바란다.
최근에는 점차 디자인과 개발이 경계가 약해지는 추세에 있다. 이것은 단순하고 정적인 컨텐트 중심의 웹사이트가, 새로운 기술(Ajax, 플래시 등)의 도움을 받아 더 사용하기 편리한 형태로 발전하는 추세와 맞물려 있다. 웹 디자이너가 수행하는 웹 코딩은 지금까지 대부분 html과 css 코딩에 한정되어 있었지만, 최근에는 웹 표준과 웹 접근성을 고려한 코딩, 그리고 자바스크립트 코딩과 플래시 애플리케이션의 동작 제어에 필요한 코딩으로까지 영역이 확대되고 있다. 이러한 코딩은 기존에 개발자들이 수행하던 업무와 비슷하며, 이런 작업들을 전문적으로 수행하는 전문 인력이 점차 늘어가고 있다.
변화에 대한 빠르고 점진적인 적용을 강조하는 애자일 등의 개발 방법론에서는 설계를 완료한 후 디자인을 진행하지 않고, 대략적인 설계를 통해 프로토타입을 우선 만들고, 그것으로 구현 가능성 등을 점검한다. 이런 개발 과정에서 디자이너의 역할은 기존의 개발 방법과 차이가 있을 수 있다. 기존의 개발 방법에서는 기획, 디자인, 개발을 별개의 프로세스로 보고 전혀 다른 툴을 이용하여 작업을 해왔지만, 최근에는 기획, 디자인, 개발이 같은 툴을 사용하여 빠른 작업을 가능하게 하려는 시도가 진행되고 있다.
[1] http://html.nhndesign.com/ - NHN의 웹 표준화 가이드
http://ui.daum.net/ - 다음의 Frontend 개발 가이드
http://webstyleguide.com/ - 스타일 가이드 분야의 책 “Web Style Guide”의 온라인 버전
개발
개발 조직은 완료된 웹 기획 문서와 디자인 결과물을 이용하여 사이트를 개발한다. 개발 조직에서는 어떤 기술을 이용하여 웹 개발을 진행할 것인지에 대한 기술 기획을 하고, 시스템 구성과 실제 개발을 담당한다. 최근에는 사용할 수 있는 다양한 기술이 있으므로, 어떤 기술을 사용할지 여러 가지 요소를 고려해서 선택해야 한다. 이 때 기술의 선택이 기획과 디자인 전반에 영향을 미칠 수 있으므로, 중요한 기술적인 결정을 하기 전에는 개발자와 기획자, 디자이너가 의견을 함께 모아야 한다.
예전의 정적인 웹 사이트의 개발은 기획자가 전달하는 스토리 보드의 내용을 개발자가 구현하면서 데이터베이스에 주요 데이터에 대한 입출력 작업을 완료하면 대부분의 사이트 개발이 완료되는 형태였다. 하지만 이제 인터넷에서 좀 더 다양하고 풍부한 사용자 경험을 제공할 수 있게 되었고, 사용자의 요구에 맞춰 이에 대한 구현을 개발자가 해야 하는 상황이다. 정적인 웹 사이트 개발에서 동적인 형태의 웹 애플리케이션 개발로 개발의 방향이 변화하고 있다.
최근의 개발 방법론에서 요구하는 빠르고 점진적인 개발과 테스트를 지원하기 위해서 개발자가 기획자, 디자이너와 긴밀하게 작업해야 할 필요성이 커지고 있다. 기술이 복잡해지면서 본격적인 기획 이전에 먼저 기술적인 구현 가능성을 파악해야 할 경우도 늘어나고 있으며, 그럴 경우 간단한 것부터 복잡한 형태까지 프로토타입 개발을 기획자와 진행하기도 한다.
개발자도 사용자를 알아야 하는 시점이 왔다. 개발자가 더 이상 개발 용이성과 효율성에만 가치를 두는 프로그래밍을 해서는 안되는 상황이 오고 있다. 개발자가 기획자, 디자이너와 함께 직접 사이트의 세부적인 모습을 테스트하고 만드는 경우가 늘어남에 따라, 개발자가 불편하게 구현한 프로토타입이 실제 서비스가 되고 그것이 서비스 전체의 품질을 떨어뜨릴 수도 있기 때문이다. 개발자도 항상 사용자 편의를 우선해서 개발을 진행한다는 자세를 가져야 하며, 기획자, 디자이너와 협력하여 사용자 중심의 접근에 익숙해져야 한다.
테스트
테스트에 관한 조직은 일반적으로 QA(Quality Assurance) 조직, 품질보증 조직 등이며, 개발된 사이트나 제품의 테스트와 품질 개선을 담당한다. 개발된 제품이나 서비스를 테스트해서 어떤 문제가 있는지 파악하고, 그것들을 체계적으로 정리하고 버전 별로 관리하며, 출시 시점에 최종 사이트 출시가 가능한지 여부를 판단하여 보고한다.
QA 조직은 제품의 복잡도가 높으면 높을수록, 배포된 제품의 수정이 어려우면 어려울수록 중요성이 커지게 된다. 그런 측면에서 수정이 쉬운 웹사이트의 경우 별도의 QA조직을 두지 않고 기획자와 개발자, 그 외의 관련자들이 테스트 후 서비스를 오픈 하고, 문제점은 이후에 수정하는 형태로 테스트가 진행되기도 한다. 하지만 복잡하고 중요한 업무를 수행하는 금융 관련, 의료 관련 애플리케이션에는 QA절차가 꼭 필요하며, 동적인 사용자 인터페이스를 제공하는 웹 애플리케이션에서도 오류 발생 가능성이 커지므로 QA 절차의 필요성이 높아지게 된다.
대형 사이트의 경우는 부하 테스트(스트레스 테스트)를 별도로 하기도 한다. 시스템에 일시에 많은 사용자가 몰릴 경우를 가정하여 어떤 문제가 생기는지 테스트 하는 것이 부하 테스트이며, 테스트를 자동화 하는 전문 프로그램을 사용해서 일시에 많은 부하를 주는 형태로 테스트를 진행한다.
사이트 운영
사이트 운영 조직은 오픈된 사이트를 문제없이 가동하고 고객의 불만사항을 수집, 관리하고, 수집된 사항을 다른 조직과 공유하는 역할을 한다.
일반 고객의 참여가 많은 서비스에서는 별도의 사이트 운영 조직이 존재한다. 이 조직에서는 게시판이나 채팅 등의 사용자 참여 서비스 사용을 점검하고, 규칙을 어긴 사용자나 게시물에 대해서 제재를 가한다. 상거래 사이트의 경우 사용자의 주문과 문의 사항들에 대한 처리를 이 조직에서 담당한다.
고객의 목소리를 듣는 조직으로는 고객 지원 부서와 콜 센터가 있을 수 있다. 고객 지원을 위해서 인터넷 상담과 메일, 전화 상담 등의 여러 가지 상담 채널이 있을 수 있는데, 각각의 채널을 계획하고 관리하는 것이 고객 지원 부서의 역할이다. 이렇게 수집된 고객의 목소리는 기획 조직으로 전달되어 고객의 불편을 최소화 할 수 있는 형태로 서비스를 개선하는데 사용된다.
시스템 운영 조직도 사이트 운영을 위해서 필요하다. 각 서비스의 가동 상황을 항상 점검하고, 서비스 가동률과 장애율을 파악하여 장애를 최소화 하기 위한 시스템 차원의 초치를 취한다. 시스템 자원을 최대한 효율적으로 사용하면서 가동률을 높이고 혹시 모를 장애 상황에 대비하는 것이 시스템 운영팀의 역할이다.
원문 : http://bahn.textcube.com/entry/org-structures-for-web
1) 웹기획의 기본 - 웹기획자는 누구인가
웹기획 강좌를 시작하기에 앞서 우선 웹기획이 무엇이고, 웹기획자가 어떤 일을 하는지를 알아보고자 한다. 이전에 웹기획 카페에서 외국에도 웹기획자가 있는지에 대한 논의가 진행된 적이 있었다. 그 논의를 보면 국내외를 막론하고 사람들이 웹기획자의 역할에 대해서 얼마나 혼란스러워 하는지를 알 수 있었다.
국내에서 "웹기획" 이라는 용어는 거의 업계 표준으로 이용되고 있지만 해외에서는 그렇지 않은 것 같다. 우선 웹사이트를 기획하고 제작하는 일과 관련된 직업군이 어떻게 구성되는지 미국과 한국의 경우를 비교하여 살펴보자. 양 국의 직업군 형성의 차이는 웹사이트를 기획하고 제작하는 방식의 차이에서 비롯하는 것으로 보이며, 이것은 이후에 논의될 여러 가지 해외 이론들이 국내에 정확하게 적용되기 힘든 이유를 설명할 수 있을 것이다.
글로벌 1위의 직업 소개 사이트 monster.com에서 미국의 웹개발 업무에 대한 분류를 찾아보았다. 웹기획 분야와 관련하여 가장 쉽게 볼 수 있는 문구는 "Information Architect" 를 모집한다는 것이었다. 국내의 구인 공고에서는 "3년 이상 경력의 웹기획자" 같은 표현을 쉽게 찾을 수 있지만, 미국에서는 그렇지 않았다.
Monster.com의 웹 관련 직업군
그림 1-1 monster.com의 웹기획과 관련한 직업 분류
위의 그림은 웹과 관련한 직업군을 보여주는 monster.com의 구조도 화면이다. Website Development 직업군 내에 웹개발, 웹마케팅, 웹디자이너, 웹마스터와 함께 자바스크립트와 html 코딩을 전담하는 웹개발자가 있는 것이 눈에 띈다. 이 중에서 국내의 웹기획자 개념과 가장 유사한 것은 Web Producer이다. 국내의 웹기획자는 기획자라는 타이틀과는 달리 기획에서 프로젝트 관리, 테스트, 사이트 운영까지 다방면의 역할을 하는 경우가 많은데, 이런 경우라면 사실 웹기획자 보다 Web Producer(웹PD 또는 웹제작자)에 가깝다고 할 수 있을 것 같다. 이 그림에서 화살표는 현재의 직업을 가진 사람이 그쪽으로 이직하는 경우가 많고, 그로 인해 연관성이 높다고 평가한 경로를 표시한 것이다. 화살표의 두께와 a, b, c 표시는 연관성 우선 순위를 나타낸다.
Web Producer와 연관된 직업군으로는 a) Information Architect가 있고 b) Marketing, c) Web Developer – Database가 있다. a) Information Architect, b) Marketing의 경우 수긍이 되지만 c) Web Developer – Database의 경우는 좀 의외로 느껴졌다. 이것을 보면 미국의 경우 웹사이트의 논리적인 구조를 만드는 것을 중요하게 생각하고 그것을 구현 하는 것을 웹기획의 가장 중요한 요소로 판단하는 듯 하다.
오른쪽의 캡쳐 화면은 Web Producer와 Information Architecture에 대한 세부 정보이며, 각 타이틀로 대표되는 관련 타이틀들을 표시한 것이다. 항목을 보면 Consultant, Project Manager 등이 양쪽에 중복되어 있는데, 이를 보면 이런 직업 구분이 완벽하게 체계화 되기 어렵다는 것을 알 수 있다.
실제 공고에서는 그림에서 나타나지 않은 여러 가지 직업 타이틀들이 보였는데 이를 포함하여 주요 분류별 직업 타이틀을 아래에 정리했다.
-
제품 관련
-
Project Manager, Web Product Manager, Website Production Manager
-
-
콘텐트 관련
-
Information Architect, Content Designer, Copywriter, Creative Arts Instructor
-
-
사용자경험 관련
-
User Interface Designer, Web Application Designer, Usability Analyst
-
-
기획 관련
-
Web Producer, Web Business Analyst
-
전반적으로 Web Producer와 같은 포괄적인 의미의 타이틀은 자주 사용되지 않고, Information Architect나 Web Content Designer와 같은 세부적인 의미의 타이틀이 주로 사용되었다.
하나 주의 할 점은 영어에서는 단순히 Design, Designer라고 사용할 경우 일반적인 설계의 의미로 사용하는 경우가 많다는 것이다. Design은 우리말의 기획으로도 표현할 수 있을 것이며, 해당 업무는 기획자의 비중이 큰 업무라고 이야기 할 수 있다. 우리가 흔히 말하는 디자이너의 디자인은 Visual Design이나 Graphic Design 등으로 정확하게 표기를 하는 편이다. 따라서 사용자 경험에 관련한 User Interface Designer는 실제 그래픽 디자인을 수행하는 사람보다 그것의 기본 형태와 세부 동작을 설계하는 사람을 의미한다.
Jobkorea.co.kr의 웹 관련 직업군
Jobkorea는 얼마 전 monster.com에 인수되어 monster.com 하위 사이트가 되었다. 실제 monster.com에서 한국을 클릭하면 jobkorea로 연결이 되는 것을 볼 수 있다. 같은 계열의 미국과 한국 사이트에서 웹 관련 직업군을 어떻게 다르게 분류하고 있는지 살펴보겠다.
그림 1-2 jobkorea.co.kr의 웹기획과 관련한 직업 분류
Jobkorea의 분류에서 우선 눈에 띄는 것은 분류가 한데 뭉쳐져 있다는 것이다. "인터넷, 프로그래밍, SE, 시스템 운영"이라는 분류는 지나치게 여러 영역을 한데 묶은 것이 아닌가 하는 생각이 든다. 영역을 명확히 나누기 쉽지 않고 전체가 관련이 된 영역이라는 의미이거나, 상위 단계의 직업군 전체 분류의 개수를 줄이기 위해서 묶은 것으로 해석할 수 있겠다.
오른쪽에 나타난 하위 분류는 약간 혼란스럽다. 분류의 형태를 가지고 있지만 실제로는 태그의 역할을 하고 있는 것 같다. 특이한 점은 스토리 보드와 키워드 광고가 다른 일반적인 분류 항목과 함께 눈에 띈다는 점인데, 이것은 국내에서 웹기획이라는 업무 자체가 결국 스토리보드를 만들어내는 형태로 이루어지고 있다는 점, 그리고 소상공인들이 이용하는 키워드 광고에 대한 인력 수요가 많은 것으로 분류 설계자가 파악했다는 정도로 이해할 수 있을 것 같다.
위의 분류를 비슷한 항목을 괄호로 묶어서 간단하게 아래에 정리했다.
-
웹 기획(웹 PD), 정보 설계(스토리보드), PM, 콘텐트 기획
-
웹 마케팅, 웹 프로모션(온라인마케팅), 웹 광고기획(키워드광고)
-
웹 서비스 기획
위의 항목들을 보면 전반적으로 웹 관련 직업군의 세부 분류는 국내에서 명확하지 않은 것 같다. 사실상 의미 있는 분류는 웹 기획, 웹 마케팅, 웹 서비스 기획의 세가지 분류이며, 실제 구인 공고의 내용에서도 이 세가지 직군명이 거의 관례적으로 나타난다. 그림 12에서는 웹기획에, 웹마케팅, 웹서비스 기획에 압도적으로 많은 공고가 등록된 것으로 나오는데, 이것은 해당 구인을 하는 회사의 경우 우선 웹기획, 웹마케팅, 웹서비스 기획 분류를 선택하고, 다른 항목은 선택적으로 체크한다는 것을 의미한다.
Monster.com에서는 Web Producer에 해당하는 등록된 공고가 적고 그 추세도 감소하고 있는 반면, Information Architect는 등록된 수가 더 많고 추세도 증가 추세이다. 따라서 우리나라처럼 웹사이트 기획 전체를 대표하는 "웹기획"과 같은 직업 타이틀은 없다고 이야기 할 수 있다.
국내의 경우도 점차 미국의 분류와 같이 웹기획 관련 직업군이 세분화되고 있는 상황이다. 하지만 상대적으로 시장의 크기가 작기 때문에 그런 세분화는 규모가 있는 일부 업체와 에이전시 등에서 제한적으로 이루어지고 있다. 앞으로 일정부분 직업의 세분화, 전문화는 이루어지겠지만, 프로세스보다 결과를 중요시하고, 한 분야의 전문성보다 다양한 업무 대처를 중요하게 생각하게 되는 업계의 현실에서 현재의 분위기가 크게 바뀌지는 않을 것으로 생각한다.
지금까지의 내용을 종합할 때 알 수 있는 바는 아래와 같다.
-
국내의 "웹기획자"라는 단어는 전체적인 웹사이트 기획, 운영 프로세스를 담당하는 인력을 대표해서 나타낸다. 미국에서는 "Web Producer"가 비슷한 의미의 단어이지만 국내처럼 업종 전반을 대표하는 의미로 사용되지 않는다.
-
국내에서는 웹사이트 기획 프로세스를 명확히 구분하지 않는 경우가 많지만, 미국에서는 이 구분을 비교적 명확하게 수행한다.
-
국내에서는 대부분 담당자를 나누지 않고 기획 담당자가 전체 기획 프로세스를 진행한다. 반면 미국에서는 각각의 담당자를 별도로 생각해서 프로세스를 진행하는 경향이 있다. (Information Architect, Content Designer, Usability Analyst를 별도로 채용하기도 한다.)
-
국내에서는 웹사이트의 논리적인 구조를 상대적으로 덜 중요하게 생각하지만, 미국에서는 웹사이트의 논리적이고 체계적인 구조에 많은 투자를 한다. (Information Architect, Database Developer가 웹사이트 기획 분야에서 중요한 위치를 차지한다.)
Monster.com과 Jobkorea의 사이트 분류를 살펴보면 재미있는 결과를 얻을 수 있다. 논리적인 설계 측면에서 monster.com은 명확한 분류체계를 가지고 있고 이것을 적절히 시각화 하는 방법을 제시하는 반면, Jobkorea는 다소 혼란스러운 분류 체계를 가지고 있다. 이것이 Information Architecture를 우선적으로 생각하는 미국과 우리의 문화적 차이를 나타내는 한가지 예가 되지 않을까 한다.
원문 : http://bahn.textcube.com/entry/web-producer
출처 : http://bahn.textcube.com/8/trackback/
UX(User Experience) 란? UX 디자인 관련 다이어그램 Best 14
UX 디자인과 인터랙션 디자인 간의 관계를 정리하던 중에 User Experience 에 대한 기본 개념을 어떻게 간단하게 정리할 수 있을까 하는 문제에 부딪혔다.
이런저런 그림을 그려봤지만 마음에 들지 않았고, 역시 UX를 간단하게 정리하는 것이 보통 일이 아니라는 것을 깨달았다. 그리고 인터넷 상의 대가들의 정의를 찾아 돌아다녔지만 딱 마음에 드는 정의를 찾기는 어려웠다.
아래의 다이어그램들처럼 보는 사람에 따라 모두 제각각 다른 관점에서 UX를 바라보고 있기 때문에 UX에 대한 정의를 내리는 것은 어떤 식으로 해도 말이 많을 수 밖에 없는 어려운 작업이다. 그럴 때 제일 안전한 것은 최고로 유명한 전문가들의 이야기를 인용하는 것인데, 그래서 그런지 제일 많이 인용되는 그림들을 간추리니 5~6개가 넘지 않았다.
History:
2010.1.21 - Garrett의 최신 다이어그램을 2번으로 추가
2010.1.22 - UPA 포스터의 pdf 링크 추가, 원본버전을 구했으므로 순위 높임
0. UX의 정의
간결하면서 전반적인 User Experience 이슈를 포함한 정의를 골랐다.
사용자 경험(UX)은 사용자가 특정 제품을 이용하는 경험과 그 회사와 회사의 서비스를 통해서 상호작용하는 전체 경험의 총합이라는 이야기이다.
User Experience - Our Definition(NNGroup)
"User experience" encompasses all aspects of the end-user's interaction with the company, its services, and its products. The first requirement for an exemplary user experience is to meet the exact needs of the customer, without fuss or bother. Next comes simplicity and elegance that produce products that are a joy to own, a joy to use. True user experience goes far beyond giving customers what they say they want, or providing checklist features. In order to achieve high-quality user experience in a company's offerings there must be a seamless merging of the services of multiple disciplines, including engineering, marketing, graphical and industrial design, and interface design.
http://www.nngroup.com/about/userexperience.html
이 내용은 Nielsen Norman Group(NNGrop)에서 정리한 UX에 대한 정의이다. NNGroup은 심리학자 도널드 노만과 사용성 전문가 제이콥 닐슨이 만든 회사이다. 도널드 노만은 1993년 UX Architect라는 말을 최초로 자신의 직업 타이틀로 사용해서 UX라는 단어를 세상에 전파한 사람이다. 최초 전파자가 정의한 내용이니 가장 권위가 있고, 그래서 일반적으로 많이 인용되는 것 같다.
여담으로 NNGroup의 인력 구성을 보니 핵심 멤버 몇명을 빼고는 모두 여자 직원들이다. 노친네께서 이모셔널 디자인의 전파를 위해서 감성적인 만족을 주는 예쁜 여자들만 뽑으신 것인지는 모르겠지만, 성비가 너무 차이가 난다고 생각한다. 이상하게 보이는 건 나 뿐일까? ^^
User Experience Design - Wikipedia
User experience is a term used to describe the overarching experience a person has as a result of their interactions with a particular product or service, its delivery, and related artifacts, according to their design. As with its related term, User Interface Design, prefixing "User" associates it primarily (though not exclusively) with digital media, especially interactive software. It most commonly refers to the result of a planned integration of software design, business, and psychology concerns.
In the web world, user experience is sometimes conflated with usability, information architecture (IA), and user interface (UI) design, all of which are components of it. User experience addresses and integrates all user-facing aspects of a company, from email and web sites to off-site presence in print and on other sites.
http://en.wikipedia.org/wiki/User_experience
1. User Experience Design - Montparnas
비교적 간단하고 이해하기 쉬우면서 전반적인 내용을 잘 포함하고 있는 그림이다. 주로 다양한 연구 분야들이 어떻게 User Experience와 연관되는지를 나타내는 그림인데, 웹이나 책에서 볼 수 있는 대부분의 UX 관련 다이어그램은 이런 식의 접근을 하고 있다.
http://www.montparnas.com/articles/what-is-user-experience-design/
(이 사이트에는 UX와 다른 개념들에 대한 관계가 잘 정리되어 있다.)
2. State Of User Experience - Jesse James Garrett
Garrett이 2009년 Adaptive Path UX Week에서 소개한 UX를 설명하는 다이어그램이다. 최근들어 User Experience의 개념과 범위는 점차 확대되고 있다. Web -> Software -> Digital Media(Second Life와 같은) -> Mobile -> 다양한 기술로 UX라는 용어가 포함하는 범위가 커지고 있는데 그에 대한 개념을 반영한 것이 이 그림이다. 역시 다이어그램으로 유명한 Garrett 답게 복잡한 주제를 아주 멋지게 정리한 것 같다.
개인적으로 이 그림이 제일 위에서 소개한 UX의 정의에 가장 근접한 그림이 아닌가 한다. User Experience Design이라는 용어의 뜻이 커지면서 그 의미가 디지털 기기에서 주로 사용되는 User라는 단어의 뜻이 약해지고 일반적인 Experience Design에 점차 가까와지는 것 같다. Garrett은 이 강연에서 User Experience라는 용어를 고집하지 않았다. 사람들이 User Experience라는 용어에 대해 너무 편협한 생각을 하고 있다고 이야기 하면서, Experience Design에 대한 정의를 내리고 그에 대해서 다이어그램으로 설명을 했다. 지금 소개하는 그림이 Garrett이 강의에서 사용한 다이어그램이다.
http://uxdesign.com/events/article/state-of-ux-design-garrett/203
3. The User Experience Honeycomb(2004) - Peter Morville
북극곰 책을 쓴 피터모빌이 만들고 자신의 책 Ambient Findability에서 소개한 그림이다.
이런 식으로 UX를 정의하는 것의 장점은 UX 수준을 측정 가능하게 한다는데 있다.(물론 측정하기 쉬운 척도들은 분명히 아니다.) 이 그림에서 사용되는 척도들은 Usability와 HCI 관련 학계에서 자주 들을 수 있는 용어들을 포함하고 있다.
http://semanticstudios.com/publications/semantics/000029.php
위 피터모빌 그림의 한글판 버전 (검색 2.0: 발견의 진화 라는 번역본 책에서 설명됨)
http://www.tennygood.net/fxlab/4
* The User Experience Honeycomb 을 이용한 평가
구체적으로 어떤 기준들을 적용했는지 궁금하지만, 이런 식으로 UX의 수준을 측정해서 구체화 할 수도 있다.
4. UX Design & Project Life Cycle
UX 디자이너의 역할과 프로젝트 단계별 참여정도를 알기쉽게 표현한 그림이다. UX 디자인을 위해서 어떤 역할들이 필요한지 위 피터모빌의 그림과 함께 참고하면 도움이 된다.
5. The Elements of User Experience - Jesse James Garrett
소개된 다이어그램 중에 가장 유명한 Garrett의 그림이다. 가장 유명한 그림이지만 전체적인 UX(사용자 경험)를 나타낸다기 보다는 웹에서의 경험으로 한정된 그림이므로 순위가 좀 낮아졌다. Garrett의 말에 의하면 이 그림은 눈에 보이는 비주얼 디자인 수준까지 UX 요소들을 정리한 것이라고 한다. 눈에 보이는 이상의 수준으로 확대한 Garrett의 그림은 2번에 정리되어 있다.
웹 페이지, 웹 애플리케이션에서 주로 눈에 보이는 수준의 UX를 이야기 할 경우는 대부분의 사람들이 이 그림으로 만족하는 것 같다. 하지만 이보다 범위가 더 커져서 일반적인 정의를 내리려고 하면 점점 많은 사람이 합의하기가 어려워지는 듯 하다.
http://www.jjg.net/elements/pdf/elements.pdf
6. User Experience Design Diagram - uxdesign.com
Jesse James Garrett의 다이어그램 형태와 비슷하게 UX를 보는 사람의 관점에서 다시 정의한 그림이다. Garrett의 그림을 충분히 이해하고 있다면 아주 쉽게 이해 가능한 다이어그램이다. 일반적인 웹 UX를 설명할 수 있게 잘 만들어졌다. 순위는 Garrett 다이어그램의 오마주 판이므로 그 보다 한단계 아래로 배치.. ^^
http://uxdesign.com/ux-defined
7. Designing for Interaction (2nd Edition) - Dan Saffer
Design for Interaction 책의 2번째 판에서 댄섀퍼가 새로 그린 UX와 인터랙션 디자인의 관계도이다. 첫번째 판에서는 너무 많은 것을 대충 하나의 그림에 끼워넣으려고 하다 상당히 지저분한 그림이 되었는데, 두번째 판에서는 작은 것들을 정리해서 그림이 훨씬 깔끔해졌다. 첫번째 판의 그림은 UX에 대해서 설명할 때 자주 인용되는 그림 중의 하나다. (두번째 판은 최근 출간됨)
* 인터랙션 디자인 - 에이콘 출판사
Designing for Interaction(1st Editon)의 한글판
댄새퍼의 1st edition에 있는 그림을 일부 단순화시켜서 표현한 것 같은데, 2nd Edition과 상당히 유사한 모습이다.
8. UPA Poster: Designing the User Experience
Usability Professonals' Association에서 제작한 UX 디자인 방법에 관한 포스터이다. 유료로 팔리는 포스터라 구할 수 없을줄 알았는데, 출력할 수 있는 pdf 버전을 찾았다.
제일 아래부터 위로 올라가면서 디자인을 진행하는데, 실수를 하면 미끄럼틀을 타고 아래로 떨어지게 된다. 효과적인 진행을 하면 사다리를 타고 올라가서 빨리 끝낼 수 있다. 재미있는 그림과 함께 다양한 방법론들을 잘 설명한 자료다.
http://www.mprove.de/script/00/upa/poster.html
9. The User Experience Honeycomb(2007) - Peter Morville
피터모빌이 자신의 허니콤을 다시 디자인해서 사이트에 발표했다. 이 그림도 나온지가 꽤 됐는데 사람들은 이 개정판 그림을 인용하지 않고 이전판 그림을 주로 인용하고 있다. 차이라면 이전판 그림은 UX 자체에 대한 척도라고 할 수 있고, 개정판은 UX 전략에 관한 척도라고 볼 수 있다. 전략이라 그런지 전반적으로 더 모호해진 것 같다.
http://findability.org/archives/000184.php
10. UX Design Process
구글링 중 찾아냈는데 간단하게 디자인 프로세스를 나타내고 있다. 이런 식의 그림은 찾아보면 좀 더 있다.
http://www.iconatg.com/iconprocess/plugins/index.php
11. The Importance of User Experience
플리커의 개념도로 유명한 작가가 UX에 관해서 만든 다이어그램이다. 좀 정신없는 느낌이 들지만 잘 찾아보면 도움이 되는 그림이라 11번째로 선정했다.
http://www.flickr.com/photos/bryce/106972762/
12. User Experience - IBM Customer Facing Solutions
이 그림은 위의 그림들과 달리 훨씬 큰 관점에서 UX를 정의하고 있다. 제일 위에서 설명한 UX의 정의에 충실하게 그림을 그리자면 이런 형태의 그림이 나와야 한다. 하지만 UX에 관심을 가지고 업무를 하는 사람들이 주로 웹관련 기획자들이다 보니 브랜딩, 마케팅, 콘텐트 전략 같은 것들은 주로 그림에서 빠지게 되는 것 같다.
이 그림은 순위를 좀 더 올리고 싶었으나 이런 형태의 그림이 거의 참조가 되지 않아서 부록 형태로 제일 뒤에 추가했다.
http://www.customerfacingsolutions.com/offerings/ourapproach.html
13. Four Elements of the User Experience
이 그림 역시 UX를 위한 4가지 요소를 꼽으면서 브랜딩과 콘텐트를 꼽고 있다. 넓은 의미의 UX의 정의에 충실한 그림이지만 거의 참조되고 있지 않으므로 제일 뒤에 첨부했다.
14. How Good Experience?
마지막으로 첨부하는 이 그림에서 말하는 UX의 정의는 상당히 재미있다. 위에 소개한 많은 그림들에는 사용자의 감성요소가 빠져있는 경우가 많지만, 이 그림은 거의 감성 요소로 UX를 설명하는 그림이다.
UX를 두가지 축으로 해석하는데 사용이 얼마나 편리한가, 그리고 제품이 얼마나 매력적인가로 나누고 있다. 공학적인 측면의 Usability와 감성적인 측면의 Emotional Design으로 나누고 있는 셈이다. 재미있는 시도이지만, UX의 여러가지 측면을 포괄하기엔 부족한 점이 많아서 가장 뒤에 부록으로 첨부한다.
http://www.nnyman.com/personal
* Reference Sites
아래는 UX의 정의와 관련 다이어그램들을 정리해 둔 참고 사이트들이다.
Lukew - User Experience Diagrams
http://www.lukew.com/ff/entry.asp?156
Michael Cummings - Top Eight UX Design Definitions
http://uxdesign.com/about-user-experience-design/article/top-ten-seven-definitions-of-ux-design/24
UX와 관련된 다이어그램 모음
터치 가능한 OLPC 태블릿 버전 프로토타입
OLPC(One Laptop Per Child) 프로젝트를 알고 계시죠? 전 세계의 어린이들에게 랩탑(노트북)을 한 대씩 주어 정보격차를 해소하려고 시작한 프로젝트입니다. 100달러 정도로 가난한 나라의 어린이들에게 PC를 한 대씩 주려는 멋진 계획 때문에 많은 관심과 파급력을 불러 일으켰던 프로젝트 입니다.
관련 주소 : http://laptop.org/en/
이 프로젝트도 세월이 흘러가면서 점점 발전하고 있나 봅니다. OLPC에 태블릿이 추가되었으니 명칭이 OLTPC 정도가 되려나요? 2010년 태블릿 PC 시장이 들썩 거리기 시작할 것을 예측이라도 하듯이 OLPC도 태블릿으로 업그레드 되고 있는 것 같습니다.
아직은 프로토타입 수준이기 때문에 모양이나 기능 그리고 무엇보다 중요한 가격도 많이 변경되리라 생각됩니다만, 이런 형태로 OLPC가 업그레이드 되면 정보격차로 인해 소외받는 전세계 아이들에게 많은 도움이 될 수 있을 것 같습니다.
우리나라의 유러닝(u러닝)이나 디지털 교과서 사업도 특정 제품이나 소프트웨어 등에 너무 얽매이지 말고 크로스디바이스(cross-device)를 염두에 둔 전략을 세워보는 것이 어떨까 하는 생각을 해 봅니다.
관련 글 : http://mashable.com/2009/12/23/olpc-tablet/
작은 학교가 강하다`…전남 전원학교 큰 성과
19일 전남도교육청에 따르면 최근 전남형 교육모델인 작은 전원학교 육성 프로젝트를 실천한 초등학교 10곳의 성과를 분석한 결과 학생 수 증가, 학력신장, 사교육 감소 등의 구체적 성과를 거뒀다.
이 프로젝트는 소규모 학교의 장점인 맞춤형 교육, 친화적 교육공간 등을 활용해 경쟁력을 갖도록 하는 것으로 이른바 '작은 것이 강하다'는 점을 입증한 사례로 평가됐다.
이 프로젝트를 운영한 담양 고서초교를 비롯해 화순 도곡초, 장성 진원초, 구례 청천초, 해남 옥천초 등 10곳의 학생수는 지난해 3월 당시 1천34명에서 연말에는 1천117명 83명이 늘었다.
일부 학교를 제외하곤 지난해 2학기부터 시작한 점을 고려하면 파격적인 학생 수 증가다.
특히 도곡초와 진원초는 47명과 54명에서 각각 89명, 75명으로 무려 42명과 21명이 늘었다.
한때 분교 격하 위기까지 겪었던 고서초는 전입생이 꾸준히 늘어 157명으로 소규모 학교가 무색할 정도가 됐다.
학생 수 증가 못지않게 학생들의 실력도 쑥쑥 늘어 지난해 3월 진단평가 당시 80점대 초반 점수가 80점대 후반에서 90점대 초반까지 5-6점 신장했다.
10명 중 7명가량이었던 사교육 수요도 1명이 채 안 되는 등 큰 변화를 가져온 것으로 조사됐다.
이는 학생과 학부모들이 아예 사교육 필요성을 느끼지 않도록 학교가 다양한 방과 후 프로그램을 운영했기 때문이다.
스키, 수영 등 계절별 다양한 체험 캠프에 영어, 태권도, 독서, 사물놀이 등 학교 오는 것이 즐거운 프로그램으로 가득 채웠다.
완벽한 냉난방 시설, 다목적 강당 등 현대식 건물에다 전자칠판 등 최첨단 학습환경, 자연 친화적인 주변 여건 등도 학생, 학부모에게 빼놓을 수 없는 매력이다.
도 교육청은 여기에 지역 지자체와 함께 손잡고 이들 소규모 학교에 대한 교육환경 개선을 위한 지원을 아끼지 않았다.
이 결과 전원학교 운영에 대해 학부모 92.4%, 학생 84.5%, 교사 91.2% 등 높은 만족도를 보였다.
도 교육청 한계수 초등과장은 "가르치고 배우는 데 부족함이 없는 학교 만들기가 나름대로 큰 성과를 거뒀다"며 "올해는 순천 해룡초교 등 7개교를 추가로 지정, 확대 운영할 계획이다"고 말했다. (연합뉴스)
2010년 1월 21일 목요일
RIA War Is Brewing
But this isn't the latest round in the browser wars. No, the war I'm talking about is over the RIA (rich Internet application), a type of Web application that can run independently of browsers, can run on any operating system and, in many ways, works like a traditional desktop application.
Of course, RIAs aren't new. They can be traced back to earlier efforts such as Macromedia's Shockwave, Java applets and the ubiquitous Flash format.
But recent developments--including the growth of powerful Web development technologies such as AJAX (Asynchronous JavaScript and XML) and improved standards support in the latest Web browsers--have boosted RIAs' potential reach and capabilities.
By far, the biggest and most mature player in the RIA arena is Adobe Systems. When Adobe acquired Macromedia more than two years ago, it also acquired a legacy that went from Shockwave to Flash to Flex.
This long legacy of RIA experience has culminated in the recent release of AIR (Adobe Integrated Runtime), a next-generation RIA platform that makes it possible to build browser-independent Web applications that have many of the features of desktop applications, including offline capabilities.
However, while Adobe is currently the biggest and most experienced RIA player, it faces serious challenges on multiple fronts.
For Adobe, probably the most formidable competitor is Microsoft. With its new Silverlight technology, Microsoft is making an initial push into RIAs. While Silverlight is still new and immature compared with Adobe's offerings, Microsoft has to be taken seriously any time it makes a big push into a market.
On the other end of the spectrum is Mozilla, whose Prism RIA platform uses the Firefox browser's core technology to make it possible to easily build RIAs out of Web applications.
There are also many smaller RIA vendors that have nearly as much experience as Adobe and have specialized in meeting specific RIA needs for businesses. A good example of this type of vendor is Curl, a company that has focused on building RIA platforms for businesses.
But, while RIAs have been around for more than 10 years, the technology has progressed slowly. We are only now reaching a stage where RIAs are finally beginning to deliver on their long-held promises of easily developed and deployed cross-platform applications. Let's call it RIA 1.0.
To evaluate the state of RIA technology, eWEEK Labs has been testing Adobe's AIR, Curl's namesake platform, Microsoft's Silverlight and Mozilla's Prism.
Each product has unique strengths and weaknesses. And, while I was impressed with all the products, they illustrate a key problem: Without a standard for RIAs, things will remain fragmented until one platform dominates or everyone agrees on a standard.
RIAs bring another dimension to Web applications that could cause problems for some developers, especially those from predominantly Web authoring backgrounds: As desktop and generally powerful applications, RIAs bring increased security concerns and potential problems to the table. This is especially true if the RIA platform being used has the ability to interact with native operating system processes.
Because of these issues, RIA developers should pay special attention to potential security problems and make it clear to RIA vendors that strong built-in security is a must.
Adobe AIR
AIR 1.0, which was released in March, is in many ways emblematic of all RIAs in that it is both mature and immature at the same time.
Built on a bedrock of longstanding RIA systems such as Flash, AIR is the furthest along of all the RIA platforms I've seen in terms of features and capabilities (especially offline support) and in development options. But AIR is also clearly a brand-new product, and has all the growing pains and limitations of a typical 1.0 product.
The only time most users will think much about AIR will be when they decide to download and install the run-time needed to run AIR applications. The AIR run-time is currently available for Windows and Macintosh systems, and a beta that offers Linux support was also recently released. Once users have installed the run-time, they can download the many sample applications that Adobe has made available, plus run any AIR applications created by other developers.
Of course, the users most interested in AIR will be developers. And, for developers, AIR offers both good and bad news.
On the plus side, there are multiple ways that an AIR application can be created. The most direct way is through Adobe's $249 Flex Builder 3 development application. Flex and AIR have much in common, and it is possible to create an AIR application from scratch using Flex Builder.
Using Flex Builder, I could launch projects as AIR applications, and Flex Builder would handle the creation and packaging of those applications. It was also easy to take any existing Flex application and convert it into an AIR project.
In addition, Adobe provides extensions and plug-ins for Dreamweaver and Flash that, while not really for full-fledged AIR application development, did make it simple to take Web and Flash applications and convert them into AIR applications.
An SDK (software development kit) is available for AIR, and developers who are uncomfortable with traditional Adobe tools may find this the best option.
AIR applications can also be built using traditional HTML and AJAX development techniques. However, those choosing the HTML and AJAX path should realize that it is not completely devoid of Flash influence. Developers will need to have some familiarity with Flash objects and with the ActionScript language used in Flash applications.
AIR's developmental flexibility is a plus in many ways, but it can also cause confusion for those learning the system--especially if they're trying to learn from the source code of other applications. Since there is no one way to create an AIR application, developers may find that the application from which they are learning was created in a method they aren't using themselves. (For example, someone using mainly Flex Builder may find it difficult to learn from an HTML-based application.)
Again, one other important thing for developers to keep in mind, especially those coming from a mainly Web perspective, is the added security concerns associated with creating a desktop application.
To a large extent, AIR applications use a sandbox model that limits how much they interact with the operating system. But these are still desktop applications, and they will touch the system in ways that Web applications never do.
Developers should pay attention to what system resources they are accessing and what data they are connecting to. In the documentation, Adobe has done a good job of breaking down the special security concerns that come with developing desktop applications with AIR.
In general, we found AIR to be the most capable and feature-rich of the RIA platforms we tested, but it is still not all it could be. In addition, while much of its base is open, there are still proprietary elements to AIR, and those interested in a fully open Web will probably be leery of creating important applications on an RIA platform that is closely tied to a vendor.
All the AIR tools and resources can be found at www.adobe.com/air.
Curl
While some RIA technologies are focused on flashy graphics and advertising, longtime RIA player Curl has a more specific focus--helping businesses and developers actually get work done through RIAs.
Unlike the other systems I looked at, Curl is a complete and finished product, and it shows in Curl's capabilities and feature set. Using Curl, I was able to easily build and deploy business-focused RIAs that integrated well with business data systems and applications.
The latest version of Curl, 6.0, which shipped late in 2007, has added beta support for running Curl applications on Mac OS X. (Curl already supports Windows and Linux.) The Curl organization also released several open-source projects for building Curl applications and integrating them with Web services. The basic Curl tools are free, and the professional tools for business use and deployment start at $12,000.
The main tool for creating Curl applications is the Curl IDE (integrated development environment), and I found it a very good, straightforward tool for creating RIAs. Anyone who has ever used standard business-application and form-building tools will instantly feel at home in the Curl IDE. Indeed, I was able to quickly build simple applications using this tool.
Curl applications tend to work well in business and enterprise situations, as they have excellent data-handling capabilities and good information presentation features. In addition, while Curl isn't as focused on animation and graphics as some other RIA platforms are, it does do a good job when it comes to data analysis and reporting graphics.
Since Curl has been around for 10 years, it has a well-established base of users and support, and I was able to quickly find information and help in the developer areas of the Curl Web site.
All the Curl tools and information can be found at www.curl.com.
Microsoft Silverlight
When Microsoft released Silverlight 1.0 in 2007, it was hard not to be impressed with the nearly unprecedented (for Microsoft, anyway) cross-platform capabilities of the new RIA system. Right from the get-go, Silverlight worked on multiple Web browsers, including Firefox and Safari, and ran on both Windows and Mac OS X. In addition, an open-source project is working on bringing Silverlight to Linux systems.
However, while Silverlight's browser and operating system support is impressive, as an RIA platform, its scope is much more modest. In tests, Silverlight proved to be a fairly basic and even old-school approach to building and using RIAs. In fact, Silverlight can't be considered a direct competitor to more advanced RIA platforms such as AIR. If anything, Silverlight is more of a direct competitor to Flash.
Silverlight is designed to run within browsers and has mainly been focused on Web-based animations and interactivity, long the forte of Flash.
And if starting a next-generation RIA platform is a tough task, it could prove tougher, even for Microsoft, to beat an entrenched market leader such as Flash. Since its launch last year, the Silverlight run-time's market penetration has been pretty slow. In fact, the only hope that Microsoft might have to truly challenge Flash is to succeed in its attempt to acquire Yahoo, whose many services and sites could increase Silverlight's reach.
However, while Silverlight may be old-school in its approach to RIAs, it does have its own strengths and unique capabilities. And since it is designed to be friendly to the Microsoft developer community, Silverlight could become a popular choice for these developers when it comes time to build RIAs for their businesses.
In addition, with the March release of the Silverlight 2.0 beta, the Microsoft RIA platform is moving beyond its initial focus on animation and interactivity. With the new release, more data awareness has been added to the Silverlight framework, making it possible to build more business-friendly applications.
As with AIR, developers can take multiple approaches to building Silverlight applications.
For power developers comfortable in traditional Microsoft environments, the best option will be the tools add-on for Visual Studio 2008.
Developers looking for something more in the realm of Flash tools and who are more interested in animation and interactivity will want to test out Microsoft's Expression Blend 2.5. Using this tool, I was able to fairly quickly build simple Silverlight animations and videos.
An SDK is also available, and the Silverlight.net site has a wealth of materials and community forums to help novice Silverlight developers get up and running with the platform.
Future plans for Silverlight include support for offline applications. Right now, however, Silverlight is an interesting but fairly basic version of Flash that doesn't match up to more advanced RIA systems such as AIR.
More information about Silverlight can be found at www.microsoft.com/silverlight/.
Mozilla Prism
While most RIA platforms try their best to be familiar to Web developers, enough new coding and scripting processes have been added that the learning curve has increased, even for experienced developers. This has been necessary because Web applications have traditionally lacked the ability to create interactive user interfaces similar to those found in classic desktop applications.
This has changed in recent years due to the growth of AJAX and similar Web development systems, and it's now possible to build RIA-like Web applications that run in all modern browsers without the need of special run-times or plug-ins.
This means that if one could run a modern AJAX-based Web application outside of a Web browser, it would essentially be an RIA. This is the focus of the open-source Prism project from Mozilla, the creator of the Firefox Web browser.
Prism is a simple but powerful program that makes it possible to take any existing Web application and turn it into a stand-alone application. And even better, you can do this in seconds.
After downloading Prism, I was easily able to point it at any Web application I was using--from Google's Gmail to Zoho to Salesforce.com--and convert it to a desktop application that would run outside of a standard browser window. I found this especially useful for very rich Web applications, as it removed all the unnecessary browser controls and allowed me to focus on the application itself.
Of course, Prism isn't actually removing the browser from the equation. In fact, Prism is essentially a stripped-down version of the Firefox 3 browser.
But this simple approach to RIA development and use may prove to be one of the most attractive for many developers. The biggest benefit is that there is no need to learn any new development techniques. Simply develop your Web application as you would for a browser, and then deliver it through Prism.
None of the applications I tested have offline support, but since Prism is based on Firefox 3.0, it should be possible to create applications that use Firefox's offline capabilities. In addition, with its simple interface, Prism is the only RIA platform I've tested that will be immediately usable by Web users without any development skills.
Keep in mind that Prism is still under the Mozilla Labs umbrella, meaning it is in many ways considered experimental. But that hasn't stopped Prism from being used by some high-profile applications, including the recently released desktop client for the Zimbra mail platform.
Prism runs on Windows, Mac OS X and Linux. Users interested in testing it out can get it at http://labs.mozilla.com/2007/10/prism/.
RIA(Rich Internet Application)를 알려주다!
웹 2.0이 인터넷 기술의 새로운 이슈로 등장하고 있다. 웹 2.0과 관련된 여러 기술들 중 RIA는 웹 2.0을 완성하기 위한 사용자와의 접점으로서 많은 주목을 받고 있다. 백문이 불여일견! 우선 RIA로 구현된 사이트를 간단히 살펴보도록 하자.
국내 사례를 한번 살펴보자. Adobe의 플래시(flash)를 이용하여 구현된 CGV 영화관(http://www.cgv.co.kr)의 예매 서비스로 페이지의 전환 없이 한 페이지에서 영화 정보 확인 및 예매를 할 수 있다. 사용자 인터페이스의 향상과 더불어 사용의 편리성까지 제공할 수 있는 것이 바로 RIA의 가장 강력한 힘인 것이다.
이들 중 현재 주류를 이루는 RIA 기술로는 HTML 기반의 RIA 구현에 주로 사용하고 있는 AJAX/DHTML과 화려한 사용자 인터페이스를 구현할 수 있는 플래시가 있다. 새로운 RIA 시장을 선도하기 위해 경쟁적으로 펼치고 있는 새로운 개발 툴의 출시는 정말 흥미진진하게 보인다. 어떤 RIA 기술이 일반 사용자들에게 매력을 줄 것인지, 어떤 개발 툴이 가장 많이 선택 받을지 관심을 가지고 지켜보도록 하자.
RIA를 한 마디로 표현한다면 ‘한 페이지로 구현된 웹 응용 프로그램’이라 할 수 있다. 실제 많은 비즈니스 로직이 존재하지만 사용자는 한 페이지를 이용하여 모든 기능을 이용하게 된다. 일반적인 웹 페이지의 페이지 이동과 새로 고침의 깜박임 없이 모든 내용의 확인과 기능을 이용할 수 있는 RIA. 매력적이지 않은가?
그렇다면 RIA를 사용하여 얻을 수 있는 장점이 과연 무엇일까? 대표적으로 리치(rich)한 클라이언트 사용자 인터페이스 제공이 있다. RIA 방식으로 구현하면 사용자에게 HTML 위젯(widget)을 사용하는 효과 이상의 보다 그래픽적인 사용자 인터페이스를 공급할 수 있다. 예를 들어, 웹 페이지에서 드래그 & 드롭(drag & drop)이 가능하고, 슬라이드 바를 이용하여 데이터 변경이 가능하게 된다. 또한 클라이언트에 비즈니스 로직 부분을 구현하여 복잡한 계산을 서버가 아닌 클라이언트에서 수행할 수 있다. 그렇기 때문에 일반적으로 보다 향상된 서버의 응답을 구현.할 수 있는 것이다. 이처럼 RIA를 사용하면 사용자 인터페이스의 향상뿐만 아니라 성능 향상의 장점을 가질 수 있다. 즉 RIA에서는 서버와 클라이언트 사이의 부하의 분산이 가능하게 되어 서버의 성능 향상에 도움을 주는 것이다. 또한 비동기 통신(asynchronous communication)을 이용하여 사용자에게 보다 빠른 응답속도를 보이는 것처럼 구현할 수 있다. 사용자가 클릭 하였을 때 그 결과를 미리 비동기 통신으로 저장한 뒤 바로 보여줄 수 있으므로 사용자가 느끼는 체감 속도는 상당히 빨라지고, 서버의 응답 이전에 다른 작업을 수행할 수 있다. 이는 구글 맵(Google Maps)에서 쉽게 확인할 수 있는 방식으로 사용자가 지도를 드래그하면 바로 처리가 되는 것을 확인할 수 있다.
더불어 RIA 방식은 초기 프로그램 구동에 시간이 소요된다는 단점이 있지만, 반면에 프로그램 설치가 필요 없다는 장점을 갖고 있다. 그렇기 때문에 사용자들은 어디에서나 쉽게 사용할 수 있고, 프로그램의 버전이 올라가더라도 쉽게 배포할 수 있는 것이다. 이처럼 RIA는 사용자 인터페이스 개선 및 성능 향상이라는 두 마리의 토끼를 잡을 수 있는 현재 진행형의 기술이다. 물론 개발의 난이도가 높아지는 문제가 있지만 사용자들은 이런 개발자들의 고충은 모른다. 자신들이 사용하기 쉽고, 매력적인 프로그램을 선택할 것은 뻔한 이야기라는 것이다.
도스 환경에서 윈도우 프로그램을 처음 사용하였을 때의 GUI 변화에 대한 충격을 기억하는가? 내년에는 윈도우 XP에서 윈도우 Vista로의 새로운 GUI 환경 변화가 우리를 기다리고 있다. 또 얼마나 많은 충격과 변화가 일어날지 아직까지는 느낄 수 없을 것이다. 하지만 분명 변화는 이미 시작되었다는 것이다. 사용자에게 보다 멋진 GUI 환경을 제공하려는 시도는 운영체제, 웹의 구분 없이 계속 될 것이다. 이와 함께 사용자 경험에 밀접한 관계가 있는 RIA는 향후 웹 비즈니스 구현에 가장 중요한 기술로 거듭 자리매김을 할 것이다. 지금의 RIA는 과도기의 모습이다. AJAX와 같은 기술은 잠시 스쳐 지나가는 하나의 흐름일 뿐이다. 앞으로 웹 환경은 벡터 그래픽 환경이 기본이 되고, 3D를 이용한 실제 체험이 가능한 모습으로 변화할 것으로 필자는 확신한다. 쇼핑몰을 이용하면서 자기의 3D 캐릭터에 직접 옷을 입혀본 뒤 제품 구매를 선택하고, 다양한 각도에서 실제 물건 보듯이 살펴볼 수 있는 서비스가 바로 눈앞에 있는 것이다. 여러분들은 RIA와 웹의 미래 모습이 어떨 것이라 생각하는가? |
2010년 1월 18일 월요일
2010년 1월 12일 화요일
진화하는 RIA, UX혁신 급물살
지디넷에서 11월 한달 간 RIA 집중조명에 대한 기사가 소개되었습니다.
Adobe Flash Platform을 한 눈에 볼수 있고, 2010년 RIA시장을 예측할 수 있는 기회가 될 수 있을 것 같습니다.
1. [지디넷코리아]어도비, 3대스크린 선점 노린다(기사보기)
99%의 PC에 플래시 기반 서비스와 애플리케이션을 돌릴 수 있는 플레이어(런타임)를 깔아놓은 아성을 휴대폰과 텔레비전 등 디지털 가전에서도 이어나가겠다는게 핵심이다. 휴대폰과 텔레비전을 잡을 경우 어도비는 PC시장을 치고들어오는 
를 상대로 경쟁우위를 유지할 수 있게 된다.
http://www.zdnet.co.kr/Contents/2009/10/29/zdnet20091029101138.htm
2. [지디넷코리아]진화하는 RIA, UX혁신 급물살(기사보기)
HTML 중심의 조용한 웹은 이미 과거의 유물이 됐다.
동적이고 쌍방향에 기반한, 다시 말해 UX를 고려한 웹이 대세론을 탔다. 플래시처럼 웹에 데스크톱 애플리케이션과 같은 다이내믹한 UX를 녹일 수 있도록 해주는 리치인터넷애플리케이션(RIA) 기술도 덩달아 주가폭등이다.
http://www.zdnet.co.kr/Contents/2009/10/29/zdnet20091029094702.htm
3. [지디넷코리아]개발자들, RIA를 말하다(기사보기)
RIA를 바라보는 고객들의 요구는 갈수록 깐깐해지고 있다. 단순한 RIA 환경을 벗어나 보다 입체적이고 비즈니스에도 기여할 수 있어야 한다고 얘기는 기업들이 부쩍 늘었단다. 기업들은 이제 단순한 차별화를 넘어 비즈니스를 고려한 UX를 고민하고 있다는 얘기다.
http://www.zdnet.co.kr/ArticleView.asp?artice_id=20091123131255
4. [지디넷코리아]플래시 플랫폼 기반 웹서비스 확산(기사보기)
어도비시스템즈 플래시는 인터랙티브한 웹사이트를 제작할 수 있는 웹저작 도구다. 마시마로, 졸라맨 같은 플래시 애니메이션 대중화를 이끌었고 기술 진화와 함께 리치 인터넷 애플리케이션(RIA) 환경으로 대표되는 사용자 중심의 웹서비스 확산도 주도하고 있다. 최근에는 엔터프라이즈 분야에도 적용이 확산되고 있다. 플래시 플랫폼을 활용한 최신 웹서비스 사례를 소개한다.(네이버 가계부, 포토앨범 서비스, 다음 로드뷰, 삼성화재 마이애니카)
http://www.zdnet.co.kr/Contents/2009/11/23/zdnet20091123144502.htm
5. [디지털타임즈]어도비, 포털 RIA 사업 강화(기사보기)
한국어도비 관계자는 "네이버와 다음의 다른 서비스로 플래시 플랫폼 공급을 확대하는 것은 물론, 또 다른 포털사이트에 공급하는 방안도 논의 중"이라고 말해 앞으로 포털사이트를 대상으로 한 플래시 플랫폼 공략에 가속도가 붙을 것으로 전망된다.
http://www.dt.co.kr/contents.html?article_no=2009102602010560739002
silverlight
실버라이트로 만들어진 사이트를 보여준다.
AIR보다 조금 떨어진다고 여겼는데 만들어진것을 보니....생각보다 놀랍다.
http://silverlight.net/showcase/
그중에서도 http://www.amzmodels.com/ 이사이트는 들어가 볼만한 곳이다.
^^
2010년 1월 7일 목요일
오픈 소스
오픈소스로 공개되어 있는 LMS의 종류가 상당히 많습니다. 이 중에서 무들(Moodle)이 가장 활발하게 사용되고 있다고 합니다. 기존의 자료들만 잘 이용해도 충분한 세상입니다.
캡티베이트, 아크로뱃커넥트를 엮어서 Suite로 팔고 있지요.
상용입니다. 이런 류의 저작도구는 상당히 많습니다. 저작의 편리성과 멀티미디어 자원의 활용성이 중요한 것 같습니다.
저작의 방식은 비슷한 것 같습니다. 문제는 소소한 멀티미디어 효과와 즉시활용가능한 자원의 개수뿐
어느 분께서 이거 말고 더 편리한 이러닝 저작도구 없냐고 물어보시네요. 더 좋은 건 직접 플래시로 만드는 수 밖에 없을 것 같습니다.
IT의 내공도 중요하겠지만, 핵심적인 주제에 지속적으로 관심을 둘 수 있느냐도 상당히 중요한 문제일 것 같습니다. 그리고 그냥 활용 외에 창조도 해야할텐데요.
게시판에 열심히 쓴 글을 날려 본 사람들은 그 심정을 이해할 수 있지요? 이제 파폭에서 라자루스(나사로)를 사용하면 걱정 붙들어 맬 수 있겠습니다.
언론은 넘어서는 언론이라는 기치를 내 걸고 1인 미디어를 지향하는 플랫폼이 등장했군요. 새로운 시도로 돌풍을 일으킬 것인지 찻잔 속 태풍일지 지켜볼 일입니다.
장애인들의 웹 사용 실태를 조사한다고 하네요. 주변에 장애인이 있다면 알려주기를 부탁하시는군요.
아이디어가 돋보입니다. 요즘은 아이폰앱이나 안드로이드용 앱을 개발하는 것이 대세인데, 위피용 휴대폰 앱이라는 것도 특색 있네요.
2010년에는 안드로이드 기반 스마트폰이 전세계적으로 돌풍을 일으킬 수 있을지 기대되네요. 국내에는 언제쯤 들어올 수 있을까요? 들어올 수는 있는 것이긴 할까요?