ux13 화면설계(Wireframe)이전에 스케치를 먼저 하는 것이 중요한 이유 이 글은 UX Movement가 선정한 2012년 UX 컬럼 Best 5 중 "Why it's important to sketch before you wireframe"을 한글로 번역한 것입니다. 왜 화면설계 이전에 스케치를 먼저 하는 것이 중요한가. 웹사이트 혹은 어플리케이션에 대한 아이디어를 떠올려본 적이 있는가? 아이디어를 생각해내는 것은 쉽지만, 정작 어려운 부분은 그 아이디어가 어떻게 사용자 인터페이스로 자리잡을지를 이해하는 것이다. 바로 이 지점에 스케치가 유용하다. 스케치는 창의성과 건설과 연관있는 많은 직업에서 이뤄진다. 심지어 레오나르도 다빈치도 그의 발명품을 만들기 전에 스케치를 했다. 당신이 얼마나 똑똑하든지 간에 머리 속에 있는 단순한 아이디어를 정리하지 않고 바로 구현하는 것은 불.. 2013. 1. 8. 왜 스크롤이 새로운 클릭인가 이 글은 UX Movement가 선정한 2012년 UX관련 컬럼 베스트 중 하나인 "Why scrolling is the new click"를 한글로 번역한 것입니다. 어느쪽이 사용자에게 더 좋을까? 스크롤하기? 혹은 클릭하기? 이것은 페이지 흐름을 디자인할 때 반드시 생각해봐야할 질문이다. 클릭은 사용자에게 새로운 페이지로 이동하는 링크를 제공한다. 스크롤은 모든 컨텐츠를 다른 영역으로 나누어 한 페이지에 담아 제공한다. 여러 해 전에는 클릭이 이 질문에 대한 간단한 해답이었다. 만약 한 페이지를 너무 길게 만든다면 사용자는 위쪽 절반만 보고, 읽은 뒤 아래쪽 절반은 스쳐가듯 보거나 무시한다는 게 일반적인 생각이었다. 오늘날은 많은 것이 변했다. 많은 사용자들이 화면 맨 아래까지 스크롤해서 내려가고, .. 2013. 1. 7. 왜 '여기를 클릭하세요'라고 링크를 지정하면 안되는가 이 글은 UX Movement가 선정한 2012년 UX관련 컬럼 베스트 중 하나인 "Why your links should never say "Click Here""를 한글로 요약한 것입니다. "클릭"은 마우스에 너무 초점을 맞춘다. "클릭"이라는 단어를 사용하는 순간 사용자의 관심은 인터페이스에서 마우스로 옮겨간다. 링크를 클릭할 때 전혀 불필요한 주의를 불러일으키는 셈. 인터페이스와 컨텐츠에 초점을 맞춰야할 순간에 사용자 스스로, 그리고 사용자의 마우스로 주의를 옮길 뿐 아니라, 사용자가 링크가 뭔지 모르거나 마우스를 사용할 줄 모른다는 느낌을 준다. "클릭" 대신 사용자의 과업(task)과 연결된 동사를 사용하라. "클릭"을 사용하면 사용자는 마우스를 생각하지만, 과업과 연결된 동사를 사용하면 사용.. 2013. 1. 4. 입력항목 중 잘못된 항목이 있을 경우, 그 항목만 보여주자는 의견 스매싱 매거진에 실린 영문 컬럼입니다. http://uxdesign.smashingmagazine.com/2012/06/27/form-field-validation-errors-only-approach/본문을 굳이 읽어보지 않아도 되고(저도 정작 본문은 대충 읽어봤고요), 포함된 이미지만 봐도 그 의도가 명백하게 드러납니다. 사용자가 입력해야 할 항목이 아주 많은 화면이 있는 경우, 그 중 한 두개를 잘못 입력하면 피드백을 주죠. 최악은, 알럿창을 띄워서 '틀린 항목이 있으니 다시 입력하삼' 하고 알럿창 닫으면 입력한 데이터를 초기화해버리는 거고. (요즘은 액티브엑스를 설치해야 하는 관공서 웹사이트를 제외하면 이런 경운 드물죠), 그 다음은 입력한 데이터를 날리지는 않지만 뭘 잘못 입력했는지는 안 알려주.. 2012. 7. 2. 모서리가 둥근 사각형이 각진 사각형보다 좋은 이유 UX Movement 블로그에 실린 글 중 2011년 한 해 가장 많이 읽힌 글, 첫 번째. 간략히 핵심만 간추렸다. 자세히 보고 싶은 분은 이곳을 방문해서 전문을 보기를 권장. 요약본만 보더라도 글을 읽은 후, 원문에 있는 예시 이미지를 보면 이해하기 더 쉽다. 아이폰을 처음 개발할 때 스티브 잡스가 엔지니어의 반대에도 불구하고 아이콘의 모서리를 둥글게 만들어야 한다고 했다는데, 그냥 고집이 아니라 근거가 있다. 출처; http://uxmovement.com/thinking/why-rounded-corners-are-easier-on-the-eyes/ 1. 둥근 모서리는 받아들이기 더 쉽다. 뾰족뾰족한 모서리보다 둥근 모서리가 뇌가 정보를 처리하는데 더 쉽다. 모서리가 날카로울수록 밝게 느껴지고, 밝게.. 2012. 1. 18. 모바일웹 디자인을 할 때 반드시 갖춰야할 5가지 최근 온라인 서비스를 기획하면서 데스크탑 버전을 먼저 시작해서, 지금은 모바일 버전을 구성 중이다. 아이폰을 쓰면서 나름대로 모바일에 익숙해졌다고 생각했는데, 천만에, 모바일 버전을 만들다보니 곳곳에 암초와 함정이 깔렸다. 그 와중에 구독하는 블로그에 등장한 반가운 칼럼. 다시 한 번 되짚어 보는 계기로 삼아보자. 언제나 그렇듯 번역 품질을 장담할 수 없으므로, 원본을 읽으시길 권장. 원본: http://tympanus.net/codrops/2012/01/12/5-things-every-mobile-design-should-have/ 그렇다, 이러한 모바일 웹 유행이 가까운 시일 내에 사라질 것 같지는 않다. 보다 모바일에 친화적인 웹사이트를 만들어야 한다는 생각이 슬슬 들고 있다. 모바일 웹 디자인이 .. 2012. 1. 13. 웹사이트의 우편번호 입력 방식을 개선해보자 예전에 트위터 누군가 올려준 블로그 포스트 하나를 보고 큰 충격을 받았다. '밀피유의 이야기'라는 블로그의 '웹의 사소한 곳도 2011년에 맞도록'이라는 글이다. 혹시 본인의 직업이 웹 기획자, 웹 디자이너 하여간 웹사이트를 기획하거나 운영하거나 만드는 분야에 속하는 분이라면 꼭 한 번 읽어볼 것을 권한다. 이 글에 아래와 같은 대목이 나온다. 그런데 저는 지금도 우편번호 버튼을 누르고 배송지의 동 이름을 입력해 우편번호를 찾고 있는 겁니다. 안 이상합니까? 지금쯤 되면 주말에 출입국관리소를 통해 화성에 갈 수 있지는 않더라도 적어도 우편번호 입력은 주소를 다다닥~ 타이핑하고 있으면 알아서 내가 입력하는 주소를 서버와 주고받아 자동으로 띄워 주고 이메일 입력은 네띠앙이 맨 위에 있는 콤보박스 맨 아래에 .. 2011. 4. 5. UI, Usability, UX에 대한 쌀로 밥짓는 얘기 이 포스트를 트위터에 올렸더니 'Userbility가 아니라, Usability라는 지적을 해주셨습니다. 무식함이 들통나는 것은 정말 부끄럽지만, 제가 이걸 트위터에 올리지 않았다면 정정할 기회도 얻지 못했겠지요. @R_pooh님을 비롯해서 지적해주신 분들 고맙습니다. 몇 년전부터 부쩍 UX에 대한 얘기가 많다. UX camp라는 대표적인 행사도 있고 UX에 대한 세미나, 컨퍼런스도 많이 열린다. 명함에 UX디자이너라고 적고 다니는 사람도 있고, UX사업부, UX팀 같은 이름을 가진 부서도 있다. 내가 다니던 직장에도 이름에 UX가 들어가는 사업부가 있다. (근데 솔직히 뭐하는 덴지 잘 모르겠다) 많은 이들이 이 세 가지 단어를 사용하면서 -특히 UX를 얘기하면서- 마구 뒤섞어서 얘기한다. 편리하고 쉬운.. 2011. 3. 27. 1박2일 은지원이 보여준 역발상 1박2일의 아침 기상 미션은 승자가 아침밥을 얻고, 패자는 아침밥을 굶는 방식이다. 이를 위해 기상음악이 울리면 전날 촬영에 쌓인 피로로 몰려오는 잠을 깨우며 빨리 일어나서 미션 수행을 해야 한다. 그런데 이번 일요일 방송에서는 제작진이 이를 역으로 뒤집은 미션을 제시했다. 일찍 일어나는 사람이 아침밥을 먹는게 아니라, 늦게 일어나는 사람이 아침밥을 먹는 방식. 생리현상을 참으며 버티는 팀에게 아침을 주겠다는 얘기다. 잠들기 전에는 코미디언팀과 가수팀으로 나눈 두 그룹이 '코미디언의 자존심', '가수의 자존심'을 외치며 절대 먼저 나가지 않겠다고 다짐했다. 그러나 다음날 아침 눈을 뜬 가수팀의 은지원은 전혀 엉뚱한 소리를 한다. 패배를 인정하되, 코미디언팀에게 알리지 않고 조용히 나가겠다는 것이다. 은지.. 2011. 1. 31. 이전 1 2 다음
