디지털 프리랜서인 파비안 부르크하르트는 최근 스위스 스타일의 컬러 피커 사이트(swisscolors.net)를 제작했다. 스위스의 요소를 가미한 컬러 피커를 통해 미니멀한 디자인에 관한 애정을 드러낸 그와 짤막한 대화를 나눠보았다.
 
 
스위스 스타일 컬러 피커를 소개해주세요.
이것은 세계의 그래픽 디자인에 관심 있는 사람과 디자이너를 위한 도구입니다. 간단히 말하면 스위스 스타일 포스터와 예술 작품에서 영감을 받아 엄선한 컬러 조합 컬렉션이죠. 모든 색은 정육면체로 제시되어 있고 사용자는 어떤 색이든 클릭만 하면 그것의 헥스 코드를 복사할 수 있습니다.
 
 
제작 방식이 궁금합니다.
플렉스박스를 이용해 그리드를 만들었고 정육면체 형태는 CSS 셰이프(CSS Shapes)로 만들었습니다. 그레인 효과에 적합한 자바스크립트나 CSS 트릭을 찾지 못해서 포토샵으로 50% 그레이 형태를 만들고 노이즈 효과를 줬고요. 이 PNG 이미지는 10%의 투명도로 설정되어 모든 컬러 박스 위에 올라가 있는데 본래 컬러에 크게 영향을 주지 않으면서도 거칠어 보이는 착시효과를 줍니다.
 
 
사이트를 새로고침하면 컬러가 변합니다. 이 조합은 무한히 생성되나요?
컬러 조합은 다 정해져 있습니다. 스위스 스타일의 컬러 조합을 정확하게 재창조할 수 있는 알고리즘을 만들기는 어려우므로 사전에 준비된 조합들이 새로고침할 때마다 무작위로 배열되는 겁니다.
 
 
만드는 데에 시간은 얼마나 걸렸나요?
아이디어는 몇 주 동안 갖고 있었지만 다른 사람들이 컬러 피커에 관심 있을 거라고는 생각도 못 했어요. 그러던 어느 날 대학에서 전자책에 관한 강의를 듣는데 지루하더라고요. 그래서 그 강의 6시간 동안 컬러 피커를 만들었습니다. 집에 가서 컬러 조합을 구성하고 완성한 것을 다음날 업로드했죠.
 
 
제작과정에 어려움은 없었나요?
클립보드로 복사하기 기능을 위해 자바스크립트(clipboard.js)를 사용했는데 사파리에서는 온전히 지원이 안 되더라고요. 사파리 사용자를 위해 나중에 워크어라운드(workaround)를 추가했습니다.
 
 
현재까지 반응은 어떠한가요?
저는 이 작은 도구가 이렇게까지 큰 흥분을 불러일으킬지 상상도 못 했어요. 한 달간 사이트 방문자 수가 약 100,000명에다가 이에 관한 블로그 포스트를 많이 보기도 했고 우호적인 이메일을 받으며 디자이너와 웹 커뮤니티 사이에 엄청난 협력이 이뤄지고 있음을 몸소 느꼈습니다.
 
 
 
 
 
파비안 부르크하르트
FABIAN BURGHARDT

FABIANBURGHARDT.DE
 
 
 
 
 
 
 
 
 
 
 
이 기사는 ‘CA 2016년 4월호 : 가장 영향력 있는 디자이너 20인’에 실린 내용입니다.
 
CA_221_201604_WEB