2016년 8월 30일 화요일

사용자는 사람이다 : 시선 4

화면 속 눈이 있을 것 같은 자리에 제목과 본문 내용 요약을 놓는다. 사용자가 대충 내용을 짐작할 수 있게 본문 내용을 요약하는 데 정성을 들인다. 맥락을 먼저 알면 본문을 이해하기 훨씬 쉽다.

<> 무슨 내용인지 궁금해? 궁금하면 다 읽어!



한 줄 요약은 본문을 읽을 시간이 없는 바쁜 사용자를 위한 개발자의 배려다.

<> 시간을 아껴줘서 고마워요~ 개발자님.



이 법칙은 절대적인 법칙이 아니다. 디자인 실패 확률을 줄여 주는 법칙이다.

개발자의 능력에 디자인이라는 날개를 달자.
http://www.facebook.com/appartiste

2016년 8월 24일 수요일

사용자는 사람이다 : 시선3

화면 크기는 다 달라도 왠지 눈이 있을 것 같은 위치는 비슷하다.

<> 화면은 우릴 보고 웃지. 낮이고 밤이고...



화면 가장 윗 부분에 로고와 제목을 놓고, 좀 더 아래(눈 위치)에서 본문을 시작한다.

<> 디자인 대부분의 본문이 비슷한 위치에서 시작하는 이유다.


이 법칙은 절대적인 법칙이 아니다. 디자인 실패 확률을 줄여 주는 법칙이다.

개발자의 능력에 디자인이라는 날개를 달자.
http://www.facebook.com/appartiste

2016년 8월 22일 월요일

사용자는 사람이다 : 시선 2

사용자가 화면을 볼 때 가장 먼저 볼 확률이 높은 부분은 영역 2다. 화면을 얼굴로 치자면 눈이 있는 부분이다. 우리는 대화중에 상대의 눈을 가장 많이 본다. 중요 정보를 어디에 둘지 고민이라면, 사용자의 시선이 가장 먼저 닿는 부분에 두는 게 좋다.

<> 내 눈을 봐요. 진심이 느껴지죠?


이 법칙은 절대적인 법칙이 아니다. 디자인 실패 확률을 줄여 주는 법칙이다.

개발자의 능력에 디자인이라는 날개를 달자.
http://www.facebook.com/appartiste

사용자는 사람이다 : 시선

개발 이미지와 연관된 것처럼 보이는 글은 이미지 옆에 있는 글일까? 아래에 있는 글일까?

<> 개발 자국



대체로 사람의 시선은 왼쪽에서 오른쪽으로 흐른다. 자연스러운 시선 흐름에 따라 이미지 옆에 있는 글이 이미지와 연관된 것처럼 보인다.

<> 연관된 정보를 놓는 순서가 고민이라면,이 순서를 따르는 게 좋다.



글을 반대 방향으로 읽는 나라도 있다. 취향의 차이도 있다.



개발자의 능력에 디자인이라는 날개를 달기 위해 오늘도 공부한다.

http://www.facebook.com/appartiste

2016년 8월 21일 일요일

사용자는 사람이다 : 맥락 착시

"I3" 모양이 알파벳 사이에 놓이면 알파벳 B로 보이고, 숫자 사이에 놓이면 숫자 13으로 보인다. 똑같은 것이라도 주변 맥락에 따라 달라 보인다. 원이 사각형 사이에 놓이면 모자른 사각형처럼 보이는 이유다.

<> 평소 스마트한 당신이 예비군복만 입으면 터프해지는 현상!


어려운 디자인 이론 때문에 괴로워하는 개발자를 위해 최대한 쉽게 디자인 법칙을 설명하려 노력하고 있습니다.
http://www.facebook.com/appartiste

사용자는 사람이다 : 크기 착시 3

원들 사이에 있는 원과 사각형 사이에 있는 원의 크기는 같지만, 사각형 사이에 있는 원이 더 작아 보인다. 사각형 사이에 있는 원이 모자른 사각형처럼 느껴진다.

<> 맥락을 어겨 사각형이 되려다 못 된 자여...


2016년 8월 20일 토요일

사용자는 사람이다 : 크기 착시 2

원형 아이콘과 글자의 크기가 같은 것보다, 각진 글자의 크기가 조금 작은 게 균형이 맞아 보인다. 훨씬 보기 좋다.

<> 두뇌는 균형이 맞아 보이는 것을 더 좋아한다.



어려운 디자인 이론 때문에 괴로워하는 개발자를 위해 최대한 쉽게 디자인 법칙을 설명하려 노력하고 있습니다.
http://www.facebook.com/appartiste


사용자는 사람이다 : 크기 착시

A처럼 원과 사각형의 크기를 똑같이 하면 사각형이 좀 더 커 보인다. 수치로는 똑같은 크기지만 두뇌는 원보다 사각형이 크다고 생각한다.

<> B처럼 사각형의 크기를 원보다 작게 해야 두 도형의 크기가 같아 보인다.



어려운 디자인 이론 때문에 괴로워하는 개발자를 위해 최대한 쉽게 디자인 법칙을 설명하려 노력하고 있습니다.
http://www.facebook.com/appartiste

2016년 8월 19일 금요일

사용자는 사람이다 : 뮐러 라이어 착시 2

친절한 두뇌씨는 화살표 끝에 있는 꺽쇠 괄호를 그리다만 삼각형으로 여긴다. "아~ 그리다 말았네?" 하면서 상상의 선을 그어 삼각형을 완성한다. 피곤한 디자이너를 걱정하는 두뇌씨 정말 친절하다.

상상의 삼각형에 선이 가려진 화살표가 더 짧아 보인다.

<>꺽쇠 괄호의 방향이 착시를 일으킨다.




똑똑한 두뇌씨는 화살표를 입체 도형으로 본다. 없는 것도 볼 수 있는 두뇌는 화살표 꺽쇠 괄호 끝 부분들을 상상의 선으로 연결해 입체 도형을 완성한다. 평면에서 입체를 보는 두뇌는 참 똑똑하다.

꺽쇠 괄호가 바깥을 향한 화살표로 만든 도형이 더 크다.

<> 별거 아닌 것 같은 이 착시 현상이 디자인 세계에 큰 파장을 일으키는데...




어려운 디자인 이론 때문에 괴로워하는 개발자를 위해 최대한 쉽게 디자인 법칙을 설명하려 노력하고 있습니다.
http://www.facebook.com/appartiste

2016년 8월 18일 목요일

사용자는 사람이다 : 뮐러 라이어 착시

주변 도형의 모양에 따라 길이나 크기가 달라 보이는 착시가 일어난다.
눈은 두 화살표의 길이가 같다고 보지만 두뇌는 위에 있는 화살표의 길이가 더 길다고 생각한다.

<> 프란츠 뮐러 라이어 착시


어려운 디자인 이론 때문에 괴로워하는 개발자를 위해 최대한 쉽게 디자인 법칙을 설명하려 노력하고 있습니다.
http://www.facebook.com/appartiste

당신의 좋아요와 댓글은 도파민 분비에 힘이 됩니다. ^^

2016년 8월 17일 수요일

사용자는 사람이다 : 착각 즐기기

두뇌는 상상하기를 좋아한다. 그래서 두뇌는 눈으로 볼 때 보다 글을 읽고 그 장면을 상상할 때 더욱 신나게 활동한다.
두뇌는 착각하기를 즐긴다. 평범한 그림보다 착각하고 상상할 거리가 잔뜩 있는 그림에 관심을 가진다. 집중한다.

<> 아 뻔해 뻔해...



당신의 과감한 표현에 사용자의 두뇌가 좋아요를 누르셨습니다.

<> 보글보글?


<> 훅!


가끔하는 일탈은 정신 건강에 좋다.



당신은 개발자를 위한 디자인 법칙을 좋아하십니다.
http://www.facebook.com/appartiste

메시지도 주십니다.


2016년 8월 16일 화요일

사용자는 사람이다 : 그림자의 방향

단어를 안다면 이 그림이 글자로 보인다. 쉽게 읽힌다.

<> 데시그느?



강렬한 빛에 의해 투명한 입체 글자 조각에 그림자가 생긴 것처럼 보인다.

<> 누가 슈퍼맨의 옷을 벗길 수 있을까.


빛이 사물의 왼편 약간 위쪽에서(300~320도) 비추듯 그림자를 표현한 그림이 가장 자연스러워 보인다. 글을 왼쪽에서 오른쪽 방향으로 읽는 사람에게 더욱 그렇다.

<> 사용자가 글을 읽는 방향은 아주 중요하다.


개발자를 위한 디자인 법칙을 쓰고 있습니다. 페이지 좋아요 하시면 좋아요.
http://www.facebook.com/appartiste

2016년 8월 15일 월요일

사용자는 사람이다 : 착각

사람은 반 이상 지워진 그림이라도 자신이 알고 있는 것과 비슷한 모양이 남아있다면, 상상으로 지워진 부분을 완성시켜 온전한 그림처럼 볼 수 있다.

숫자를 알고 있다면 이 선들이 숫자로 보인다.

<> 반 이상 지워져도 별 어려움없이 숫자로 읽을 수 있다.



알파벳을 알고 있다면 이 선들이 알파벳으로 보인다.

<> 온전한 알파벳 모양을 상상할 수 있다.


만약 숫자도 알파벳도 모르는 사람이 본다면 이 그림은 그냥 선으로만 보일 것이다. 역시 세상은 아는 만큼 보인다.


개발자를 위한 디자인 법칙을 쓰고 있습니다. 페이지 좋아요 하시면 좋아요.
http://www.facebook.com/appartiste

2016년 8월 14일 일요일

사용자는 사람이다 : 착각

사람은 있는 것을 못 보기도 하고 없는 것을 보기도 한다.

가끔 어머니가 씽크대에 있는 이렇게 저렇게 생긴 그릇을 가져 오라고 시킬 때가 있다. 아무리 찾아봐도 그런 그릇이 전혀 보이지 않는다. 짜증이나 달려 오신 어머니가 “이게 안 보여?” 하는 순간 뿅! 하고 그 그릇이 보인다. 분명 없었는데...... 아무리 찾아도 보이지 않던 물건이 항상 있던 자리에 그대로 있던 적도 있다. 귀신이 곡할 노릇이다.

두뇌가 보고 싶은 것만 선택 집중해서 보는 이유는 정보 처리 과부하를 막기 위해서다. 두뇌는 초당 수백만개의 정보를 오감으로 받아들이고 판단하고 의식하기 때문에 정말 바쁘다. 모든 정보에 집중해서 판단하고 의식한다면 머리에 냉각팬을 달고 다녀야 할 것이다. 그래서 영리한 두뇌는 경험을 중심으로 정보를 팩키지로 묶어 처리한다.

특별한 정보만 의식하고 나머지는 무의식으로 넘긴다. 정보를 팩키지로 묶어 처리하는 속도가 너무 빨라 가끔 오류를 일으킨다. 있지도 않은게 보인다던가, 있는게 안 보인다던가, 실제와 다르게 보인다던가 하는 오류가 착시로 인해 생긴다. 그것이 착각이다.


<> 착한 사람 눈에만 보인다는 삼각형과 사각형, 가에타노 카니자의 도형.


눈은 피자를 한 조각 잘라 먹은 듯한 동그라미들과 그리다만 삼각형 세개를 보지만, 두뇌는 있지도 않은 하얀색 삼각형과 하얀색 사각형을 본다. 착각이라고 의식해도 계속 보이는 것은 어쩔 수 없다.

<> 두뇌는 하얀색 삼각형과 사각형을 검은 동그라미 위에 올려 놓았다고 생각한다.

2016년 8월 11일 목요일

사용자는 사람이다.


두뇌는 눈을 통해서만 세상을 볼 수 있다.


<>두뇌야 갑갑하지? 그래도 나오면 안돼...



눈은 두뇌에게 정보의 80%를 전달하는 귀중한 존재다. 그런데 두뇌는 눈을 완전히 믿지 않는다. 눈이 전달한 정보를 다시 가공한다.


<>내 맘대로 생각할거야.



눈이 보는 세상은 온통 거미줄 쳐져 있다. 눈에는 수많은 실핏줄이 있다. 거미줄 같은 실핏줄 그림자가 눈이 보는 세상에 겹쳐진다. 우리의 두뇌는 타고난 리터칭 전문가다. 눈이 보낸 영상에서 그림자 부분을 싹 지우고 빈 곳을 메꾸며 눈이 보낸 영상을 예쁘게 꾸민다. 그 덕에 세상이 아름다워 보인다.


<>비문증은 못 지우니?




거울에 비친 모습이 멋져 보이는가? 눈에 보이는 게 전부 진실은 아니다. 두뇌가 나르시시즘 효과로 리터칭 했을 수도...

<>착각은 자유지.