Dotty Studio

기업가정신 & 스타트업, 그리고 기술과 디자인에 대한 곳.

오늘은 조금 개념적인 것을 살펴볼까요.

디자인에서 가장 중요한 원칙 중 하나가 일관성(consistency)입니다. (뭐, 제 멋대로 생각이긴 합니다만)

너무. 너무. 너무. 너무 중요합니다. 그래서 한 번 더 말하겠습니다.

디자인에서 가장 중요한 원칙 중 하나가 일관성(consistency)입니다.

자, 그럼 바로 실사례로 ㄲㅆ.

전 세계의 스타벅스(Starbucks) 커피 매장은 (인사동이나, 일부 오래된 매장을 제외하고는) 동일한 인테리어와 외관을 유지하고 있습니다. 물론 주문 절차나 주 메뉴도 동일합니다. 바로 아래 사진는 외국 매장의 사진인데, 흡사 강남역 7번출구 스타벅스 매장이 인테리어를 바꾸기 전의 모습과 판박이라는 느낌마저 듭니다.

네, 강남역 매장이 아닙니다.


사용자 삽입 이미지

사용자 삽입 이미지

이는 물론 "스타벅스 경험"이라는 것을 만들어내기 위하여 철저하게 의도적으로 기획된 것입니다. 내부의 테이블과 의자에서부터, 조명과 천장에 부착된 나무빛 패널, 벽을 둘러 싸고있는 마감에 이르기까지 일관성있게 되어있습니다.

이러한 일관성을 1) 내적 일관성이라고 하는데, 특정한 시스템 내에서 나타나는 일관성을 의미합니다. 이렇게 하면 사람들에게 신뢰감과 함께, 내용물이 주먹구구식으로 이루어진 것이 아니라 열라 스마트한 설계를 통하여 구성되었다는 것을 인지시킬 수 있습니다. 뭔가 "저기는 디자인을 아는 기업"이라는 느낌을 줄 수 있죠.

이렇기 때문에 우리는 낯선 곳에 가더라도, 그 동네의 스타벅스에 들어가면 낯도 안 설고, 당황하지 않을 수 있습니다. 새로운 장소에 있는 친숙한 스타벅스라는 신선함만이 느껴지죠. 자신감을 가지고 카라멜 프라푸치노 주문을 넣어도 된다는 겁니다.

일관성의 원칙에 의하면, 하나의 시스템, 혹은 여러 시스템에 걸쳐 유사한 부분을 실제로 유사하게 만들경우 사람들이 그에 대한 친밀감, 학습능력 및 사용성이 올라가게 됩니다. 이렇게 되면 경계적 대상(liminal object; 인터페이스에 해당)을 자연스럽게 인지하지 않을 수 있게 되어, 원래 목표로 하는 바에 편하게 집중할 수 있게 됩니다.

하지만 앞서 살펴 본 내적 일관성은 지키기가 여헐~라 어렵습니다. 실제로 제품이나 서비스가 진화할 때나, 앞의 경우에, 오프라인 매장이 확장함에 따라 생기는 다양한 상황에 대하여 미리미리 충분히 고려해두지 않으면 이미 앞에서 만들어온 '레거시(legacy)'에 의하여 발전을 더이상 하지 못하고 발목이 잡히는 문제가 생길 수 있습니다. 그래서 소프트웨어 개발의 아키텍트에 해당할만한 뛰어난 안목을 가진 디자이너나 건축가가 있어야 하겠죠.

이와 약간 다른 것이 2) 외적 일관성인데, 이는 여러 체계에 걸쳐서 나타나는 일관성입니다. 간단히 말해, 어디에나 있는 비상구 출구 표시가 이에 해당합니다. 대부분의 공공 목적을 위한 기호/싸인/경고문/표지판 등이 이를 따르고 있습니다.
사용자 삽입 이미지

하지만 그러다보니 자연스럽게 오는 또 하나의 부작용: 디자인이 촌티나면 매우 난감합니다. 그리고 주변의 환경과 어울리지 않는 경우에도 매우 곤란하죠. 하지만 그렇다고 사용자들이 당연히 일관성있기를 기대하는 것을 자기 멋대로 바꾸어버리면, 사용성과 학습능력이 급격히 저하되어, 아니한 만 못하게 되는 상황이 발생하기도 합니다. 또 그렇다고 해서 어차피 다 지키지도 않기 때문에, 외적 일관성은 법률적 제재를 받지 않는 이상 실행하기가 매우 어렵습니다. (어쩌라고)

크게 내적 일관성과 외적 일관성을 보았는데, 조금 더 일상적인 일관성이 두 가지 있습니다.

3) 미적 일관성은 우리가 말하는 스타일이나 외형, 색상, 폰트, 그래픽 등을 의미하는데, 사실 주로 일관성이 있어야 한다고 하면 이것을 가리키는 경우가 많습니다. 스타벅스의 내적 일관성은 상당 부분이 이러한 미적 일관성에 의존을 하고 있습니다. 대부분이 기업이 여기 저기에 기업 CI/BI에 사용되는 색상을 사용하고, 구석구석에 로고를 밖는 것도 이래서겠죠.

좀 구석이 아닌 곳에 넣기도 합니다


미적 일관성의 대가가 바로 우리가 사랑해 마지 않는 애플입니다.

Apple Evolution


애플은 오랜 기간에 걸쳐 크게 애플만의 디자인 언어(design language)라고 부를 만한 변화가 몇 차례 있었는데, 첫 Mac에서 등장한 beige 색상 시리즈부터, (중간에 잡스가 떠난 기간의 산만함을 제외하면) 그 후로 조나단 아이브(Jonathan Ive)의 승진부터 등장한 반투명 시리즈(iMac, iBook 초기 시리즈 등에서 파워코드 까지 반투명이였죠)와 고급 플라스틱 스타일, 그 후의 티타늄/메탈 풍, 그리고 나서 twin-shot 기법으로 얼마전까지 밀고 있던 플라스틱과 메탈의 결합, 최근 밀고 있는 유리+알루미늄 결합 등.. 각 시기에 맞추어 전 제품 라인업에 걸쳐서 미적 일관성을 강하게 통일하고 있습니다.

특히 하드웨어 뿐만 아니라, 소프트웨어의 인터페이스에 있어서도 이러한 스타일의 느낌을 살려서 일관성을 고집하고 있습니다. 무시무시무시무시무시무시한 집착이자 편집증입니다. (애플의 휴먼 인터페이스 가이드라인을 보셨나요?) 이렇게 미적 일관성을 강하게 지켜오는 기업들은 대부분 장기간에 걸쳐 브랜드 가치가 지속적으로 올라가고, 소비자들의 빠돌라이제이션존경을 받기도 합니다.

매 공식 발표때마다 검정 목티와 리바이스 청바지를 입고 등장하는 스티브잡스


그에 반하여 슬프게도 철저하게 하청 생태계로 중무장한 국내 대기업들에서는 이러한 미적 일관성을 지키기가 매우 매우 매우 매우 매우 매우 매우 어렵습니다. 하드웨어는 요즘 약간씩 지키려고 분발하고 있는 듯 하지만, 소프트웨어는 불가능 아직 많이 걸릴 것 같습니다. 아쉬운 부분이죠.

마지막 일관성은 4) 기능적 일관성입니다. 이는 사람들의 행동의 일관성이나 기존에 학습하고 있던 지식을 이용하여 일관성을 만들어내는 것입니다. 사람들은 이제 꽤 컴퓨터에 익숙해져서 윈도우 우측 상단 (맥유저라면 좌측 상단)에 위치한, X 표시가 있는 빨강 버튼을 누르면 창이 닫힌다는 것을 알고 있습니다.

사용자 삽입 이미지

따라서 대부분의 새로운 프로그램들도 이러한 관행을 지키고 있습니다. 간혹가다 이러한 관행을 지키지 않고 스킨이 화려한 것들은 왠지 쓰기에 불편하게 느껴지는 것도 이러한 일관성으로부터 벗어났기 때문입니다.

사용자 삽입 이미지

제발 이런거 만들지 마세요. 불편합니다. (10년 정도 저 스킨을 이용하는 killer app을 수 없이 찍어낸다면 모를까)

이러한 기능의 일관성은 사람의 사전 학습이나 극도로 직관적인 단서를 요하기 때문에, 단기간에 퍼뜨리기가 어렵습니다. 폭넓게 다양한 곳에서, 혹은 매우 긴 시간 동안 반복적으로 노출되어야 사람들이 학습할 수 있기 때문입니다.

흔히 우리가 동영상을 볼 때 누르는 재생, 정지 버튼도 플레이어 뿐만 아니라 비디오, DVD 기계에 걸쳐서 일관성있게 사용되죠. 이미 그 특정 아이콘이 갖는 의미를 우리가 알고 있기 때문입니다. 반면, 이러한 학습의 과정을 거치지 못했던 일부 고령자분들은 이러한 기기를 쉽게 조작하지 못하는 경우를 보면, 기능적 일관성의 전제는 학습에 많은 부분을 의존하고 있다는 것을 알 수 있습니다.

옆에서 이를 거꾸로 악용하는 사례들도 있죠. 국내의 똘똘한(?) 기업들은 배너에 이러한 일관성을 이용한 버튼을 집어 넣어, 배너 클릭을 유도하기도 합니다. (아래는 조작된 이미지)
 
사용자 삽입 이미지

결국 일관성을 지키면, 시각적 신뢰감과 친숙함 외에도, 유저 인터페이스 상의 중요한 과제이자 목표인 Affordance(행위 유발)을 높일 수 있습니다. 이를 간단히 이야기하자면,  '왠지 이렇게 해야 할 것 같다'나 '이렇게 하면 될 것 같다'라는 느낌이자 인식이라고 할 수 있습니다.

자, 오늘의 교훈은 간단합니다.

Key: 디자인 일관성을 지키자.

심미적, 기능성, 내적 일관성을 (오랫동안, 그리고 폭 넓게) 잘 지키면 섹시한 기업이라는 소리를 들을 수 있습니다. (물론, 좀 잘 만든것을 가지고 일관성을 지켜야겠죠)
댓글을 달아주세요

분류 전체보기 (822)
Entrepreneur (140)
Technology (265)
Design (93)
Science (22)
Thoughts (63)
소소한 하루 (184)
About (6)
me2day (40)
Paprika Lab (9)