Designer 앞에 붙는 단어와 그 디자이너가 일하고 있는 곳의 매칭이 재미있다.
같은 회사(아래는 Google)에서 디자이너의 역할이 변하거나 디자인의 의미가 변하는 것도 흥미롭다. 그래서 한번 모아봤다. 이 리스트는 계속해서 갱신하려고 한다.

Interaction Designer@Google, 2015
Making Material Design: Crafting Material

Product Designer@Facebook, 2014
Margaret Gould Stewart: How giant websites design for you

Experience Designer@Adobe, 2014
A Day in the Life of Adobe’s Experience Design Team

Interaction Designer@Google, 2013
Meet Noah, Interaction Designer for Google Search on iOS

Graphic/UI/Interaction/UX Designer@Airbnb, 2013
Design at Airbnb

Service Designer@UK Government Digital Service, 2013
Gov.uk: how geeks opened up government

Product Designer@Apple, 2009
Jonathan Ive, Objectified

아래 인용구는 책 ‘생각에 관한 생각'의 일부 문장을 조금 다듬은 것이다.

시간은 궁극적으로 유한한 자원이지만 기억 자아는 그런 현실을 무시한다. 장기간 행복보다 단기간의 강렬한 기쁨을 선호하며, 장기간의 견딜만한 고통보다 짧지만 강렬한 고통을 더 두려워하게 만든다. 끝이 좋지 않을 가능성이 높으면 아무리 장기간의 행복이라도 기꺼이 포기하려 한다.
(…)
지속 시간에 무게를 둔 행복 개념은 기억 가능 여부와 상관 없이 인생의 모든 순간을 똑같이 취급한다. 사람들이 기억할 수 있는 순간을 곱씹으면서 보내는 시간은 이런 지속 시간에 포함되면서 그 무게감을 높인다. 바이올린을 연습하면서 보낸 시간은 후에 몇년동안 연주하거나 청취하는 많은 경험을 늘려줄 수 있다.

지속 시간에 무게를 두면 우리는 기억할 수 있거나 의미 있다는 사실에 따라서만 결정이 가능해진다.

그러면 궁금해진다. 사소한 순간을 더 지속하도록 만드는 것은 무엇일까?
그럴 수 있는 수단은?
'잃어버린 시간을 찾아서'의 마들렌?
클래식이 가진 규칙과 패턴?
종교적인 무언가?
모더니즘이 존재하지 않았고, 향수를 불러일으키는 것들을 스스로 무너트린 한국에선 무엇이 가능할까?

Google I/O 2015를 맞아 [Google의 디자인 홈페이지](google.com/design/)가 새롭게 개편되었다.

한 층 더 공고해진 Google의 Material Design은 아날로그 디자인의 영역이었던 Crafting과 같은 디자인 프로세스를 디지털 디자인에 녹여내는데 성공했다. 단순하게 생각하면 Apple이 그 동안 트랜지션으로 디자인 아이덴티티를 만들어낸 것처럼 Google도 자신만의 디자인 컨셉을 구축한 것으로 보인다. 하지만 과거 Apple이 스큐어모피즘으로 아날로그 텍스처를 디지털화했던 것과는 달리 Google은 어떻게 하면 인터랙션 측면에서 피지컬한 것들을 디지털로 녹일 수 있을지 고민한 느낌이다. IoT에 주력하는 Google답다. 인터랙션 측면에서 온/오프라인을 바라보면 일련의 인터랙션 과정으로 묶어 생각해볼 수 있다. 즉, Material Design은 인터랙션 가이드를 제시함으로써 하드웨어와 소프트웨어의 디자인 언어를 통일된 Material Concept으로 표현해낼 토대를 마련한 것이다.

Making Material Design: Crafting Material - Google Design

위 영상에서는 실제 사물의 그림자를 어떻게 GUI로 녹여내는지 보여주고 있다. 단순히 보이는 것을 그대로 트레이싱하는 것이 아니라 사용자가 자연스럽게 느낄 수 있는 구조적 레이어를 구축한다. 단순히 드롭쉐도우 아이콘과 같은 트렌디한 아이콘을 만드는 것과는 차원이 다르다. Google의 Material Design은 그림자를 추가한 순간 평평한 스크린 아래로 뎁스를 만들어낸다.

사실 Google이 Material Design을 발표하기 전에도 다양한 트랜지션과 모션 그래픽을 제공하는 앱들이 많았다. 하지만 모션을 인터랙션으로 고도화 시킨 것은...

이번에는 저번 포스트에 이어 본격적으로 Origami에 대해 정리하려고 한다. 최대한 간단하게 써보겠다.

크게 두가지 부분으로 나눌 수 있을 것 같다.

• 튜토리얼을 보기 전에 읽을 부분 : 1,2,3번 파트
• 후에 읽을 부분 : 4,5번 파트

페이스북 튜토리얼은 아무래도 제작자가 만든 튜토리얼이라 어려울 수있지만 기본적인 내용을 대부분 소개하고 있기 때문에 꼭 해볼 것을 추천한다. 하지만 그 전에 나처럼 툴에 대한 지식이 전혀 없는 사람들을 위해 간단히 워크샵에서 배운 내용과 혼자 공부하면서 깨달은 몇 가지 사실들을 정리하려고 한다.

1. 기본적인 패치에 대한 이해

Patch는 색깔 별로 구분된다. 각 패치에 대한 이름은 공식적인 것은 아니며 구분을 위해 편의상 붙여 보았다.

1. Event 보라색 패치 : 각각의 특수한 기능을 가지고 있는 패치. 인터랙션이나 애니메이션을 담당한다.
2. Function 검은색 패치 : 실행에 대한 세부 설정을 추가하기 위한 패치. 트랜지션이나 수치 맵핑, 조건문, 수식이 필요할 때 이용한다.
3. Object 파란색 패치 : 화면상에 표현 되는 오브젝트 혹은 Layer들. Layer하나당 하나의 이미지나 동영상이 연결 된다. Layer를 Group으로 만들 경우 Group패치와 파란색 Layer패치를 연결해주어야만 화면에 나타난다.

대개 패치들은 아래 순서대로 이어지게 된다.

*위와 같이 보통 Interaction을 담당하는 보라색 패치 다음, 그를 전달하는 검은색 Progress 패치들, 그리고 이를 전달 받아 화면 상에 표현하는 파란색 Layer패치로 이루어진다. 이 사이에 보라색 Animation 패치가 더 추가될 수 있다.

아래는 가장 기본이 되는 패치들이다.

1. Interaction2 : 단축키...

source : Facebook Paper Official Website

작년부터 NHN NEXT에서 좋은 워크샵을 많이 제공했고 운 좋게도 그중에서 3개나 들을 수 있었는데, 그중 마지막 과정이 Origami였다. 그래서 더 늦기 전에 공부했던 것들과 공부해야겠다고 느낀 것들을 정리해보려고 한다. 단편적인 오리가미 지식을 공유하기 전에, 일단 프로토타이핑에 대한 문제 의식 몇 가지를 나의 경험에 맞추어 풀어놓으려고 한다.

프로토타이핑, 그동안의 어려움

Origami는 Facebook Creative Lab에서 만든 프로토타이핑 툴로, Quartz Composer 플러그인이다. Quartz Composer는 들어보긴 했지만 사용에 대해서는 전혀 몰랐는데, Facebook Paper를 보고 인상 깊던 차에 Paper가 Origami를 이용하여 만들어진 것을 알게 되어 언젠가 꼭 해보리라 생각하고 있었다. Paper에서 인상 깊던 부분 중 인터랙션에 관한 것만 몇 가지 꼽아보자면,

1. 버튼이 없어도 직관적이다.
2. IA를 드러내는 오브젝트들의 위계가 자연스럽다.
3. 이 모든 것이 오브젝트 단위로 움직여서 훨씬 더 다양한 인터랙션이 가능해졌다.
4. 아주 작은 인터랙션 하나에도 세밀한 트랜지션이 들어가있다.

• ref : 그당시 디자이너가 아님에도 Paper에서 얻을 수 있는 시사점을 너무도 잘 정리해주신 한운희 박사님 블로그 링크를 대신한다. > ‘페이퍼(Paper)’를 둘러싼 15가지 이야기

그밖에 말하고 싶은 것들이 너무 많지만, 결론적으로 Paper는 이전 어플에서 볼 수 없던 방식이었다. 어떻게 이런 디자인이 가능했을까? Paper의 인터랙션들은 매우 세밀했고 이러한 디테일을 만들기 위해서는 반드시 프로토타이핑 후 피드백하는 과정이 있을 것이라 생각했다. 그 배후에...

• 영화 ‘her'에 나오는 인공 지능 운영체제 '사만다'의 모습. AUI와 최소한의 GUI만 남아있다.

'미래 유망 직종'과 마찬가지로 '미래에 사라질 직업들'은 연말 연초 언론사들의 단골 뉴스 소재이다. 그 중 옥스퍼드 마틴스쿨 칼 베네딕트 프레이 교수와 마이클 오스본 교수가 발표한 '고용의 미래'라는 보고서를 살펴보자. 이 보고서에 따르면 자동화와 기술 발전으로 20년 이내, 현재 직업의 47%가 사라질 위기에 놓여있다고 한다.

직업별 컴퓨터 대체 가능성 조사

직업 중 창의성과 감수성을 요구하는 직업들은 기계화의 타격을 받을 가능성이 적다고 하지만, 실제 IT기술과 트렌드 소식을 접하다 보면 이미 많은 소프트웨어가 기본적인 디자인을 해낼 수 있는 수준임을 실감하게 된다. 가령 현재 대부분의 북 디자이너가 사용하는 Adobe의 InDesign의 경우, GREP(유닉스를 위해 만들어진 텍스트 검색 기능을 가진 명령어)을 적용시킬 수 있어 작업 효율성이 극대화됐다. 편집 디자이너가 타이포그래피와 편집에 관한 몇 가지 디자인 가이드를 세우고 글을 조판하는 작업은 기계에게 맡겨도 될 만큼, 자동화될 수 있는 요소가 많다. 이런 상황에서 '책'이라는 아날로그 소재보다 더 자동화되기 쉬운 '웹'의 경우에는 다양한 플랫폼이 등장하면서 훨씬 더 빠르게 디자이너를 대체하고 있다. 코딩이 이루어지지 않는 책의 경우, 그리드를 잡는 몇 가지 방법론이 있긴 하지만 디자이너가 임의대로 자기만의 감각을 더해 디자인할 여지가 있었다. 하지만 웹의 경우는 다르다. 규격화된 스크린과 해상도에 따라 반응형으로 작동해야 하는 웹은 그리드와 디자인 컴포넌트가 규칙적으로 조율되어야 한다. 그렇기 때문에 상대적으로 기존의 전통적인 디자인 아웃풋보다 웹 디자인이 더 빠르게 패턴화되는 경향이 있다. 현재 알려진 웹...

스킬을 비하하는 디자이너들이 있다. 하지만 스킬이란 것을 디테일이라고 치환해서 생각한다면, 스킬은 디자인에 있어 아주 중요한 요소가 된다. 어떤 Design Thinking으로 훌륭한 통찰을 해냈을지라도, 그것을 아웃풋으로 뽑아내는 과정에서 디테일을 볼 줄 모른다면, 그리고 그 디테일을 표현할 수 있는 스킬이 없다면 결국 결과물의 완성도는 떨어질 것이다. 그렇기에 Skill을 어떤 교묘한 방법 혹은 잔머리쓰는 기술로 이해할 것이 아니라 ‘디테일을 신경쓰는 섬세함'으로 이해하는 것이 더 바람직한 접근이지 않을까? 디자인 뿐 아니라 코딩도 그렇다. 기획도 마찬가지. 사용자를 세심하게 바라보는 접근, 그리고 그것을 표현하고 구현하는 것 등등 프로젝트의 모든 과정에 섬세하게 신경쓸 수 있는 부분이 있고, 이런 것들을 살릴 수 있는 전문가가 완성도 높은 결과물을 만들어낼 것이다.

더이상 새롭지 않은 역사의 시작. 끝없이 계속될 것 같은 불황의 시대. 이런 시대를 살고 있는 20대 중반이자 디자이너로서 어떤 준비를 해야하는가. 과거를 참조하고 현재를 분석하고 미래를 예측하는 블로그를 시작해본다.