스케치(Sketch)와 피그마(Figma)[1]에서 큰 고민 없이 픽셀(Pixel, 줄여서 px)을 사용하고 있나요? 저 역시 한때 그랬습니다. 제가 팀에 처음 합류했을 때 모두가 당연한 듯 픽셀을 사용하고 있었습니다. 문제가 있었다면 진작에 바꿨을 텐데 계속 사용하는 이유가 있지 않을까요? 게다가 아직도 우리 곁에는 픽셀 단위까지 자로 잰 듯한 디자인을 뽑아내는 완벽주의자들이 있습니다. 과연 이들이 맞는 걸까요? 지금부터 한 번 알아보도록 하겠습니다.

프로토타입은 실제 ‘개발'을 시작하기 전, 프로젝트에 직∙간적접으로 참여하는 사람들이 모여 각 화면 단위 내용을 합의하기 위한 과정에 주로 사용됩니다. 오늘은 프로토타입 중 페이퍼 프로토타이핑에 해당하는 핸드 스케치 단계에서 도움이 되는 서비스 ‘Printables’와 ‘Sneakpeekit’ 2곳을 소개하고자 합니다.

이번에 설명할 내용은 바로 손이 움직이는 구체적인 내용이다. 내 아이디어를 상대방에게 쉽게 전달하기 위해서 다듬는 시간을 지난 것이다. 이제는 그 사람의 머릿속에 구체적으로 디자인을 집어넣을 수 있어야 한다.

다양한 웹 레퍼런스를 찾아 디자인 컨셉을 잡았다면 이제 실제 디자인 작업을 할 때입니다. 모바일 디자인 팁에서 설명했던 디자인 툴을 참고해서 작업 환경과 취향에 맞는 툴로 디자인 작업을 할 때, 시각적인 아름다움 외에도 쉽게 깜빡할 수 있는 점을 살펴보겠습니다.

컬러는 디자인을 구성하는 가장 중요한 요소 중 하나입니다. 사용한 컬러에 따라 서비스 분위기가 전혀 달라질 수 있기 때문입니다. 중요한 건, 메인 컬러로 사용될 색과 어울리는 조합을 찾는 것입니다. 이 과정은 몇 번의 경험이 쌓여도 여전히 어렵게 느껴집니다. 오늘은 메인으로 사용되는 컬러를 중심으로 상황에 따라 6가지 조합을 쉽게 생성할 수 있는 서비스 ‘Atmos’를 소개하고자 합니다.

어도비의 인기 소프트웨어는 보통 포토샵을 떠올린다. 그렇지만 디자이너가 아니더라도 디자인 일을 해야 하는 실무자들 사이에서는 포토샵 못지않게 많이 쓰이는 제품이 있으니 바로 ‘일러스트레이터’이다. 자칭 타칭 일러스트레이터 애호가(?)로서 왜 이 제품을 써야 하는지 그 장점들을 설명해 보고자 한다.

게슈탈트 이론이란 20세기 초 막스 베르트하이머, 볼프강 퀼러 그리고 크리스찬 폰 에렌펠스가 인간의 행동을 자극-반응의 연합으로 환원하려는 행동주의적 접근에 반발하며 창시한 이론으로써, 형태심리학(또는 형태주의)이라고도 합니다. 이 이론은 원래 시지각을 설명하려는 목적에서 만들어졌지만 '전경과 배경의 원리'와 같은 법칙들은 청각이나 후각과 같은 다른 감각들에도 똑같이 적용될 수 있습니다. 그럼 이제부터 게슈탈트 심리학의 대표 원리들을 하나하나 살펴보겠습니다.

웹 페이지를 기획, 디자인할 때 많은 시간 고민해야 하는 건 ‘구성(레이아웃)’입니다. 각 화면 단위 어떤 내용을, 어떻게 배치하고 구성해야 방문한 사람들을 서비스가 원하는 행동으로 이끌 수 있는지 결정되기 때문입니다. 그래서 오늘은 랜딩, 소개, 가격 정책 등 화면 단위에 따라 다양한 레이아웃을 미리 확인, 필요한 구성을 빠르게 찾을 수 있도록 도와주는 서비스 ‘Shuffle’을 소개하고자 합니다.

제품 디자인 프로세스에서 건설적인 피드백이 중요하다는 사실은 모두가 알고 있습니다. 여기에서는 사전 준비가 필요하지 않고 비판에서 자유로운 새로운 아이디어를 공유 방식을 제안하려고 합니다. 만약 여러분이 피드백의 품질을 높이고 보다 유기적인 협업을 장려하며 모두가 즐기는 회의를 원하신다면 본 글이 도움이 될 것입니다.

IT 서비스가 아니더라도 제조업, 물류업 등의 서비스도 해당 서비스를 소개하는 소개 페이지를 갖고 있을 정도로 필수가 되어버린 ‘웹’을 디자인하는 건 무척 큰 캔버스에 그림을 그리는 일입니다. 어떤 그림을, 어떤 사이즈에 그리고 다음 페이지로 연결할지 막막하다면 이번 글을 통해 다양한 자료를 확인하고 필요한 요소를 찾아낼 수 있기를 바랍니다.