Design for hackers

 

---

Design for Hackers: Reverse Engineering Beauty

저자

Kadavy, David 지음

출판사

John Wiley & Sons Inc | 2011-09-25 출간

카테고리

과학/기술

책소개

Discover the techniques behind beau...

---

- 에릭 스티븐 레이먼드는 해커가 되는 방법이라는 글에서 해커가 지녀야 하는 마음가짐을 다섯가지로 제시
(1) 세상은 해결되기를 기다리는 매력적인 문제들로 가득차 있다
(2) 같은 문제를 반복해서 풀어야 하는 일이 있어서는 안된다
(3) 지루하고 따분한 일은 악하다
(4) 자유는 선하다
(5) 마음가짐만으로는 부족하다. 능력도 있어야 한다
- 좋은 디자인들의 공통적인 주요 원칙중 하나는 재료에 대한 디자이너의 전문적 지식이 디자인에 드러난다는 것. 재료가 대리석이든 철과 유리든, 픽셀이든, 그 무엇이든지 간에 디자이너는 그 재료의 장단점을 모두 잘 알고 다루어야 함. 이렇게 재료의 특성을 잘 활용하지 못할 경우 좋은 디자인이 나올 가능성이 없음. 애플 디자이너의 수장인 조너선 아이브는 이 사실을 잘 알고 있음. "최고의 디자인은 형태와 소재가 서로 떨어질 수 없다는 사실을 보여준다. 소재는 형태를 결정한다."
- 미켈란젤로의 다비드상이 눈부시도록 아름답게 조각될 수 있었던 이유는 대리석의 단단함이라는 제약 때문이었음. 더욱이 미켈란젤로는 미숙한 조각가가 남기고 간 이상한 모양의 대리석 덩어리에서 다비드의 형상을 뽑아내야 했음. 하지만 그 덕분에 앞으로 기울어진 조각상의 모습은 인상적인 존재감을 만드는 데 일조했음.
- 디자이너의 임무는 받아야 하는 사람에게 메시지가 잘 전달되도록 하는 것, 그 중에서도 특히 그 메시지를 능동적으로 찾고자 하는 사람들에게 메시지가 잘 전해지도록 하는 일임. 현대 디자이너들이 간혹 이 중요한 원칙을 잊곤 함. 디자이너와 그의 고객들은 웹사이트의 심미적 측면과 경험적 가치에 집중하느라 가끔 바탕에 깔린 정보의 구조를 무시함. 특히 플래시를 경솔하게 사용하여, 검색엔진 또는 브라우저의 찾기 기능이 정보에 접근할 수 없도록 차단해 버리면 그 웹사이트의 커뮤니케이션 범위는 줄어듬
- 색연상은 먹을 수 있는 음식을 찾는 데 유용했을지 모름. 먹을 수 있는 열매 중 많은 것들이 빨간색이고, 초록색 잎은 우리를 푸릇한 땅으로 인도했을 것임. 물에 비치는 파란색 하늘은 우리에게 안도감을 줌. 물이 있는 곳에 먹을 것이 있기 때문. 태양과 불은 여전히 노란색과 주황색으로 연상되며, 그 덕분에 어떤 상황에서는 불이 긍정적 의미를 지니게 되었을 것임. 그러나 같은 색이라도 다른 상황에서는 위험을 연상시킬 수 있음. 빨간 색은 피의 색인데, 사냥과 전투의 상황에서 각각 대립하는 의미가 있음. 먹거리는 파란색인 경우가 드문 반면, 곰팡이가 종종 파란색이기 때문에 파란색은 상한 음식을 연상시킬 수 있음. 뱀이나 개구리에서 보이는 노란색과 주황색은 분명 경고의 효과가 있음. 어두운 색은 위협적 의미로 보일 수 있음. 우리 조상이 밤에 돌아다니는 약탈자를 조심해야 한다는 것과 폭풍우가 몰아치면 은신처를 찾아 뛰어야 한다는 것을 배웠기 때문.
- 빨간색이 당신에게 주는 의미
* 사용자의 행동을 유도하려는 상황에 빨간색을 사용한다. 할인가격을 강조할 때, 즉시구매와 같은 버튼을 보여줄 때, 할인 적용이 남은 시간을 초읽기 할 때 빨간색은 긴박감을 조장하여 사용자들이 행동하게끔 도울 것임
* 오류안내 등 긴급한 공지에 빨간색을 사용한다. 사용자에게 어떤 일이 발생했음을 즉각적으로 알려주고 메시지가 중요해 보이게 만들 것이다.
* 음식과 관련된 작업이라면 빨간색의 사용을 고려해본다. 빨간색과 음식은 연관성이 많으며, 많은 식품 기업과 식당에서 효과적으로 사용되었다. 이런 상황에서는 파란색의 사용을 피한다. 파란색은 식욕을 억제하는 효과가 있다.
* 성과가 중요하 상황에서의 빨간색의 사용은 피한다. 퀴즈 애플리케이션을 만든다면, 빨간색은 사용자들의 수행능력을 방해할 수도 있음.
- 파란색 물감에 사용되는 군청색 안료가 중세 유럽에서 너무 비쌌던 탓에, 감청색은 부유층을 연상하게 되었음. 상대적으로 일반인든 초록색이나 갈색과 연결됨.
- 주황색은 동양문화권에서 특별한 의미가 있음. 이는 아마도 오랜 역사에 걸쳐 약재료로 이용되었던 값비싼 향신료인 사프란에서 유래했을 것임. 사프란 주황색은 인도국기에 사용되었고, 힌두교에서 많이 사용하며, 소승불교 승려들의 승려복 색이기도 함
- 미국에서 노란색은 택시를 연상시키는 데, 이는 1915년 시카고에서 설립된 옐로캡이라는 택시회사 덕분. 멀리서도 가장 눈에 띄는 색이 노란색이라고 시카도 대학에서 연구했다는 소식을 듣고, 이 회사의 설립자 존 헤르츠가 택시의 색을 노란색으로 선택했다고 함
- 빨간색은 장렬히 전사한 군인들의 용기와 피를 상징하기 위한 목적으로 국기에 자주 사용됨.
- 웹사이트에 사용되는 배경색
* 흰색 : 가장 보편적. 흰색 배경에 어두운 색 활자는 읽기에 적당할만틈 대조를 이루며, 신뢰감을 줌. 서구 문화에서는 흰색은 순수함, 깨끗함, 순결함과 연관됨. 인도와 중국 등 몇몇 동양문화에서는 장례식에 흰색옷을 입는데도, 대중화된 웹사이트에서 흰색을 많이 사용. 구글, 구루지, 바이두는 모두 흰색 배경.
* 오프 화이트 : 탈색하지 않은 천연종이의 색은 크림색에 가까운데 이것을 오프 화이트라 함. 오프화이트 또한 웹에서 흔하게 사용되나, 전자상거래 사이트와 같이 사용자 범위가 넓고 트래픽이 많은 사이트에서는 잘 찾아볼 수 없음. 오프 화이트 또는 크림색은 종종 자연스러움을 연상시키며 순백색보다 더 친근감을 줌. 오프 화이트는 오래되어 누렇게 색이 바래기 시작한 종이처럼 예스러운 느낌이 들기도 함. 오프 화이트 배경은 조경회사나 역사소설, 오래 숙성한 고급 위스키 등의 사이트에 적합
* 어두운 색 : 성공적인 전자상거래 사이트 중에서 배경에 어두운 색을 사용하는 사이트는 거의 본적이 없을 것이다. 그렇다고 해서, 아예 사용할 수 없다는 것은 아님. 어두운 배경색은 방문자들에게 도시의 신나는 밤을 연상시킬 수 있음. 그래서 식당이나 나이트 클럽 웹사이트에는 간혹 어두운 배경을 사용. 웹 디자이너 또는 패션 디자이너의 사이트에도 어두운 색을 사용하는 예가 있음. 어두운 배경색은 고급스럽고 세련된 느낌을 줄 수 있음.
* 밝은 색 : 노란색, 분홍색, 사이언 색 등 밝은 색으로 이루어진 배경은 분명은 강한 인상을 주지만, 항상 좋지만은 않음. 배경에 밝은 색을 사용하는 경우 반드시 그럴만한 이유가 있어야 함. 밝은 색 배경은 스플래스 페이지를 사용하는 사이트, 콘텐츠 양은 적으면서 강한 인상을 주어야 하는 사이트에 어울림
* 그래픽과 텍스트 : 교통신호에 표준이 있는 것처럼 (비공식적이긴 하지만) 웹에도 표준이 있음. 사이트마다 사용패턴이 유사하므로 색을 사용한 커뮤니케이션에도 공통적 방법들이 생겨났음. 게다가, 인터페이스 디자이은 사용자들과의 커뮤니케이션에 있어서 이미 익숙한 문화적 단서나 메타포를 활용함. 데스크톱 또는 휴지통의 메타포가 그 사례임. 웹에서 색을 사용하는 패턴을 이해하면 사용자와 명확하게 커뮤니케이션하는 데 필요한 의사결정을 신속하게 내릴 수 있음.
* 초록색 : 웹사이트에서 진행을 나타낼 때 초록색을 사용하는 것을 종종 볼 수 있음. 초록색으로 나타나는 아이콘과 인터페이스 요소는 매우 많음. 초록색 체크표시는 상품을 비교하는 표에서 자주 사용되어 어떤 제품에 어떤 기능이 있는지를 나타냄. 어떤 단계가 성공적으로 완료되었다는 것을 나타내는 메시지에도 가끔 초록색이 사용됨. 초록색은 행위를 유도하는 버튼에도 잘 쓰이며, 사실 다른 색을 사용하는 것보다 나을 때도 있음. 그러나 빨간색도 효과가 있음.
* 노락색 : 중요한 메시지나 노트에 주의를 집중시키기 위해 사용. 유투브는 자신이 올린 비디오를 볼 때 노란색을 사용해 해당 동영상이 개인적 콘텐츠임을 나타냄. 지메일 등의 구글제품은 모두 중요한 메시지를 표시할 때 노란색 배경을 사용. 노란색은 세일, 특가, 가격 등을 연상하기도 함. 아마존닷컴은 노란색 보물상자 아이콘을 사용해 오늘의 특가상품을 강조하고, 별점시스템과 상품페이지의 버튼들에도 노락색을 사용. 이베이는 밝은 주황색 배지를 사용해 인기있는 판매자들을 구별함. 구글 키워드에서 가장 큰 비용을 지급하는 광고들은 밝은 노란색 배경에 나타남.
* 빨간색 : 오류 등 사용자가 확인해야 하는 긴급한 메시지를 제공하는 상황에 사용. 데이터 표시 오류들은 대부분 빨간색으로 나타남. 긴급한 마케팅 메시지에도 빨간색은 효과적임. 이베이는 경매가 끝나간다는 메시지를 빨간색으로 표시하고, 아마존닷컴에서는 할인된 가격을 빨간색으로 보여줌. 분석회사인 퍼포머블은 한 실험에서 빨간색 버튼이 초록색 버튼보다 21% 정도로 더 큰 효과가 있다는 것을 밝혀냈음.
* 파란색 : 웹에서 파란색은 링크가 걸린 텍스트의 기본색상. 이 때문에 일부 웹디자이너들은 링크를 표시할 때 파란색 계열 외으 색은 사용하지 않으려 함. 사용성 전문가인 제이콥 닐슨은 그의 웹사이트에서 링크에는 파란색을 사용하는 것이 좋지만, 다른 색을 사용해도 그 효과는 거의 같다고 언급. 경험적 법칙에 의하면, 트래픽이 많고 사용자 범위가 넓은 사이트를 작업할 때는 링크에 파란색 계열을 사용하는 편이 좋음. 다른 색을 사용해도 무방하지만, 그런 색은 규모는 더 작고 기술을 잘 아는 사용자가 많은 사이트나 트래픽이 적고 사용성보다는 디자인의 심미감이 중요한 블로그 및 사이틍 더 적절. 어떤 경우에라도 링크가 걸리지 않은 텍스트를 파란색으로 쓰는 것은 삼가는 것이 좋음. 이 규칙은 사이트에 온통 푸른 계열의 컬러 팔레트를 적용하여 파란색 텍스트는 디자인의 일부임이 명확하고, 링크걸린 텍스트는 오히려 다른 색으로 쓴 사이트에서는 예외일 수 있음.
- 타이포그래피 커뮤이케이션의 원칙
* 타이포그래피는 언어를 통해 의사소통하기 위해 존재한다. 이 의사소통을 방해하거나 간섭하는 것은 그 무엇이든 바람직하지 않다.
* 타이포그래패의 형태는 재료와 언어의 조합으로부터 나온 것이다. 재료 본래의 특성은 타이포그래피에 관한 의사결정을 내릴 때 항상 고려해야 한다.
* 서체의 목표는 각각의 글자가 갖는 본래의 특성을 빛내고 때로는 특별한 분위기를 내는 것이다. 서체는 서로 조화를 이루어야 한다. 한데 어울려 있는 글자들 가운데서 특정 글자가 튀는 속성을 가져서는 안된다.
* 서제 본래의 디자인은 존중되어야 한다. 서체의 본질을 바꾸는 것은 명확한 커뮤니케이션 능력을 떨어뜨린다.
* 모든 글덩어리의 목표는 고른 질감을 갖는 것이다. 본문 글은 읽기 쉬워야 하며, 질감을 고르게 하는 것이 그 목표를 이루는 지름길이다.
* 각 정보조각들이 갖는 시각적 차별성은 읽히는 방법과 적절히 맞아야 함. 많은 경우, 타이포그래피에 최소한의 차이를 두는 것으로 정보의 체계를 충분히 세울 수 있음. 예를 들어 표제와 본문을 같은 활자체로 쓰는 대신, 표제의 활자는 다른 크기와 굵기로 쓰고 위아래에 여백을 둘 수 있음. 본문에서는 타이포그래피의 차이를 최소화하여 정보를 빨리 소비할 수 있도록 촉진한다.