와. 신기합니다.
날씨에 따라 핸드폰의 배경이 자동으로 바뀝니다.
구경함 해보세요.^^

어렸을 적 책읽기를 아주 싫어했었습니다. 그러던 것이 옆집 사는 친구에 의해 만화책을 접하게 되면서 책 읽기에 습관을 붙였고, 보고 싶던 만화책을 다보고 나니 손이 심심해서 소설책을 보게 되었습니다.
소설책을 시리즈로 구매하고, 계속해서 읽다보니 나중엔 책을 읽지 않으면 뭔가찜찜한 기분이 들게 되더라구요.
대학교 때 읽은 책이 그래서 한 1,500권 정도 됩니다.
지금은 바쁜 일상 때문에 과거와 같은 책 읽기를 하지 못하는 아쉬움이 있습니다.(게을러 진것도 포함)
아무튼 그 때 읽었던 다양한 분야의 책들이 사회 생활 하면서 도움이 될 때가 아주 많았습니다.
종교적 이슈나, 사회 문화적 이슈에 대해 접근할 수 있는 이해의 바탕이 되었고, 서로 다른 분야나 부분에 대해 조금이나 연관지어 이해할 수 있는 부분이 생겨나게 되었습니다.

왜 이런 이야기를 하게 되었냐면 HCI라는 학문도 여러분야와 연관되어 발전되고 있기 때문입니다.
인간은 참으로 다양한 활동을 합니다.
하루 3끼 밥을 먹고, 신문이나 TV 인터넷을 보고, 자동차를 몰면서 건물을 오르락 내리락 하고 걷기도 하고 사람들을 만나기도 합니다.
인간이라는 존재는 다른 사물 사이의 접점, 즉 인터페이스는 인간의 활동과 뗄래야 뗄수 없는 관계라고 생각됩니다. 흔히 HCI라고 하면 컴퓨터와 사람 사이의 인터페이스만 생각하기 마련인데 사람은 컴퓨터 뿐만이 아니라 다양한 사물과 접촉하기 때문에 다양한 형태의 상호작용을 이해하는데 필요한 학문이라고 생각하는게 더 좋을 것 같습니다.
결국 모든 것을 알아야 할지도 모른다는 생각이 듭니다. 하지만 학문이라는 것이 인간 행위의 모든 것을 설명할 수 는 없을 것 입니다. 끊임없는 관찰과 지속적인 인간 중심 고려만이 HCI를 하기 위한 기본 조건이 아닐까 생각해 봅니다.

그러기 위해선 경험이라는 부분이 매우 중요하다고 봅니다. 불편한 것에 대한 경험이 있어야 편한 것을 고민할 수 있고, 또 편한 것을 경험해야 편리함이 주는 이익에 대해 잘 알 수 있다고 생각합니다.
이것이 맞는 이야기 인지 아닌지는 모르겠지만 전 HCI라는 학문을 생각할 때 마다 옵션이 차별 적용되어 있는 자동차를 생각합니다.

(포드의 휴먼카 : http://www.hdvr.org/zbxe/files/attach/images/90563/116764/the-human-car-1.jpg)

깔끔한 인터페이스와 고장이 적은 것을 좋아하는 사람은 기본 옵션의 자동차를 고르게 될 것이고, 화려한 옵션과 편리함을 추구하는 사람은 풀-옵션 또는 세미-옵션의 자동차를 선택할 것이기 때문입니다.
기본 자동차를 타던 사람 중의 하나가 기본의 불편함을 느껴 옵션이 많이 적용된 자동차를 고르는 것은 편리함을 느끼고자 하기 때문일 것이고, 옵션이 많은 자동차를 타던 사람은 다양한 옵션 때문에 느끼게 되는 조작의 불편함이나 잦은 고장등에 스트레스를 느껴 기본 옵션의 자동차를 고를 수 있기 때문입니다.

어느 쪽이든 기본옵션의 자동차를 타던 옵션이 다양하게 가미된 자동차를 타던 인간이 중심이 되어 선택을 하게 되고 제품에는 인간 중심적인 설계를 하게 될 것이기 때문입니다.

따라서 HCI에 관심이 많다면 다양한 경험과 인간에 대한 끊임없는 고민 그리고 인문학 분야에 관심을 가지면 많은 도움이 되지 않을까 생각해 봅니다.

HCI는 문자 그대로 인간과 컴퓨터간의 상호작용이라고 합니다.
과거의 컴퓨터 학문은 단지 '기술' 이라는 것에만 촛점을 맞추고, 기술을 잘 구사하는 인력 양성에 그 핵심 목적이 있었다고 본다면 HCI는 그 범위에 사람들까지 포함시켜서 연구하는 학문이라고 합니다.

사실 요즘은 기술의 깊이보다는(그렇다고 기술이 중요하지 않다는 것은 아닙니다.) 그것을 사용하는 사람에 촛점을 맞추고 애플리케이션들을 개발합니다. 내부적으로 멋진 구성과 신기술이 집약된 애플리케이션이라 할지라도 그것을 사용하는 사람이 어렵게 느낀다면 외면 받는 것은 시간 문제일 뿐이기 때문입니다.

활자로 빽빽하게 설명된 책보다는 적절한 그림과 아기자기한 구성으로 이루어진 책이 사람들에게 더 어필되는 것과 같은 이치라고 봅니다. 결국 애플리케이션을 만드는 데 사용된 기술이 더 의미있는 기술이 될려면 복잡하지 않으면서 필요한 부분이 충족이 되고 또 그것을 사용하는 사람들의 요구가 얼마나 잘 반영되어 있는가에 달려 있다고 봅니다.

고객의 요구로 어떤 개발을 진행할 때도 '어떻게 하면 편리하게 개발할까?' 라는 고민을 하다보면 기존에 작성해 놓은 것을 잘 이용하여 조립의 형태로 빠르고 쉽게 개발을 진행하곤 합니다. 기술로 무언가를 구현하는 사람들이든 그 결과물을 사용하는 사람들이든 '편리함' 이라는 것을 더더욱 찾게 되는 것 같습니다.

처음 기술이 소개되는 시대에는 기술 자체를 좋아하는 사람들이 많지만 기술의 성숙기에 접어들게 되면 편리함과 해결책을 원하는 사람들이 많아지게 된다. - 무어(G.A Moore), 노만(D.A. Norman)

사용자에 대한 개발자의 이해 부족이 중요한 이슈가 될 수 있다.

HCI의 시대는 인간 중심의 시대이다.

HCI는 인간이 사용하기에 적합한 인터랙티브 컴퓨터 시스템을 설계-평가-구현하는 그 과정과 주요 현상에 대해 연구하는 학문이다. - SIGGHI)

HCI는 다 아시다시피 Human Interaction Computer의 약자 입니다.
'인간과 컴퓨터의 상호작용' 이 의미가 중요한데요.

컴퓨터 분야에서 '기술'은 빼놓을 수 없는 아주 중요한 대상입니다.
무언가를 구현해서 사람들에게 이로움을 주는 도구가 되기 위해 도구로서의 충실한 기능이 보장되어야 했고, 그런 도구를 만들기 위해선 '기술' 이라는 것이 강조되어야 했었습니다.

기술의 발전은 도구의 복잡함을 야기했고, 인간은 도구를 통해 편리한 생활을 보장받아야 함에도 그렇지 못했습니다. 기술적 관점도 결코 소홀히 할 순 없지만 컴퓨터가 도구가 됨에 있어 그 동안 간과되었던 인간에 대한 배려가 도구에 녹아들기 시작합니다.

Human Computer Interaction은 '사람'을 이해하는 학문으로써 기술적 요구의 충족은 기본이고, 거기에 추가적으로 도구를 사용하는 사람들의 의견도 중요시 하는 분야입니다.

관련 링크 : http://www.slideshare.net/chrisbernard/microsoft-ux-platform-and-tool-overview-by-chris-bernard

지난 수요일에 친할머니가 돌아가셔서 3일간의 상을 마치고, 집에 왔습니다.

삼일동안 접속할 수 없었던 블로그에 들어와 보니 짱묜님이 방명록에 글을 남겨 주셨습니다.
그래서 짱묜님의 블로그를 방문했습니다.
오~ 디자이너 관점에서 보는 실버라이트 강좌가 매우 내실있고, 간략 깔끔하게 잘 정리 되어 있었습니다.
개발자가 아닌 디자이너의 입장에서 실버라이트에 대해 꼼꼼하게 알고 싶다면 짱묜님의 사이트에서 많은 도움을 받을 수 있을 거라 생각됩니다.

한번 방문해 보세요.^^

짱묜님의 블로그 : http://zzangmyon.tistory.com/

안녕하세요~ 세티 입니다.
오늘 날씨가 영~ 미덥지 않아요. 비가 오다가 안오다가 ^^

오늘 역삼동 삼성멀티캠퍼스에서 열린 제 1회 소프트웨어 아키텍트 대회에 참가했었습니다.
(관련주소 : http://search.lemonmail.co.kr/online_survey/080619_kosta/sub_page.html)

음~ 저는 웹2.0과 프레임워크라는 트랙에서 RIA와 UX아키텍처를 주제로 발표를 했었습니다.
나름 준비를 많이 한다고 했는데 오늘은 평소보다 더 긴장이 되더라구요. 그리고 나름 멋진 멘트도 준비해놨었는데 홀라당 까먹어 버리고 본의 아니게 말도 몇 번 꼬이고 그랬습니다.^^; 자료 마지막 장에 레퍼런스 기록하는 것도 까먹고...이래저래 딴데 정신 팔려 할 것도 제대로 못하고 있는 중 입니다.(더위 먹었나...헥헥)

아무튼 RIA기술을 잘 활용하기 위한 도구와 개념은 기술회사나 벤더들에 의해서 경험과 노하우가 어느 정도 공개 되는 것 같은데요~ 하지만 아직 그것을 적절히 가공할 엔지니어나 디자이너의 역할 분담이나 또 그들이 만들어낼 소프트웨어의 협업과정, 또 협업을 하기 위한 작업 환경 등은 아직 최적화되어 있지 않은 상태라고 보여집니다.

지난 포스트에서 User Experience Architecture 를 정리했습니다.
이 포스트에서 저는
 

UX 기반 애플리케이션 제작에서 디자인팀과 기술팀간의 협업이 매우 중요하므로 다이나믹한 환경을 제공하여 불편함이 없도록 합니다.

라고 글쓴 부분이 있습니다.

오늘 그런 다이나믹한 환경을 갖추고 일을 하는 곳을 찾았습니다.
바로 Microsoft MED(Mobile and Embedded Devices Division) 의 사용자 경험 그룹의 작업 공간입니다. 지난 포스트의 글과 아래에 소개하는 동영상을 같이 보면 UX 작업환경에 대해서 "아하~" 하고 느껴지는 부분이 있게 될 것입니다.^^

같이 맛있게 감상해 보아요~ ^^*

(Microsoft MED User Experience Group Workplace Design)

요즘 UX에 관심이 많은 세티 입니다.^^
참 많은 분야들이 있네요...호호호~
호기심 있는 분들은 여기에 있는 키워드를 이용해서 검색 바다를 누벼보시기 바랍니다.
꽤 많은 그리고 잼있는 내용들이 있으니깐요~~

HCI - Human computer interaction

전산학, 심리학, 산업공학과 연계되어 연구가 진행됨.

목적
인간이 쉽게 컴퓨터를 쓸모있게 하기 위함.

관심분야
인터페이스 설계 방법론
인터페이스 구현 방법론
인터페이스 비교 평가
새로운 인터페이스 상호 작용 기술 개발
모델이나 이론의 개발
인간 사이의 의사소통과 협력(CSCW)

연구분야
미학
인류학
인공지능
인지과학
산업디자인
인간공학
도서관학
심리학
사회심리학
사회학
사용자 경험 디자인

UIE(User Interface Engineering)

usability.gov

IxDA(Interaction Design Association)

IUI(Intelligent User Interface)

STC Usability & User Experience Community [1]

IFIP

HFES(Human Factors and Ergonomics Society)

UPA(Usability Professionals’ Association)

The British HCI Group

ACM SIGCHI

한국디지털디자인협의회

한국정보과학회

한국디자인학회

대한인간공학회

한국HCI학회

 최근 Silverlight, Flex와 같은 RIA기술이 매우 주목을 받고 있습니다. 제 블로그에서 제공되는 검색 키워드 통계를 보면 1위가 Silverlight 입니다. Silverlight와 같은 RIA기술은 사용자 경험(UX)을 최대한 반영하여 고객이 만족할만한 애플리케이션을 만드는데 필요한 기술입니다. Silverlight외에도 사용자 경험을 애플리케이션에 반영하기 위한 기술로는 Flex나  Ajax도 있습니다. 그리고 약간 다르긴 하지만 닷넷이나 자바를 이용해서도 조금 복잡하긴 하지만 UX가 고려된 데스크탑 애플리케이션을 만들수 있었습니다. 하지만 기술이 너무 특정 플랫폼을 지향했다거나 혹은 간단한 기능 구현을 위해 너무 많은 코드를 필요로 한다거나 하는 문제점들이 있었기 때문에 플랫폼에 비교적 자유롭고 간단한 코딩만으로도 다양한 기능을 표현하기 위해서는 새로운 무언가가 필요했던 겁니다.

 사용자 경험을 애플리케이션에 녹이고, 고객이 만족할만한 결과물을 만들기 위해 관련 RIA기술(Silverlight, Flex등)에 대해 잘 파악하고 이해하는 것도 중요하지만 사실 그것보다 더 중요시 되야 할 것이 있다고 보는데 그건 바로 UX기반 애플리케이션 제작을 위한 아키텍처라고 생각합니다. 아무리 기술이 있어도 만들고자 하는 애플리케이션을 개념이나 기술적으로 잘 설계하지 않으면 매우 조잡한 형태의 RIA가 될 것이기 때문입니다.

우리가 만들려고 하는 애플리케이션이 이런 대접을 받아선 곤란하겠죠? 그러한 이유로 오늘은 UX 아키텍처에 대해 조금 알아보도록 하겠습니다.

UX 아키텍처를 이용하여 웹 애플리케이션을 제작할 때 중요하게 생각해야 할 점은 사용자 경험과 그것을 기반으로하는 매우 인터렉티브한 애플리케이션이 탄생해야 한다는 겁니다. 이러한 애플리케이션을 제작하기 위해선 웹 사이트 제작을 위한 철저한 전략이 필요하고, 또 사용자 경험이 가미된 그러면서도 새로운 것에 대해 창조를 하고자 하는 창조성과 차별화된 디자인이 필요합니다.

위에 언급한 3가지, 즉 차별화된 전략과 창조, 디자인을 위해선 객체간의 인터렉티브한 관계와 특징, 기능을 파악하고, 정보를 어떻게 보여줄 것인지를 고려해야 합니다. 그리고 사용자가 이용하게 될 네비게이션을 어떻게 설계해야 사용자들에게 큰 감동을 줄 것인지 고민도해야 하고, 애플리케이션의 주요 목적 중의 하나인 데이터를 어떻게 보여주어야 할 것인지도 고민해야 합니다. 그러고 보니 고민 투성이네요.^^;

아래의 그림은 사용자 경험을 기반으로 애플리케이션을 디자인을 할 때 고려되어야 할 부분을 포함한 원 입니다.
정말 기존 애플리케이션 제작에서 고려되던 것들 보다 훨씬 방대한 영역에 대한 고민이 있어야 함을 보여주고 있습니다.

이러한 다양성이 가미되는 UX애플리케이션의 컨셉을 정하고, 또 모두가 원하는 결과를 이끌어내기 위해선 반드시 고객이 요구하는 비즈니스 모델과 그들이 원하는 목표를 정하고, 기존에 가지고 있던 웹 사이트의 특징을 잘 파악하는 등의 업무를 고객과 함께 추진해야 합니다. 또한 필요하다면 세일즈, 마케팅, 디자인과 같은 별도의 비즈니스 그룹, 개발팀 등과 함께 작업도 진행해야 합니다.

이러한 다양한 이해 관계자를 통해 수집된 정보를 바탕으로 애플리케이션 제작전에 미리 사용성에 대한 테스트를 수행하여 이해 그룹과 다양한 의견을 피드백 해야 합니다.

그럼 UX 기반 인터렉티브 애플리케이션을 제작하는데 필요한 핵심 기능을 정리해보겠습니다.
먼저 사이트 구조를 정의하고 정의된 사이트 구조에 네비게이션의 개념을 도입하고, 필요한 기능들을 배치합니다. 그리고 개발을 위해 사용하기 쉬운 프레임워크를 준비해야 하고, 팀원 모두가 이해할 수 있도록 동일한 페이지 레이아웃을 제공하고, 설계나 컨셉에 대해 일관성을 부여해야 합니다. 그래야 고객이나 개발자와 같은 이해 당사자들끼리 개념이 공유될테니깐요. 그리고 그것에 간단한 특징을 가지는 상호작용성을 부여하여 모델링을 해보는 것입니다.

그리고 프로세스 플로우를 이용하여 애플리케이션에 대한 map을 만들어 봅니다. 모든 개발팀과 고객들에게 사용성에 대한 가이드를 제공하고, 개발팀에는 개발 프로세스를 지원하도록 합니다. 주요 사용자를 위해 고객 중심 디자인과 고객 경험 그룹이 위의 제시된 것들에 대해 함께 그것을 느낄 수 있도록 합니다. 또한 의뢰인을 대상으로 실제적인 리허설을 실시하빈다. 개발팀은 플로우와 네비게이션을 분석하여 애플리케이션이 완벽하게 제작될 수 있도록 합니다. 개발을 진행하면서도 고객의 분석을 다시 요구하고, 또 여러 이해 관련 팀과 미팅을 수시로 진행하여 전략을 정의합니다.

이렇게 다양하게 취합된 요구와 분석 결과를 토대로 애플리케이션의 내부와 외부 그룹에 대해 인터페이스와 인터렉션을 가능하게 하는 정보 아키텍처와 인터렉션 디자인 스키마를 그립니다.
이것을 그릴 때는 아래에 제시된 것들을 준비하면 많은 도움이 됩니다.

- 사이트 맵
- 컨셉 다이어그램
- 사용자 프로필 과 사용자 시나리오
- 콘텐츠에 대한 요구와 매트릭스
- 플로우 다이어그램
 
UX 기반 애플리케이션 제작에서 디자인팀과 기술팀간의 협업이 매우 중요하므로 다이나믹한 환경을 제공하여 불편함이 없도록 합니다. 그리고 앞에서 언급한 전략, 개발, 진실성, 사용성 테스트, 사용자 경험에 대한 훈련을 실시하고 정보 아케텍처 전달을 위해 템플릿을 생성하고 그것을 유지할 수 있도록 노력합니다. 또한 내부 프로젝트에서 요구된 조사나 작업을 잘 지휘하도록 노력합니다.

그럼 사용자 경험을 애플리케이션에 잘 부여하기 위해 우리는 어떤 지식 어떤 경험, 그리고 인력을 가지고 있어야 할까요?

먼저 경험적 부분을 언급하자면 인간이 가지는 모든 실질적인 부분이나 HCI, 정보 아키텍처, 사용자 인터페이스 디자인, 인터렉션 디자인, 산업 디자인에 대한 이해를 가지는 사람이 필요합니다. 그리고 XHTML, CSS, Javascript 환경에서 3~4년 정도 경험 디자인을 해본 사람, 인터넷 컨설팅 회사나 인터넷 비즈니스에서 5년간 경험과 관련된 일을 한 사람, 3~4년 정도 클라이언트의 다양한 요구를 경험하게 사람이 필요합니다.

그리고 개인의 능력적 부분을 다뤄 보겠습니다.
- 사용자 인터페이스에 대한 원칙, 사용성에 대한 원칙, 이슈나 기술과 같은 정보 디자인이나 정보 아키텍처에 대해 깊은 이해를 가지고 있어야 합니다.
- 머리 속에 들어있는 이미지를 모두에게 공유해주기 위해선 Microsoft visio나 Omnigraffie, 어도비 이디자인과 같은 common 다이어그램을 능숙하게 그려내고 시연할 수 있어야 합니다.
- 뛰어난 문제해결 분석력과 비판적 생각을 잘하는 기술이 있어야 합니다.
- 시나리오를 잘 쓰고, 커뮤니케이션이 원할해야 하며, 조직화 하거나 프리젠테이션 하고 조사 하는 기술이 뛰어나야 합니다.
- 요구되지 않은 부분도 사용성을 테스트하고, 분석결과를 도출하고, 다양한 분야의 그룹으로 부터 조언을 받습니다.

이렇게 적고 보니 'UX 기반 RIA 애플리케이션 만들기가 참 쉽지는 않구나.' 하는 생각을 해봅니다.
그러고 보면 UX를 중요시 하는 세상에서 이젠 기능적으로 애플리케이션을 잘 만들기만 한다거나 디자인적으로 뛰어난 애플리케이션만 만들어서는 100% 고객이 만족하는 애플리케이션이 나올 수 없다는 결론이 나오게 됩니다. 개발자는 디자인에 대한 이해를 가져가야 하고, 디자이너는 개발자에 대한 이해를 필수적으로 가져가야 하며 사용성을 설계하는 아키텍처는 다양한 분야에 대한 그 중에서도 특히 인간에 대한 고민을 필수적으로 가져가면서 애플리케이션을 설계해야 하고, 이젠 UX기반 애플리케이션 프로젝트 팀원 모두가 서로의 작업에 대한 이해를 완벽하지는 않더라도 조금씩은 가져가야 한다는 결론이 나오게 됩니다.

UX.... 어찌보면 무서운 단어지만 그 만큼 새로운 영역이므로 도전하는 자가 제일 먼저 과실을 따먹게 되는 또 하나의 새로운 기회가 될 것입니다.

새로운 세상... 이젠 기술보다는 사람에 대한 이해가 먼저인 세상입니다.^^

참고주소
http://www.montparnas.com/articles/what-is-user-experience-design/
http://www.semanticstudios.com/publications/semantics/000029.php
http://www.squareonesolutions.net/portfolio_universal.jsp
http://www.rohdesign.com/weblog/archives/cat_design.html
http://www.littlespringsdesign.com/blog/blog/2008/05/21/user-experience-from-a-system-architects-perspective/

코엑스에서 REMIX08 이 열립니다.
RIA관련 레퍼런스가 필요해서 저도 행사에 참석해서 다양한 뉴스를 접하고 올 생각입니다.

시간 : 2008년 6월 11일 09:00 ~ 18:00
장소 : 코엑스 Auditorium

1. 사용자 경험(User Experience)이란?
 - 사용자가 어떤 시스템이나 제품, 서비스 등을 직간접적으로 이용하면서 느끼고 생각하게 되는 총체적 경험
 - 하드웨어, 소프트웨어가 아닌 피플웨어적 접근에서 고민해야 한다.
 - 산업디자인, 소프트웨어 공학, 마케팅, 경영학의 중요한 과제
 - 감성적, 이성적으로 사람에게 만족감을 주지 못하는 경우를 조심해야 한다.
 - 최근의 제품 개발에서 디자인이 매우 중요한 포인트를 차지하며, 디자인시 User Experience Design을 고려.
 - 제품 디자인, 상호작용 디자인, 사용자 인터페이스 디자인, 정보 아키텍처, 이용성 등의 분야에서 주로 연구.

2. 사용자 경험의 역사
- 에드워드(E.C.Edwards)와 카시크(D.J.Kasik)의 User Experience With the CYBER Graphics Terminal 에서 언급함.
- 1970년대와 80년대에 인간 중심 디자인(Human Centered Design, UCD)의 맥락에서 연구가 많이 이루어짐.
- 1993년 애플 컴퓨터의 도널드 노먼이 인간-컴퓨터 상호작용 연구에 큰 영향을 미침.
- 1998년 조셉 파인(B.Joseph Pie II)과 제임스 길모어(James Gilmore)가 하버드 비즈니스 저널에 Welcome to the Experience Economy라는 기사를 발표하고, 1999년에 저서를 출간함.
- 월트 디즈니의 경험의 가치에 주목

참고
1. 브렌다 로렐:디자인리서치(Design Research, Method and Perspectives), MIT Press(2004) ISBN 0-262-12263-4
2. 조셉파인, 제임스 길모어: 경험 경제로의 초대(Welcome to the Experience Economy)

최초 작성자: 세티
최초 작성일: 2008년 5월 5일

꽤 오래된 자료 인데 개인적으로 필요해서 번역을 했습니다.
그리고 많은 부분을 의역화 했습니다.


A Look at Rich Internet Applications
By Cameron O'Rourke

2002년부터 2004년까지 2년동안 Rich Client를 이용한 흥미있는 아이디어가 많이 나오게 되었습니다. Rich Client의 사용자 인터페이스는 HTML 보다 더 견고하고, 응답적이고 비쥬얼한 흥미를 주기 때문입니다.

Rich Internet Application(RIA) 기술은 웹을 이용하여 Rich Client를 배포할 수 있는 기술을 말합니다. RIA는 그 어떤 누가 예측하더라도 완벽하게 HTML을 대체할 수 있을 것이라 여겼습니다. 그러나 복합적인 애플리케이션을 실행하기 위해선 "fat client" 기술처럼 저렴한 비용으로 복합적 애플리케이션을 실행할 수 있는 대안이 요구되었습니다.

왜 Rich Internet Application인가?
HTML 기반 애플리케이션은 간단한 아키텍처와 낮은 비용으로 배포를 할 수 있었기 때문에 많은 인기가 있었습니다. 그리고 HTML은 누구나 쉽게 배우고 또 사용할 수 있었습니다. 많은 사용자와 개발자들은 새로운 데이터와 애플리케이션에 즉시 접속할 수 있었고 또 잠시 자리를 비웠다가 다시 컴퓨터 앞으로 돌아왔을 때에도 그 상태 그대로 사용자 인터페이스를 보여줍니다. 이것은 웹 기반에서 의미있는 UI의 기능보다 더 중요한 이점이었습니다.

그러나 HTML은 우리가 확신을 가지고 사용하게 되는 애플리케이션과 잘 맞지 않았습니다. 그 이유는 다음과 같은데 복잡한 애플리케이션은 한 트랜잭션에서 완벽하게 몇몇의 페이지를 다시 그려줘야 하기 때문입니다. 예를 들어서 의학 분야나 금융 분야 처럼 확실하게 필드를 보여줘야 하는 케이스에서는 느린 상호작용을 보여주면 안됩니다. 또한 프로젝트 매니지먼트 시스템과 같은 것을 만들때도 HTML 애플리케이션으로 조작 되야 하고, 유저에게 차트, 스케줄, 계층적인 것과 같은 것들을 보여줘야 합니다.

더 나아가 오프(off)된 상태에서도 바로 스크립트와 쌍방향 작용이 가능해야하고, 입력 폼에 의해 입력되는 값들은 브라우저에 의해 간단한 이름/값 쌍으로 보내질수 있어야 합니다. 또한 XML 문서로 부터 복합적인 데이터 구조를 받고 보낼 수 있어야 하기 때문입니다.

HTML과 달리 RIA의 유틸은 다른 그 어떤 것보다 강력한 클라이언트-사이드 렌더링 엔진입니다. 그것은 일반적인 애플리케이션에 비해 허술하지 않으며 그래픽적인 Rich User Interface를 통해 응답할 수 있습니다. 추가적으로 컨트롤의 다양성(슬라이더, 데이트 피커, 윈도우즈, 탭, 스나이퍼, 게이지 등)이 있으며, 일반적인 SVG나 다른 매커니즘에 따르는 그래픽 생성을 수용 합니다. 어떤 RIA기술은 데이터 변경시 응답하는 풀 모션 애니메이션을 제공하기도 합니다.

이런 RIA의 또 다른 이점은 데이터가 클라이언트에 캐쉬될 수 있다는 점, HTML 보다 서버에 라운드 트립하는게 낮다는 점, 그리고 최근의 트랜드가 텍스트 기반의 웹 클라이언트에서 멀어지면서 무선이나 디바이스를 지원하는 Rich Client로 넘어가고 있기 때문입니다. 또한 랩탑에서 실행되는 애플리케이션은 인터넷 연결을 잃어도 오프라인에서 작업이 가능하도록 디자인 되어져 있습니다.

RIA의 일반적인 아키텍처는 그림과 같습니다.

XML은 데이터 전송이나 폼 레이아웃을 기술하는 용도로 사용됩니다. 수 많은 인스턴스로 클라이언트가 데이터 소스를 이용하여 연결되고 그 안에 머무르게 되면 서버는 실시간으로 클라이언트를 업데이트 할 수 있습니다.

Rich Clients를 위한 기술들
RIA의 기술은 다음과 같습니다.

Java
오라클의 J디벨로퍼나 이클립스로 자바 코드를 작성할 수 있는데 상상할 수 있는 대부분의 Rich Client 를 생성할 수 있습니다. Java는 몇년전 부터 폼 기반 UI를 지원하는데 폭 넓게 이용되었습니다. 추가적으로 사용자 인터페이스는 Java Foundation Classes(JFC/Swing)내의 콤포넌트에서 찾을 수 있습니다. 또한 개발자들은 이클립스 프로젝트와 다른 써드 파티 툴킷에서 Standard Widget Toolkit(SWT)을 사용하여 개발할 수 있습니다. Java는 또한 XML과 웹 서비스를 지원합니다. 웹 브라우저의 자바 플러그 인이나 자바 런타임 환경에 포함된 새로운 자바 웹 스타트 기술을 사용하여 애플리케이션을 배포할 수도 있습니다. Rich Client를 만드는데 있어 자바를 사용하는데 중요한 결점 한가지는 간단한 폼이나 그래픽을 생성하는데 있어서  적지 않은 라인의 코드를 요구합니다.

XUL
XUL은 모질라 오픈 소스 프로젝트에서 제안한 XML 기반의 UI 언어입니다.
그것은 Zulu(플래쉬 MX 컴포넌트)와 Thinlets(자바도구)와 같은 다른 렌더링 엔진과 마찬가지로 모질라 브라우저내에서 실행되는 폼 애플리케이션을 생성하기 위해 사용됩니다. XUL 랜더링 엔진은 일반적으로 매우 작고(100k) XML 데이터를 산출할 수 있습니다. 자바와 더불어 Theodore Thinlet Editor와 같은 오픈소스 툴의 풍부함으로 인해 꽤 큰 사용자 커뮤니티가 있습니다. 자바 애플리케이션에서 그래픽한 레이아웃 UI와 XUL을 통신하게 할 수 있습니다. XUL의 가장 큰 불리한 점은 주요 기업의 지지가 없다는 점이다. XUL의 큰 이점은 Gecko 엔진과 통합할 수 있고, 실제로 XUL은 다른 XML UI 정의언어 대부분과 비교했을 때 매우 표현적이고 간결한 언어입니다.

마크로미디어 플래쉬와 플렉스
플래쉬는 웹 페이지에서 그래픽을 보여주기 위한 상업적 제품입니다. 그것은 최근에 폼-스타일 애플리케이션을 빌딩하기 위한 특징을 포함했고, 업그레이드 했습니다. 플래쉬는 웹에 광범위하게 배포된 프론트-엔드 기술이고 이론의 여지는 있지만 98%의 데스크 탑에 설치되어 있습니다. 활발한 그래픽을 생성하는 플래쉬의 편리함은 매우 강력하고 또 비쥬얼적 입니다. 이것의 스크립팅 언어는 액션 스크립트, 자바스크립트로 잘 알려진 ECMAScript 1.5입니다. 플래쉬에 XML description language가 추가된 제품이 Flex 입니다. 그래서 UI는 플래쉬 플레이어에 의해 컴파일과 렌더링 될 수 있습니다. 플래쉬와 플렉스의 첫번째 불리한 점은 개발툴의 미비점으로 인해 XML과 웹 서비스를 지원에 한계가 있다는 점입니다. 하지만 플렉스와 플래쉬의 이점은 복잡한 애니메이션을 쉽게 만들 수 있고 써드파티 제품에 애드온 된다는 점입니다.

오라클 폼(Forms)
오라클 폼은 데이터 중심 인터넷 애플리케이션을 빌딩하기 위한 상업적 제품입니다. 오라클 폼에서 폼 모듈 파일들의 출력물인 비쥬얼 디자이너를 사용하여 폼을 생성할 수 있습니다. 모듈 파일들은 FMT 포맷이나 그 밖의 디자인 툴을 위한 XML로 형식화 될 수 있습니다. 추가적으로 표준화된 폼의 모든 위젯은 자바 콤포넌트와 커스텀 자바 빈즈에 통합될 수 있습니다. 스크립팅 언어는 오라클 데이터베이스에서 사용되는 것과 같은 PL/SQL 이다. 오라클 폼의 흥미로운 특징은 폼 모듈 파일을 생성하고, 수정하고 컴파일링 하기 위한 자바 API를 사용할 수 있습니다. 오라클 폼의 중요한 결점은 웹에 배포하기 위한 오라클 애플리케이션 서버 라이센스가 요구된다는 점이며 이점으로는 오라클 플랫폼이나 오라클 데이터베이스에 강력하게 통합된다는 점입니다.

Rich Internet Applications를 생성하기 위한 기술을 이용하는데 있어서 RIA기술을 선택해야 하는데 다음과 같은 요소를 따라야 한다.
1. 오픈소스와 상업적 제품간의 비교
2. 성숙한 기능 이냐 특정 기능이냐
3. 가볍고 저장공간이 작아야 하느냐 UI가 풍부해야 하느냐
4. 미디어 중심이냐 데이터 중심 애플리케이션이냐?

RIA를 생성하기 위한 최상의 준수사항은
1. 백그라운드 스레드를 이용하여 패치 되어야 합니다. 리치 클라이언트를 위한 퍼포먼스의 기대는 높아야 하고, 만약에 웹 서비스로 데이터를 수집하는데 애플리케이션이 중단될 때 그것은 응답이 없는 것처럼 보여야 합니다.
2. 클라이언트와 리모트 데이터가 동기화 되는 것 처럼 보여야 합니다.
4. 흥미롭고 기능적인 UI를 비쥬얼하게 생성하는 능력을 가진 그래픽 아티스트나 최소한 좋은 UI 디자이너가 잇어야 합니다.

Scott Guthrie가 발하는 Silverlight2의 RIA(Rich Internet Application)


출처 : 준서아빠가 생각하는 행복한 UX이야기 (http://www.uxkorea.net/blog_post_226.aspx )

글씨크기

픽셀단위를 지정했을 경우의 장점
• 어떤 브라우저나 장치든 동일한 크기의 폰트를 볼 수 있다.
• MS 브라우저 외의 다른 장치에서는 px로 지정된 글자 크기를 조절할 수 있음.

CSS에서 font-size를 지정하는 4가지 방법
• 상대갑과 절대값을 이용

상대값
• em: 상위 엘리먼트에 지정된 글씨 크기에 상대적
• ex: 지정된 글꼴의 x의 높이에 상대적
• px: 특정 장치의 해상도에 상대적(가장 일반적인 단위)

절대값
• in: 인치
• cm: 센티미터
• mm: 밀리미터
• pt: 포인트
• pc: 피카

상대크기(상위엘리먼트의 현재 크기에 따라 결정됨)
• larger:
• smaller

퍼센트값
• 상위 엘리먼트에 지정된 글씨 크기에 상대적인 크기로 지정됨

절대크기 키워드(브라우저나 장치에서 결정하는 글씨 크기의 집합)
• 각 키워드간의 비율을 1.5배로할 것을 권고(W3C)
• xx-small
• x-small
• small
• medium
• large
• x-large
• xx-large
• 표현 문법이 간단함(장점)
• lagrge > medium(1.5배), small < medium(1.5배)

윈도우용 IE5를 위한 핵
• body {
• font-size: x-small; /* IE5 적용 */
• voice-family: "\"}\"";
• voice-family: inherit;
• font-size: small /* 일반브라우저 적용 */
• }
• html>body {
• font-size: small; /* 오페라 적용 */
• }

단순화된 박스모델 핵(http://www.info.com/ph/~etan/w3pantheon/style/modifiedsbmh.html)
• 에드워드슨 탠이 개발
• body{
• font-size: small;
• }
• * html body{
• font-size: x-small; /* IE 전용 */
• f\ont-size: small; /* 기타브라우저 */
• }

기본 글씨 크기 지정
• <body> 엘리먼트에 기본 글씨 크기를 지정한다.

글씨 크기값을 정확하게 잡아가기
• <div>를 이용하여 키워드값을 조절한다.