★ finding
Q1. 비디오 서치의 문제
보다 표준적인 비디오 분석을 통한, 비디오 서치의 일반화/표준화가 필요하지 않을까 사료된다. 여기서 의미하는 비디오 서치는 비디오 내용 자체도 서치 할 수 있는 서치 엔진의 개발 필요성을 제기한다.
Q2. 동영상 서비스의 문제
판도라는 대한민국 대표 동영상 서비스 업체이다. 들려오는 후문에 의하면, 내부적으로는 재정난을 겪고 있다고 한다. 동영사 자체의 서버 유지비가 만만치 않기 때문이다. 이처럼, 동영상 서비스의 미래 가능성에 대해서는 많은 사람들이 필요하다고, 긍정적이라고 판단하고 있으나, 실상 높은 유지비용을 감당할 수 있는 수익모델이 부재하다. 동영상 서비스만을 위한 수익모델의 예를 함께 살펴보거나, 아이디어를 듣고 싶다.
Q3. 사운드스케이프soundscape 개념의 도입
멀티미디어에게 사운드는 쉽게 '누락'되고는 한다. 예를 들어, 웹사이트 별로 배경음악이 다르기에 '짜증' 날 때가 있다. '클릭' 소리는 듣고 싶지 않지만, '음악' 듣고 싶다. 와 같은 sound에 대한 여러 요구가 있을 수 있다. 아니 있다. 기존 HCI는 그래픽적 요소만 강조하는 visual과 audio 사이의 조화에 대한 고민도 필요하다고 여여긴다. 때문에, 웹 경험에서 사운드와 관련한 불편한 점들은 무엇일까? 그리고 그것을 해결할 수 있는 방법은 무엇이 있을까?
내 생각에는 소위 "사운드스케이프soundscape" 개념을 웹사이트로 끌어들여 올 수 있지 않을까 한다.
A soundscape is a sound or combination of sounds that forms or arises from an immersive environment. The study of soundscape is the subject of acoustic ecology. The idea of soundscape refers to both the natural acoustic environment, consisting of natural sounds, including animal vocalizations and, for instance, the sounds of weatherand other natural elements; and environmental sounds created by humans, through musical composition, sound design, and other ordinary human activities including conversation, work, and sounds of mechanical origin resulting from use of industrial technology. The disruption of these acoustic environments results in noise pollution.
The term "soundscape" can also refer to an audio recording or performance of sounds that create the sensation of experiencing a particular acoustic environment, or compositions created using the "found sounds" of an acoustic environment, either exclusively or in conjunction with musical performances.[1][2]
사운드스케이프는 몰입적 환경에서 떠오르거나 형성되는 사운드들의 집합체 혹은 사운드 그 자체를 일컫는다. 사운드스케이프 연구는 어쿠스틱 생태학의 주제였다. 쉽게 말하면 말 그대로 '사운드 풍경'을 의미한다. 동물들의 재잘거림과 사람들의 속삭임에서 부터, 자동차의 울림, 컴퓨터 마우스의 클릭소리에 이르기 까지가 그것이다.
이를 웹 환경으로 가져오면, 헤드폰을 귀에 꽂은 채로 웹에서 경험하는 모든 소리가 하나의 '사운드스케이프'가 될 수 있겠다.
그러면, 이를 활용한다면, 예를 들어, 웹사이트 제각각의 소리 등장에 따라 다른 소프트웨어에서의 배경음악이 저절로 페이드 아웃한다든지, 혹은 마우스의 클릭에 따라 배경음악 소리에 변화가 주어진다든지의 재밌는 발상도 할 수 있지 않을까?
Q4. 모바일에서 웹 구현 사이즈의 갈등
디바이스의 다양화는 곧, 스크린 크기 사이즈의 다양화이다. 특히, 이동성이 대두되면서, 모바일 상황에서의 Web이용에 대한 요구가 증대되고 있는 형편이다. 이는 스마트폰의 대중적 보급화로 더욱 빠르게 성장할 형세다. 그러면, 여기에서 질문이 발생한다. 과연,
(1) 모바일 사이즈에 특화된 웹 인터페이스를 제공해야 하는가? 다시 말해, 작은 화면에 맞도록 기존 컴퓨터 모니터에서의 웹디자인과는 다른 디자인이 필요한가?
(2) 아니면, 기존의 모니터 웹 인터페이스를 '있는 그대로' 모바일 인터페이스로 옮겨 제공해야 하는가? 다시 말해, LGT의 OZ서비스처럼, 확대와 축소, 화면이동을 통해, 이를 구현해야 하는가?
정답은 없을테다. 무엇이 보다 massive한 target을 확보할 수 있느냐의 관점이 중요하리라 본다.
Q5. E-commerce의 HCI
모든 쇼핑몰의 HCI는 일률적이다. (1) eyeshoping을 유도하는 시각적 상품 나열 (더구나 대게가 슬라이드 쇼 형식이다.) (2) 적당한 상품을 고르는 사용자 (이 과정에서는 얼마나 많은 상품 정보를 줄 수 있는지, 상품 선택과정에서 얼마나 오류를 줄일 수 있는지가 중요하다.) (3) 상품선택 (4) 결제. 실제 쇼핑 구입과정과 비슷하다. 온라인 쇼핑몰에서 디자인적으로 불편한 점은 없었는가?
Q6. 검색 결과 보여주기
google의 아성은 과연 무너지지 않을 것인가? 최근 마이크로소프트에서는 bing을 런칭하였다. 아직 완벽한 시스템을 갖추지는 못한 듯 보이나, 몇몇 전문가들은 bing의 이미지 검색을 높게 평가한다. 영국에서는 소위 인공지능검색서치라는 개념의 Wolfram Alph가 등장했다. 이 싸움 혹은 대전쟁의 승자는 결국 '얼마나 좋은 검색결과를 잘 보여주느냐'에 달려 있겠다. 그러면, 과연 좋은 검색결과란 무엇일까? 좋은 페이지로의 링크일까? 그러면 좋은 페이지란 무엇일까?
내가 생각하기에는, "보철지식" 또는 "인간과 컴퓨터으 공진화"라는 관점에서 출발하여, '내가 모르고 있는 정보' '내가 알고싶은 정보'를 보여 줄 수 있는 검색결과가 '좋은 페이지'의 선결 조건이라고 파악한다. 이를 위한 전제는, 컴퓨터가 혹은 검색서버가 '나의 정보를 알고 있어야 하고, 우리의 정보를 알고 있어야 한다.' 따라서, '나를 보여줄 수 있는 시스템 구현이 먼저일 수 있지 않을까' 라고 개인적을 생각한다. 여러분들의 생각은?
Q7. 로딩시간의 문제
로딩시간 참 길다. 그럴 때면 짜증이 솟구친다. 욱!욱!욱! 인터넷의 속도는 점점 빨라지고 있으나, 소위 세계 최고의 초고속통신망을 자랑하고 있으나, 로딩시간은 엄연히 존재한다. 잠시동안의 로딩시간 동안 사람들은 과연 무엇을 할까? 마냥 기다리는 사람도 있을 테고, 다른 사이트를 보는 사람도 있을 테고, 물론 화장실을 다녀오는 사람도 있을 테다. 로딩시간 동안의 인간행동 패턴을 알고 싶다. 여러분은 뭐 하세요?? 그리고 이를 고려한 HCI 또한 중요하다고 여긴다.
Q8. universal design
최근 디자인업계에서는 소위 '스칸디나비아 디자인'이라 불리는 '유니버셜 디자인'이 화두였다. 간단한 예로, 지하철 개찰구를 디자인 할 때, 휠체어를 탄 장애인용과 일반인용을 따로 나누어 디자인 할 것이 아니라, 장애인이든
일반인이든 "누구든지 지나다닐 수 있는 개찰구"를 만드는 경우가 비근한 예이다. 이는 장애인이 심적으로 느낄 수 있는 '보이지 않는 차별'을 없앨 수 있는 방법 중 하나이기도 하다.
이는 웹에서도 적용가능하다. 장애인이 아니더라도 말이다. 웹에서는 플래시, 자바, HTML 등 사용환경에 따른 도구 선택이 중요하다. 허나, 플래시와 같은 고급 소프트웨어는 고용량을 요구한다. 이는 고사양의 컴퓨터에서만 운영될 수 있다. (글로벌적 시각에서 보면, 한국의 컴퓨터는 모두 고사양이라고 할 수 있겠다. 개도국을 위해 100만원 미만의 컴퓨터 생산이 계획되고 있다는 사실을 상기하자) 반면, 플래시는 다양한 정보를 익사이팅하고 어트랙티브하게 전달한다.
반대로, HTML과 같은 기본적 소프트웨어는 텍스트 중심의 정보를 단순하게만 전달하지만, 어떠한 환경에서도 구현 가능하다. 아무리 '할아버지 컴퓨터'라 해도 말이다.
그러면, 여기서 질문을 던질 수 있다. 웹사이트 디자인을 할 때, 어떠한 방향으로 나아가야 하는가? 적정한 수준은 무엇인가?
예를 들어, 미국 주요 공공기관 사이트를 가보면, 대게가 800X600 사이즈에 최적화되어 있고는 한다. active-X를 설치할 필요도 없다. 간혹, java 마저도 필요가 없다. 반면, 한국 사이트는 최적화된 경험을 선사하기 위해, 1600X1200 사이즈에 최적화되거나, 심지어 작은 쇼핑몰 마저 active-x와 java 등의 설치를 반드시 요구한다.
보다 massive한 방향은 무엇일까? 웹 디자인도 앞에서 제시한 유니버셜 디자인을 따라야 하는가? 궁금하다.
★ summary
21.1. introduction
데스크탑 컴퓨팅 파워의 증가에 따라 멀티미디어 산업이 성장했다.
21.2. Understanding hypertext
21.2.1. hypertext definition - text, hypertext and multimedia
+ 배경
- 문명화의 척도로서 text를 중요시했다.
- text는 정보사회기틀을 위한 디딤돌이다.
+ 전통적/포스트모던적 text 모두 : 선형적 성질에 기반
+ 전통적 text 선형성의 몇몇 단점 有
- 선이 아닌 그물 구조를 통한 text의 한계 극복
21.2.2. Rich content - 용어를 혼용하여 사용 : hypertext, multimedia, hypermedia system
+ hypertext 구성요소
- 수많은 페이지
- 일련의 페이지를 연결하는 링크links
+ static material : text, static diagram, photographs
+ dynamic material : animation, video/audio clip, computer application
애니메이션
+ 정의 : 시간에 따라 변화하고 대체되는 이미지의 모션에 덧붙여지는 개념
비디오 & 오디오
+ 비디오
- 특징 : 값비싸고 제작에의 소비가 많음에도, 가정 PC에 비디오/오디오 편집시스템을 기본으로 장착
- 문제 : 메모리 수요가 매우 큼
- 종류 : sounde effects, background music, voice0over
- 사용처 : 문서 내의 'clip'으로 사용, digital recording을 통한 sound sample로 사용
+ HCI에서는? : 컴퓨터 인터페이스 디자이너는 필름제작의 테크닉과 만화가의 테크닉을 배우면서, 새로운 것들을 알아가야 한다.
컴퓨테이션, 인텔리전스 & 인터랙션
+ 사용처 : 보다 인터랙티브한 hypermedia는 게임 혹은 어플리케이션에 주로 삽입
+ text와 hypermedia의 차이
- text : 사용자의 제어 아래 수동적인 콘텐츠
- hypermedia : 보다 지능적인 콘텐츠 혹은 에이전트(agent), 그래서 사용자의 경험을 만듬
21.2.3. Delivery technology
on the computer
+ 정의 : 컴퓨터에 영원하게 다운로드 되거나 인스톨 되는 몊몊 하이퍼텍스트 有
+ 특징
- 즉각적인 접근에 용이
- 표준 view가 필요없음
- 고유의 브라우징 소프트웨어 有
On the web
+ 특징
- 정보표상을 위한 rich environment 제공
- 인터랙티비티 : 전통적 페이퍼 기반 디자인으로부터 멀어지는 HCI적 디자인 고안 필요성 이유
+ 좋은 웹페이지란?
- 독자에게 포커스를 맞춤
- 효과적인 인터랙션 툴 혹은 프리젠테이션 툴로서 작동
On the move
+ 모바일 폰, PDAs, 노트북컴퓨터 요구의 증대 => hypermedia의 on the move 자극
+ 노트북 : 컴퓨터의 모바일이란, 위치에 기반하여 다른 콘텐츠가 보여지는 'context-aware hypermedia'가 주요 키로 사용된다는 것을 의미
+ PDA : 보다 작은 PDA 스크린 사이즈에 맞도록, 페이지 조정이 필요
+ 모바일 폰 : 메모리와 스크린 크기에 대한 구속이 큼
21.2.4. application areas
Rapid prototype
+ 메킨토시사의 하이퍼 카드 : 인터랙티브 시스템 생성을 위한 'rapid prototyping tool'로서 사용
+ 매크로미디어의 플래시, 디렉터 : 역동적 인터페이스 mock-up 생산
help and documentation
+ 온라인 매뉴얼과 help system에 적합
- 사용자 발생 정보 접근 가능
- 보다 자세한 정보 제공
+ 교육적 시스템에 적용
- 피교육자 고유의 시간/페이스(pace)에 따른 explore가능
- rich media는 교육 경험을 자극
Education and e-learning
+ 학생 제어 학습 프로세스 : 다른 영역간 링크를 통해 조사/연구 가능
+ e-learning(electronic learning) : 웹을 통한 학습
- 원거리 학습에 도움
- 웹이용 증강 교실에 응용
21.3. finding things
21.3.1. lost in hyperspace
+ 비선형성의 문제점 : 혼란 = 트랙에서 갈 길 읽기, 이를 lost in hyperspace라 일컬음
+ lostness를 느끼는 2가지 요소
- 사전 지식을 염두하지 않는 독립적 콘텐츠 배열은
파편화된 정보, 낮은 통합성, 열관된 주제에 대한 혼란 야기
- 주요 골격 구조를 가로지르는 hyperlink 움직임은
내가 어디 있는지, 내가 어디에 있었는지에 대한 혼란 야기
+ 해결방안은?
- 전자에 대한 해결방안은,
정보를 보다 잘 디자인 하는 것
- 후자에 대한 해결방안은,
사용자가 내비게이션을 보다 잘 이해할 수 있도록 디자인 하는 것
21.3.2. designing structure
+ information forging theory
- 유용한 정보가 어디 있는지 찾을 것을 결정
- 보다 많은 정보를 찾을 것인지를 결정
- 더 많은 정보가 필요하다면 그것을 찾으러 어디로 갈 것인지 결정
= 정보의 향기
: 좋은 결정을 위한 브라우징을 사용자가 할 수 있도록, 아마도 사용자가 찾는 것에 대한 힌트를 제공
= HCI에의 적용은?
: 자세한 페이지 디자인, 접근방법, 구조를 구축
21.3.3. making navigation easier
+ 해결방안
- hypertext 문서의 맵을 제공 & 문서 내에서 독자의 현재위치 식별자를 제공
(예) 사이트맵
- 사용자에게 'recommended routes' 추천 경로를 제공
- 너무 강하게 정의되면, 오히려 시스템의 객관성 파괴 - 재미지점으로부터, 사용자가 추천 경로를 벗어나면, 'bus stop'을 제공
- 문서로의 '접근 단계level of access' 형식
: 다른 접든 단계는 다른 정보의 양을 '보여준다see'.
21.3.4. history, bookmarks and external links
+ history 매커니즘 존재 : 사용자가 어디를 갔었는지에 대한 정보 제공
- back button : hub and spoke는 많은 링크를 가진 중심페이지로부터 앞뒤로의 브라우징을 도움
- bookmark
+ HCI에의 적용?
- 모든 페이지는 그것들이 어디에 속해있는지 명확히 함
- 전체 사이트 full site 구조로의 링크를 항상 가짐
21.3.4. indices, directories and search
+ 인덱스 : 지배적 의미를 가지는 주요 키 구/단어
- 책에서의 인덱스 : 인덱스에서 단어를 찾은 후 물리적으로 페이지를 살핌
- 전자적 인덱스 : 클릭으로 콘텐츠에 접근 가능한 링크의 생생함live
+ 인덱스와 디렉토리
- 인덱스 : 키워드의 알파벳 리스트
- 디렉토리 : 사이트에 대한 위계적 카테고리화
+ 검색 : 포괄적 검색을 위해 키워드에 의한 자동검색 필요
+ 문제의식 : 웹은 거대한 정보의 바다 (따라서, 내가 원하는 정보를 찾기가 쉽지 않다)
+ 랭크 페이지
+ 구글의 검색엔진
- 링크의 구조 이용
- 휴리스틱법 이용
=> (구글에서 제시하는) 좋은 페이지란?
- 많은 장소place로부터 링크된 페이지 - 이미 알려진 페이지로 링크된 페이지
- 많은 좋은 페이지로 링크된 페이지
+ 추천 시스템 : 미래 방문자를 위한 보다 많은 인기페이지 링크
+ META 태그 이용 : 특별한particular 키워드와 디스크립션discription을 웹페이지 하드섹션에 개재
21.4. Web technology and issues
21.4.1. Basics
21.4.2. web server & web client
+ (최근) 글로벌 컴퓨터 네트워크의 생성
- 페이지의 웹서버 저장 가능
- client? : 브라저를 실행시키는 PC
21.4.3. network issues
+ bandwidth : 얼마나 많은 정보를 주고 받는지를 지칭하는 용어
+ latency : PC에서 웹서버로 보내는 네트워크 메시지의 소통에 걸리는 시간
+ Jitter : latency의 변이성
21.5. static web content
21.5.1. the message & the medium
+ 문제점 : 좋은 메시지를 못난 미디어에 싣기도 하고, 좋지 않는 메시지를 좋은 미디어에 싣기도 함
+ 전제
- 페이지는 즉각적으로 흥미로워야 하고 매력적이야 함 (결과=지향점)
=> 미디엄의 사용자 중심적 성질은 이를 불가피한 것으로 만듬 (원인)
- 기본적으로 메시지 자체가 읽는 가치를 함유해야 함
21.5.2. text
21.5.3. graphics
obtaining graphics
using graphics
+ 문제점
- 그래픽 이미지의 로딩 시간은 텍스보다 길기에, 문제 발생
- 복잡한 배경의 문제 : 읽기에 불편하고, 동시에 정보의 부가가치를 제거
+ 다양한 브라우저는 다양한 유형의 기능 有
- caching : 기존에 봤던 이미지를 로컬 스토어local store에 저장하여, 다시 볼 때 속도 증진
- 자동이미지로딩(automatic image loading) 기능 有 : 이미지 없이 텍스트만 로딩
+ 그래픽의 2가지 종류
- JPEG
- 포토그래픽이미지에 적합
- 높은 압축률 & 빠른 로딩 속도
- lossy 발생 : 원본이미지와 다른 이미지 생성
- GIF
- lossless 발생 -> 그래서 압축률 저조 - 애니메이션 GIF 생성 가능
icons
+ 기능
- 몇몇 작은 그림을 보조하는 visual cue
- 주요 페이지의 기능 양상(aspect)을 표현하는 표준적 WIMP 인터페이스
* WIMP : In human–computer interaction, WIMP stands for "window, icon, menu, pointing device", denoting a style of interaction using these elements.
Graphic and color
+ 문제 : 하드웨어 사용의 제한으로 인해 발생하는 universal access
+ 문제점 : 적절한 appropriate 사운드/비디오 얻기의 어려움 발생
+ 전제 : 사운드/비디오의 사용은 페이지 디자인을 typesetter에서 사운드 엔지니어, 시네마토그래퍼로 이동시킴
+ 주요 이슈 : 높은 퀄리티로의 변환 수행과 낮은 latency 사이의 갈등은 멀티미디어 테크놀로지의 주요 이슈
21.6. dynamic web content
21.6.1. the active web
+ Neilsen의 Why Frame Suck (most of time)
: 단순한 사용자 모델 파괴
-> 문제 발생 : 웹을 위한 새로운 richer 모델 요청
오래된 모델의 단순성을 보존하는 동시에, 새로운 성질의 발전을 유지하는 방법 강구필요
+ Janet & Alan
: 인터페이스에서 수동적/능동적 패러다임 시이의 이동..이라는 문제를 언급
-> 해결 : 2개 패러다임의 차이점을 수용 & 인터랙션의 효과적 미디엄 디자인을 제시
21.6.2. What happens where
the user view
최종사용자end-user가 무엇을 보는가?
what change
: 무엇이 변화하는가? 미디엄의 기본적 속성이기 때문에, 미디어 스트림은 변화
by whom?
: 변화에 영향을 미치는 요인
- 컴퓨터에 의한 자동적 변화
- 사이트 관리자와 사용자에 의한 변화
- feedthrough : 사용자는 서로의 변화 목도
how often
: pace와 관련
technology and security
+ 컴퓨테이션 변화의 장소
- 클라이언트 : 사용자의 웹 브라우징
- 서버
- 다른 기기 : 페이지 관리자의 데스크탑 PC 혹은 중앙 데이터베이스 서버
- 사람 : (집단지성?)
+ 문제점 : 보안의 이슈 발생
21.6.3. Fixed content - local interaction and changing views
+ server-end 소프트웨어/플랫폼
: 사용자의 기기에 다운로드되어, 해당 PC에서 모든 인터랙션 발생 (java script, flash, active X plug-in)
21.6.4. search
+ 서치엔진 : java 애플릿이 온라인으로 서치
- 과정 : 서버에 형식 제출 -> CGI program이 서치 수행 -> 결과를 보여줌
- 사용이유 : java/scripting 미지원 컴퓨터 존재 / 보안의 문제
21.6.5. automatic generation
+ 미래 주요 문제 : maintenance
+ database 생성 웹사이트 : 자동화된 웹을 위한 프로젝트 존재 (oracle web server, domino)
- 장점
- 기 존재 데이터 소스 시용
- 데이터의 다양한 view의 지속성 유지
- 목차, 인덱스, 링크의 쉬운 생성
- 콘텐츠와 레이아웃의 분리
- 단점
- HTML 성질의 제한
- 데이터베이스가 완전하게 보안적이지 않음
21.6.6. batch generation
+ 특징 : 가장 보완적인 방법
- 페이지를 오프라인에서 생성
- 데이터베이스를 웹 서버에 저장
21.6.7. dynamic content
: 웹 유저에 의한 업데이트가 가능한 페이지 콘텐츠
