본문 바로가기

UX 리서치/디자인 이론과 리서치

아토믹디자인(Atomic Design) 방법론, 간단하게 이해하고 응용하기 체계화와 유지관리와 구현 상의 효율성 등의 이유로 컴포넌트 단위의 UX디자인이 각광받기 시작했고, 이는 디자인시스템이라는 형태로 이전까지 화면 단위로 보여지던 디자인의 산출물이 변화하고 있습니다. 이러한 변화는 디자인 분야에서만 나타나는 변화의 현상이 아닌 프론트엔드 개발 분야에서의 기술 변화도 비슷한 형태의 변화 흐름을 보여주고 있습니다. 리액트나 뷰, 앵귤러 등 모던 프레임워크들이 컴포넌트 별로 분리된 개발을 지원하는 것이 그러한 양상 중 하나라고 볼 수 있습니다. 이러한 배경 하에 주목받는 디자인 방법론 또는 개념으로서 '아토믹디자인(Atomic Design)'을 들 수 있습니다. 본 포스트에서는 아토믹디자인이라는 방법론의 간략한 범위 내에서 기본 개념을 파악하고 이를 응용할 수 있는 방법에 대해서..
좋은 대시보드 디자인의 10가지 원칙 (2019) 본 포스트는 Saadia Minhas가 2019년 11월 27일에 작성한 10 Rules of Dashboard Design 포스트를 지식을 널리 알리기 위한 목적으로 번역하여 작성한 글입니다. 저작권 및 내용에 문제가 있을 시 연락을 주시면 그에 적절한 조치를 취하겠습니다. 왜 대시보드 디자인이 중요한가요? 대시보드는 정보를 시각화하는 역할을 합니다. 특히 복잡한 정보들의 집합체를 사용자들이 이해하기 쉬운 포맷으로 전달하는 것이 이것의 목적이라고 볼 수 있습니다. 사용하기 좋은 대시보드는 1) 명확해야합니다 좋은 대시보드는 요청된 정보를 명확하게 표현해야 합니다. 사용자가 대시보드를 볼 때 사용자는 5초 안에 대시보드의 용도를 확인할 수 있어야 합니다. 사용자를 몇 분간 머무르면서 대시보드의 용도를 확..
디자이너라면 반드시 봐야할 7가지 TED 강연 영상 *본 포스트는 "Invision Blog'에 게재된 "THE 7 TED TALKS EVERY DESIGNER SHOULD WATCH (PLUS ONE FOR FUN)"이라는 포스트를 국문으로 번역하여 더 많은 사람들에게 정보를 알리고자 하는 목적으로 저작된 포스트임을 밝힙니다. TED Talk의 1984년의 첫번째 강연 이후, TED는 우리들에게 깊은 감명을 주며 생각할 거리들을 건내주고 있습니다. 이 중 디자인에 관련된 300개 이상의 TED 강연 중 빠트려서는 안 될 강연들을 뽑기로 했으며, 트위터리안들의 도움을 통해 7가지 강연을 추릴 수 있었습니다. (해당 강연들을 한글자막이 있을 경우한글자막이 달린 버전으로 링크를 달아 두었습니다.) 1. 좋은 디자인이 당신을 행복하게 만드는 3가지 방식 by ..
UI디자인가이드(스타일가이드,개발가이드,디자인명세) 만들기 (2016년 기준) (내용수정) (내용수정, 2019-09-18)본 글은 2016년에 기재된 비교적 오래된 내용을 담은 포스트입니다. 관련 내용을 2019년 09월 기준으로 추가 드립니다.아래 소개된 툴들은 이제 거의 사용되지 않습니다.UI디자인가이드 제작에 있어 '제플린'이라는 디자인명세 및 핸드오프 툴이 거의 업계 표준으로 자리잡았습니다.그 외의 일부 기업에서는 전통적인 파워포인트를 여전히 활용하고 있습니다.그사이 명세적 측면보다 디자인의 구체적 활용안 및 컴포넌트화를 다루는 '디자인시스템'이라는 확장된 개념이 등장했습니다.용어의 모호성은 여전합니다. 디자인가이드, 디자인명세, 스타일가이드, 디자인규격 등 혼용되고 있는 상황입니다.UI디자인가이드, 디자인명세, 스타일가이드 등의 각 용어에 대한 의미성과 프로젝트 상황에 맞춰 사용하시..
'저장' 아이콘을 바꿀 수 있는 방법은 없을까? *본 포스트는 "Medium'에 게재된 Seth Coelen의 "A Better Save Icon"이라는 포스트를 국문으로 번역하여 더 많은 사람들에게 정보를 알리고자 하는 목적으로 저작된 포스트임을 밝힙니다. 플로피디스크 모양의 '저장' 아이콘은 일종의 '근시안적' 아이콘 디자인의 사례라고 볼 수 있습니다. 최근의 어린 친구들은 플로피디스크가 무엇인지 조차 알지 못하기 때문입니다. 이제는 이 '저장' 아이콘을 보다 오랜 기간 동안 통용될 수 있는 아이콘으로 새로 디자인되어야 할 때가 아닌가 싶습니다. 물론 이것은 매우 어려운 일로 보입니다. 다음은 새로운 저장 아이콘을 만들기 위해 저를 포함한 여러 디자이너들이 노력한 결과를 공유 드립니다. Piggy Bank by Ricardo Moreira돼지 저금..
해외 웹디자이너들이 선호하는 폰트 10개 *본 포스트는 "Hongkiat'에 게재된 "Top 10 Fonts Web Designers Love"이라는 포스트를 국문으로 번역하여 더 많은 사람들에게 정보를 알리고자 하는 목적으로 저작된 포스트임을 밝힙니다. 제가 웹/그래픽디자인을 처음 배우기 시작할 때 항상 어떤 폰트를 사용할지 고민하고, 또 실무에서는 어떤 폰트를 주로 사용하는지 궁금했습니다. 그래서 저는 실제 디자이너들이 어떤 폰트를 자주 사용하고 또 선호하는 지, 더불어서 타이포그래피 관련 어떤 이슈를 지니고 있는지에 대해서 조사를 진행하기로 했으며, 그 결과를 공유하고자 합니다. Polldaddy,Forrsr, Facebook, Twitter와 같은 서비스를 통해서 조사를 진행했으며, 총 14개국에 있는 34명의 디자이너들로부터 어떤 폰트..
그림으로 알아보는 컴퓨터 아이콘의 역사 *본 포스트는 "Futuramo Blog"의 2015년 05월 10일 게재된 "Visual History of Computer Icons"이라는 포스트를 국문으로 번역하여 더 많은 사람들에게 정보를 알리고자 하는 목적으로 저작된 포스트임을 밝힙니다. 컴퓨터에 사용되는 폴더 아이콘, 스마트폰 상의 삭제 버튼, 혹은 웹 상의 PDF 다운로드를 위한 파일 아이콘 등은 언제부터 사용되기 시작했을까요? 컴퓨터 아이콘들은 일상적으로 사용되지만 35년의 역사를 가지고 있다는 것은 사실 많은 사람들이 알지는 못합니다. 컴퓨터 아이콘의 역사는 매우 유의미합니다. 컴퓨터 아이콘은 먼 어디에선가 만들어졌다고 볼 수도 있으며 혹은 우리 생활 근처에서 발생했다고 볼 수도 있습니다. 뉴스에서 다뤄지지도 않았으며, 저녁 식사의 주..
웹디자이너가 개발자와 협업하기 위해 체크해야 할 사항들 *본 포스트는 "Invision App Blog"의 2016년 10월 14일 게재된"Kevin Tomasso"의 "Questions to ask developers befor you start designing"이라는 포스트를 국문으로 번역하여 더 많은 사람들에게 정보를 알리고자 하는 목적으로 저작된 포스트임을 밝힙니다. 다음 인용문은 InVision 사에서 제공하는 온라인 교육 과정 중에서 Kevin Tomasso가 강의한 'Designing with your developers in mind'에서 말한 내용입니다. "대부분의 반응현 웹디자인에서는 다양한 제약 조건들이 존재합니다. 기술적인 측면에서의 제약과 함께, 개발팀이 지니고 있는 지식과 스킬에서도 그 제약 조건들은 발생할 수 있습니다."본 포스트..
외주/과외 문의