gabiadesign | 웹을 뒤바꾼 아이디어100
31536
single,single-post,postid-31536,single-format-standard,ajax_fade,page_not_loaded,,select-theme-ver-3.1,wpb-js-composer js-comp-ver-4.3.5,vc_responsive
designgabia_layout[1]

웹을 뒤바꾼 아이디어100

웹을 뒤바꾼 아이디어100

*본 글은 짐 볼턴의 <웹을 뒤바꾼 아이디어100>을 바탕으로 쓰여진 글입니다.

<웹을 뒤바꾼 아이디어100>은 짧은 시간동안 가장 빠르고 역동적으로 변화한 웹에 영향을 준 아이디어 100가지를 다루고 있는 책입니다. 작가가 5년 간 시리즈로 책을 내면서 마지막으로 웹을 선택한 이유는 4차 산업혁명의 시대에서 지금까지 발전해온 웹의 역사를 돌아보면 앞으로를 준비하는데에 도움이 될 수 있다고 생각했기 때문이라고 합니다. 본 책은 웹 발전에 기여한 과학, 기술, 인문학, 사회과학, 예술 등 다양한 분야를 다루고 있습니다. 제목처럼 기초적이고 쉬운 용어들에 대해 다룰거라는 기대와는 달리 다양한 분야를 다루고 있어서 그런지 읽으면서 다소 이해가 되지 않는 용어들도 많았습니다. 다양한 분야 중 웹디자인에 영향을 주었던 것과 흥미로웠던 부분에 대해 적어보고자 합니다.

GIF

hulagirl

GIF는 1993년 최초의 그래픽이었던 모자이크가 출연하면서 본격적으로 사용되기 시작했습니다. 이후 3년 뒤, 프레임을 연속으로 볼 수 있는 GIF 애니메이션을 지원하기 시작하면서 GIF형식을 활용한 광고나 아티스트가 대거 출연하기 시작했습니다. 시간이 지나고 움직이는 애니메이션을 지원할 수 있는 툴이 다양하게 나오면서 GIF는 잊혀지는 듯 했지만 2004년에 마이스페이스와 텀블러에서 또 한번 붐이 일기 시작하면서 다양한 GIF아티스트들을 배출해냅니다. 요즘도 옛날 방식이라는 말을 듣고 있지만 꾸준히 사용되고 있습니다.

 

이모티콘

이모티콘은 생각지도 못한 곳에서 아이디어가 나와 만들어지게 됩니다. 첫 시작은 1982년 카네기멜론대학교 컴퓨터과학부의 온라인 전자 게시판을 통해 사용되기 시작했습니다. 일하고 있던 교수는 다소 딱딱한 학과 게시판을 개선하기 위해 각자 글에 웃는 모습을 달자는 글을 씁니다. :-) 이 글을 학과내에서 큰 인기를 끌었고 학생들이 입을 벌리고 웃는 모습 😀 혀를 내밀고 있는 모습 😛 등 다양한 이모티콘을 개발해 냅니다. 1980년 대 중반 일본에서는 고개를 돌리지 않고도 쓸 수 있는 이모지가 사용자들 사이에서 유행하기 시작합니다. (^.^) (@_@) 이 유행은 계속해서 이어져 90년 대 초반 노란 얼굴을 한 웃는 얼굴의 이모지가 최초로 그래픽으로 만들어지게 되고, 꾸준히 발전해나가기 시작합니다.

 

웹 분석도구

download

웹의 사용량이 늘면서 사람들은 웹에 대한 데이터를 모으고 싶어졌습니다. 이러한 욕구를 충족시키기 위해 웹사이트 방문객 데이터를 수집하고 보고하는 웹 분석도구가 탄생하게 됩니다. 특히 반송률과 히트맵이 큰 관심을 받게 됩니다. 반송률은 얼마나 많은 사람들이 웹사ㅣ트에 들어갔다 홈페이지도 거치지 않고 나오는지를 보여주는 수치입니다. 반송률이 높으면 높을 수록 영향가 없는 방문객이 많거나 고객이 원하는 콘텐츠를 제대로 제공하지 않고 있다는 것을 보여줍니다. 히트맵은 사이트 내에서 사람들이 어디를 클릭하고 있는지 보여주는 자료로 대체적으로 F패턴을 보여줍니다. 이를 통해 많은 사이트들이 중요한 정보는 좌측 상단에 배치하게 됩니다.

 

사용자 중심 디자인

jakob_nielsen

“우리는 우리가 하고 싶은 방식이 아니라 사람들이 실제로 행동하는 방식을 위해 우리의 기술을 디자인해야 한다.”

웹 초창기에 웹이란 것은 하이퍼링크가 심어진 단순한 텍스트로 디자인은 고려 대상이 되지 못했습니다. 이러한 상황이 계속되자 닐슨은 사용자의 기대치를 디자인 과정의 중심에 두는 사용자 테스트와 종이 모형을 제작해야 된다고 주장하기 시작합니다. 이러한 이야기는 많은 사람들의 공감을 사기 시작했고, 스티븐 크룩의 ‘사용자를 생각하게 하지마!’ 등 사용자 중심 디자인에 대한 책과 이론들이 등장하기 시작합니다.

 

블레어 위치

블레어 윗치

블레어 위치는 독립영화로 1999년 세상을 발칵 뒤집어놓았던 호러영화입니다. 영화는 페이크 다큐멘터리 영화의 시초로 캠코더로 촬영한 듯한 방식을 취하고 있어 리얼리티를 더해줍니다. 독립영화 제작자들은 영화의 웹사이트를 만들고 영화내 인물들의 주변인물들을 인터뷰하는 영상들을 넣어놓으면서 마치 실화인것처럼 만들었습니다. 이러한 방법은 처음 시도되어지는 것이었고 영화를 홍보하는 전혀 새로운 방법을 개척했습니다. 광고를 할 때 ‘Blairwitch.com 조회수 오늘까지 21,222,589회 기록’ 이라는 문구를 사용했고, 영화보다 영화 웹사이트를 홍보하는 최초의 영화 광고가 되었습니다.

 

Creative Commons

63776_980

Creative Commons는 웹의 협동정신을 포용하는 저작권 라이선스를 만들기 위해 크리에이티브 커먼즈 기구가 만들었습니다. 저작권자 이용 허락 없이도 자유롭게 저작물을 이용하는 운동으로 많은 사람들의 반발을 사기도 했습니다. 하지만 사진 공유 사이트 플리커, 위키피디아가 동참하면서 널리 퍼져나가게 되었습니다.

 

모바일 웹

놀랍게도 일찍이 일본에서는 휴대폰으로 웹에 접속하는 사람의 수가 PC를 통해 접속하는 수보다 훨씬 많았습니다. 하지만 세계적으로 모바일 웹이 PC보다 사용량이 늘어난 것은 2007년에 등장한 아이폰의 역할이 큽니다. 애플은 아이폰이 단순히 연락을 주고받는 기기에 그치는게 아니라 사람들에게 휴대용  엔터테인먼트 디바이스가 될 수 있길 바랬습니다. 그래서 최고의 모바일 웹 경험을 제공하기 위해 노력했고 이는 큰 성공을 거두게 됩니다.

 

내장 서체

웹에 관한 디자이너들의 최대 불만은 서체 지원이 빈약하다는 부분입니다. 초기에 이러한 불만들은 해결되지 못하고 계속해서 이어졌습니다. 그러던 도중 2009년이 되서야 웹페이지에 서체 파일을 링크 시키는 @font-face 명령어를 지원하기 시작했습니다. 이로 인해 디자이너가 사용할 수 있는 서체가 늘어났지만 아직까지도 계속해서 사용 범위를 확대해 나갈 수 있는 방법에 대한 고민이 필요합니다.

 

태블릿 기기

처음 태블릿 기기가 나왔을 때 사람들을 그저 붐일 뿐이고, 태블릿 기기에 대한 관심은 곧 사라질거라고 생각했습니다. 하지만 컴퓨터는 대체적으로 업무용으로, 태블릿은 오락용으로 사용됩니다. 그래서 PC를 대체하거나 동일한 목적을 가진다기 보다는 PC를 보완하는 역할을 가지고 있습니다. 터치 스크린으로 이루어진 태블릿 기기의 등장으로 촉발된 예상치 못했던 행동 중 하나는 사용자들의 멀티 스크린을 사용하기 시작했다는 것입니다. 이를 앞으로 어떻게 발전시켜 이용하게 될지는 앞으로의 과제로 남아있습니다.

 

AUTHOR.

공룡 / Gabia UI Designer

No Comments

Post a Comment

*