AEA 컨퍼런스가 시작되기 전날 밤. 준비중인 로비 모습

AEA(An Event Apart) 컨퍼런스에 참석하기 위해 18시간의 비행 끝에 도착한 아틀랜타 인터콘티넨탈 벅헤드. 작년 FOWD(Future Of Web Deisgn) 컨퍼런스에 이어 올해 두번 째 웹디자인 컨퍼런스 참가다.

AEA(An Event Apart)는 CSS의 선구자인 에릭 마이어(Eric Meyer, @meyerweb)와 제프리 젤드먼(Jeffrey Zeldman, @zeldman)이 공동 호스트로 미국 주요 도시에서 매년 개최한다. 2일 간의 컨퍼런스와 1일의 워크샵 일정으로 이루어져 있다. 하루 6개의 세션으로 이루어져 있는 컨퍼런스에서는 각 분야 스타 웹전문가들이 웹에 대한 견해와 노하우를 발표한다.

‘웹을 만드는 사람들을 위한(For People Who Make Websites)’이라는 캐치프레이즈처럼 AEA는 웹표준에 기반한 코딩, 웹디자인, 유저빌리티, 콘텐츠등의 전반적인 내용을 다룬다.

올해 웹액츄얼리는 A Book Apart에서 출간하는 제레미 키스(Jeremy Keith, @adactio)의 <웹디자이너를 위한 HTML5>의 판권 계약을 시작으로 제레미 키스와 제프리 젤드먼과의 인연을 시작했다.

이번 AEA 컨퍼런스에서 이 두 거장을 직접 만나 한국에 출간된 책에 관한 에피소드와 웹에 관한 이야기를 나눌 생각을 하니 가슴이 설레이고 뿌듯해져 온다.

컨퍼런스 첫째 날. 시작 전의 컨퍼런스홀의 모습

첫째 날 일찍 도착한 컨퍼런스홀. 잘 정돈된 자리와 빵빵한 Wi-Fi. (국내에서는 어디가나 잘 터지는 Wi-Fi 이지만, 해외에 나가면 이런 것에 감동 받는다.) 아직까지 컨퍼런스홀이 한산한 이유는 로비에서 조식을 제공하기 때문 ^^. 그럼 멋진 하루의 시작을 위해 나도 조식을 먹으러 잠시 실례~

첫째날 조식 photo from zeldman

DAY 1.

웹디자이너가 반드시 알아야 할 점(What Every Web Designer Should Know) – by 제프리 젤드먼

제프리 젤드먼의 기조 연설

제프리 젤드먼의 기조 연설로 시작된 AEA 컨퍼런스. 젤드먼은 2일간 컨퍼런스에서 다룰 주제에 관한 자신의 견해와, 오늘 날 웹디자이너들이 갖추어야 할 스킬과 기회에 대해 연설했다. 주옥과 같은 말들이 제프리의 연설에서 쏟아져 나왔다.

반응형 웹디자인(Responsive Web Design)을 강조하며, 디바이스에 맞는 웹디자인 및 그에 맞는 콘텐츠의 중요성도 언급했다.

Devoid from content you fall back on style.
스타일에 의존하는 콘텐츠를 피하라.

Websites are simply delivery systems for content.
웹사이트는 단지 콘텐츠를 전달하기 위한 배달부이다.

또 지금은 HTML5의 대두로 인해 새로운 기술들이 하나로 집중되고 있는 시점임을 설명하고, 웹디자이너가 되기에 가장 좋은 시기임을 강조했다. 새로운 기술들을 배우지 않으면 뒤쳐질 수 밖에 없다고 당부하였다.

심리학이 디자인에 미치는 영향(The Impact of Psychology on Design – by 사라 파멘터

사라 파멘터(Sarah Parmenter)

사라(@sazzy)는 심리학적 원리가 웹디자인에 대한 관점을 어떻게 재구성시켜 줄 수 있는지에 발표했다. 속도, 단순함, 놀람, 사회적행동, 감동이라는 5가지 심리학적 관점으로 살펴본 사례를 설명하고, 심리학적 요소를 웹에 추가 해 볼 것을 제안했다. ‘우리가 가장 잘 알고 있다고 생각하는 것에 대해 전혀 새로운 아이디어를 제공할 것이다.’ 라고 제안했다.

웹타이포그라피(On Web Typography) – by 제이슨 산타 마리아

제이슨 산타 마리아(Jason Santa Maria)

제이슨(@jasonsantamaria)은 현재의 웹폰트와 타이포그라피의 웹 접근방법에 대해 논했다. 2008년 18개에 불과했던 웹폰트가 오늘날 그 수가 폭발적으로 늘어나고 있다. 이러한 웹폰트의 홍수 속에서, 웹에서 효과적으로 타이포를 사용할 수 있는 모범적 사례들을 설명했다.

Bigger is better. Always err on side of making things bigger than smaller.
큰 것이 낫다. 실수를 해도 작게 만드는 것 보다 크게 만들어서 실수하라.

Contrast is the most important tenant of design.
대조는 디자인에서 가장 중요한 요소이다.

Line length: have enough space so the eye does not get lost.
라인의 길이: 충분한 공간을 두어서 시선을 잃지 않게 하라.

모바일 웹디자인의 움직임(Mobile Web Design Moves) – by 루크 로블루스키

루크 로블루스키(Luke Wroblewski) photo from ifiamblue

루크(@lukew)는 스마트폰 사용자의 증가와 함께 모바일에서 웹콘텐츠를 읽는 사용자의 시간별 이용 패턴을 통계로 설명했다. MOBILE FIRST! 모바일을 먼저 고려하여 웹을 설계하고 콘텐츠도 모바일에 맞게 설계해야 한다고 강조했다. 모바일웹에서 흔히 저지르는 UI 실수와 스마트하게 해결할 수 있는 솔루션을 다양한 사례와 함께 설명했다.

반응형 웹디자이너의 작업흐름(The Responsive Designer’s Workflow) – by 이단 마콧

이단 마콧(Ethan Marcotte) photo from ifiamblue

이단(@beep)은 현재 진행중인 보스턴 글로브Boston Globe 신문사 리뉴얼 프로젝트에서 적용하고 있는 반응형 웹 디자인(Responsive web design)의 작업원리와 작업흐름을 설명했다. 반응형 웹디자인의 근본에는 반응형 작업 프로세스가 선행되어야 한다고 말하고, 기존 인쇄 프로세스를 답습했던 현재의 웹디자인 프로세스도 변화해야 한다고 강조했다.

연기 때문에 눈물이나요(Smoke Gets In Your Eyes) – by 앤디 클락

앤디 클락(Andy Clarke)

앤디(@malarkey)는 순수 CSS3만을 사용해서 만든 에니메이션을 보여주고, 작업 방법에 대한 노하우를 공개했다. animatable.com 이라는 온라인 CSS3 에니메이션툴을 이용해 만든 무비 타이틀 제작법을 동영상으로 만나보자.

A first look at Animatable from Andy Clarke on Vimeo.

Break Time

쉬는 시간 - 애플 로고들...

쉬는 시간 잠시 뒤를 돌아보니… 애플 로고들이 눈에 많이 들어온다. 군데 군데 아이패드, 아이폰… 한 80%는 애플인듯.

DAY 2.

유동형 박스 사용하기(Using Flexible Boxes) – by 에릭 마이어스

에릭 마이어스(Eric Meyer)

공동 주최자인 에릭 마이어스(@meyerweb)는 CSS의 대가이다. An Event Apart 사이트에 적용된 유동형 박스의 다양한 사례들을 공개했다. (이런 천재들 같으니라고… 간결하고 함축적인 그의 코드를 감상(?) 하고 있자니.. 이건 코드가 아니라 한편의 시와 같다고 해야할 것 같다.)

디자인 원칙(Design Principles) – by 제레미 키스

나의 카메라 렌즈를 발견하고 멋진 포즈를 취해 준 제레미 키스

웹, HTML5, 자바스크립트의 디자인 기본 원칙에 대해 설명하고, 각각에 맞는 목적을 설정하고 그에 맞는 기본 원칙을 만들고, 패턴을 만들어 나가야 한다고 주장했다. 때로는 너무 많은 디자인 원칙들이 사용자를 혼란스럽게 한다. 목적에 맞는 최소한의 원칙을 만드는 것이 중요하다고 설명했다.

아이디어에서 인터페이스까지 (Idea to Interface) – by 아론 월터

아론 월터(Aarron Walter)

메일침프의 UX 디자인 디렉터 아론(@arron)은 자신만의 프로젝트를 실행해 볼 것을 제안한다. 아르키메데스의 그 유명한 유레카(알았다)는 그가 일을 할 때 발견한 것이 아니다. 가장 릴렉스한 시간에 아이디어가 나왔다. 트위터, 페이스북 등의 아이디어는 일을 할때 나온 아니디어가 아니다. 나만의 프로젝트를 할 때 언제나 최고/최선의 방법을 제시할 필요가 없다. 아이디어를 내고 개발. 발전시켜나가는 과정에서 많은 것을 배울 수 있다고 한다. 아론은 아이디어를 내고 만들어가는 크리에이티브 프로세스를 위한 다양한 팁을 제시했다.

링크의 일생(The Secret Lives of Links) – by 자리드 스풀

Jared Spool(자리드 스풀)

강연 전에 옆자리 친구가 스타 강사라고 먼저 귀뜸을 해주었다. 소문대로 재미있는 외모만큼이나 가장 재미 있었던 강연이었다.

자리드(@jmspool)는 웹사이트에서 링크가 가지는 중요성을 다시 설명하고 모든 사이트에는 사람들이 방문하는 목적이 있는데, 그 목적을 정확히 파악하고 링크를 제시하는 것이 중요하다고 말했다. 이어서 링크가 가져야 할 조건과 기능을 잘못된 사례를 들어 설명했다. 연설 마지막에는 갑자기 자기도 오프라가 되고 싶다며 새로 출간될 책의 PDF를 컨퍼런스에 참석한 모든 사람에게 나눠주어 사람들에게 환호를 받았다.

콘텐츠 전략 로드맵(A Content Strategy Roadmap) – by 크리스티나 할보슨

크리스티나 할보슨(Kristina Halvorson) photo from Pete Karl II

크리스티나(@halvorson)는 콘텐츠 전략을 세우는 프로세스에 관한 전반적인 과정(컨설팅부터 보고까지)과 사례를 설명했다. 아직 국내에는 웹콘텐츠 전략 전문가가 없어서 크리스티나의 강연이 많은 도움이 됐다. 콘텐츠 전략을 위한 노하우는 질문을 많이 하는 것. 이를 바탕으로 클라이언트 회사가 가지고 있는 진정한 가치를 바탕으로 콘텐츠를 구체화 할 수 있다고 한다.

실패,DNA,깊이를 알수 없는 웹(Disaster, DNA, and the Fathomless Depth of the Web) – by 제프 밴

제프리 밴(Jeffrey Veen)

웹폰트 회사 타입킷(Typekit)의 대표 제프리 밴(@veen). 이번 컨퍼런스의 스폰서이다. 타입킷이라는 벤쳐 회사를 설립하기 까지의 수많은 실패의 연속. 그것을 기쁘게 받아들이고 하나 하나 해결해 나갔던 타입킷 맴버들의 모습에서 성공한 벤쳐 회사에서 느낄 수 있는 열정과 도전 정신을 본받을 수 있었다.

Party

파티에서 자정이 될때까지 웹의 프로세스에 관해 이야기를 주고 받았던 친구들

컨퍼런스가 끝난면 바로 스폰서에서 주최하는 이브닝 파티가 열린다. 이 파티에서는 모든 참석자들과 강연자들과의 자연스러운 대화가 이루어 진다. 컨퍼런스 강연중에 궁금했던 점, 웹 프로세스에 관한 의견, 각자의 노하우나 소스 공유 등 웹에 대한 이야기를 밤새워 이야기 할 수 있는 자리이다.

with Web Stars

도로시, 제레미 키스, 나, 리카르도

한국에서 준비해온 선물을 전달했더니 기뻐하는 제레미 키스

영국에서 AEA 컨퍼런스 강연을 위해 온 제레미 키스. 우리 회사에서 그의 책 “HTML5 FOR WEBDESIGNER”를 한국어로 번역했다고 나에 대해 소개했더니 금방 친해졌다. 트위터나 웹에서 만났던 제레미 키스는 약간 차갑고 냉소적인 인상이었는데, 실제로 만나서 대화를 해보니 감성이 풍부하고 모든 사람에게 친절한 그야말로 영국 신사였다.

장난스러운 포즈를 취해 보이는 제프리 젤드먼

제프리 젤드먼은 AEA의 호스트였기 때문에 정말 분주해 보였다. 컨퍼런스의 이모저모를 챙기고 강연 내용을 트위터에 올리고 사진 찍어서 플리커에 올리고 강사들 일일이 챙기고 참석자들의 질문에 꼼꼼히 답변해주고… 최고의 위치에 오른 사람들에게서 볼 수 있는 특유의 여유와 부지런함이 몸에 자연스럽게 베어있다. 몸으로 뛰는 그의 모습에서 열정을 읽을 수 있었다.
항상 입가에 웃음을 머금고 모든 사람을 유쾌하게 만드는 재주가 있는 제프리 젤드먼. 나를 직접 찾아와서 먼저 인사를 나누고 사진 같이 찍자고 재촉하는 그의 모습에 웃음이 절로 나왔다.

마치며…

제프리가 자신의 아이폰으로 직접 찍은 내 모습.

웹컨퍼런스에 참석하면 항상 느끼는 점이 있다. 제프리가 기조 연설에서 언급했던 “웹에서는 새로운 기술들을 배우지 않으면 뒤쳐질 수 밖에 없다”는 말이다. 이번 컨퍼런스에서도 과제를 가득 안고서 한국으로 돌아가게 된다. 이 과제들을 웹액츄얼리의 브랜드페이지 서비스에 잘 적용시켜 글로벌 스탠다드에 맞는 서비스를 해야겠다는 욕심이 든다.

추가하여..

a book apart 에서 출간된 책

AEA에서 강연한 제레미 키스, 루크 로블루스키, 이단 마콧, 아론 월터의 책을 곧 한국에서도 만나실 수 있습니다. 자세한 내용은 books.webactually.com을 방문해 주세요~

AEA 컨퍼런스의 현장 사진을 더 보고 싶으세요?
웹액츄얼리 플리커를 방문해 보세요~

Original photo from Yell Ow

AN EVENT APART(AEA) 웹디자인 컨퍼런스에 참석하기 위해 모든 업무 일정을 뒤로하고 5월 17일 아틀랜타로 출발~

아틀랜타는 뉴욕이나 로스앤젤레스처럼 한국인에게 잘 알려진 도시는 아니지만 미국에서 9번째로 큰 도시다. 미국 남동부 무역, 교통의 핵심 도시이며, 포츈(Fortune) 500대 기업 본사가 미국에서 3번째로 많다고 한다. 주요 기업으로는 코카콜라, AT&T, CNN, 홈디포(Home Depot), UPS, 델타항공 등이 있고 개인적으로 좋아하는 메일침프(MailChimp; 온라인 메일 서비스 회사)도 있다. 메일침프가 아틀랜타에 있다는 사실을 알았을 때 처음엔 의아해 했었는데… 도시 정보를 알고 보니 그리 놀랄 일도 아닌 것 같다.

컨퍼런스가 열리는 인터콘티넨탈 벅헤드(InterContinental Buckhead) 호텔에서 가까운 관광지로는 코카콜라 박물관(World of CocaCola), CNN 센터, 조지아 수족관, 아틀랜타 식물원등이 있다는 정보를 호텔에 비치되어 있는 관광책자로 확인했다. 하루밖에 없는 짧은 자유시간에 어떤 곳을 가야 할지 고민되는 순간이다.

아틀랜타 식물원에서 바라본 나무에 둘러쌓인 다운타운 스카이라인

서울처럼 높은 빌딩과 넓은 도로가 많은 큰 도시였지만 서울의 바쁘고, 복잡한 모습과는 많이 달랐다. 아틀랜타의 도시는 조용하고 깨끗하게 정돈된 편안한 느낌이었다. 이 느낌은 단순히 외국인의 방관자 자세 때문만은 아니었다. 아틀랜타는 숲속의 도시(“city in a forest”, “city of trees”)라고 불릴만큼 도시의 36%가 나무로 둘러쌓여 있다. 대형 빌딩 앞의 넓은 정원과 큰 나무들이 복잡한 도시 생활의 느낌을 좀 더 부드럽고 여유롭게 만들어 주는 것 같았다.

Lenox Square Mall

호텔에서 5분 거리에 위치한 벅헤드 리녹스 쇼핑몰. 블루밍데일(Bloomingdale’s), 니먼마르크스(Neiman Marcus), 메이씨(Macy’s) 등의 주요 백화점이 들어와있는 복합 쇼핑센터이다.

윈도우즈 매장, 애플 매장과 가장 큰 차이점은 앉을 수 있는 의자가 많다는 점.

새로나온 게임에 맞추어 단체로 춤을 추고 있는 윈도우즈 매장 직원들

아틀랜타는 현재 흑인이 가장 많이 사는 도시라고 한다. 호텔, 레스토랑, 택시, 상점 등 대부분의 서비스업에서 만날 수 있는 사람들은 거의 흑인이었다. (애플샵의 경우 백인 직원이 더 많았다.)

애플샵 전경

나이드신 분들이 아이패드에 많은 관심을 가지고 설명을 듣고 있었다

'맥북 에어 윈도우 디스플레이' - 공기처럼 가벼운 맥북에어

Downtown : Atlantic Station

아틀랜타는 크게 다운타운, 미드타운, 벅헤드(Buckhead) 비즈니스 구역으로 이루어져 있다. 도시의 기능이 한곳에 몰려 있지 않아, 러시아워 시간에도 도시가 복잡하지 않다고 택시 운전기사가 귀뜸해 주었다. 쇼핑, 문화, 레스토랑이 모여있는 아틀랜틱 스테이션, 국지성 소나기가 한바탕 지나간 후여서 한가한 모습이다.

아틀랜틱 스테이션 거리 모습

빵봉지에 직접 주문서를 쓰는 샌드위치 전문점 위치위치(which wich). 맛은 별로~

Barnes & Noble @Georgia Tech

책을 좋아하는 나는 여행을 가면 항상 그 도시의 가장 큰 서점을 찾는다. 지도를 보고 찾아간 BORDERS의 문이 닫혀 있었다. 다른 서점으로 가기 위해 택시를 타고 기사에게 이유를 물었다. 최근 부도로 인해 거의 모든 오프라인 서점이 문을 닫았다고 한다. 자신도 놀랐다고 한다. 지금 영업중인 서점중에 가장 큰 곳으로 데려다 달라고 기사에게 부탁했다. 그래서 도착한 곳은 조지아 공대안에 있는 반스앤노블. 택시 기사에게 내가 생각한 것보다 작다고 했다. 기사는 운전생활 10년동안 조지아 공대의 서점이 작다고 하는 사람은 내가 처음이라고 한다. 교보문고가 거짓말 안하고 한 5배는 큰 것 같다.

반스앤노블 조지아공대 지점 전경

반스앤노블 조지아공대점 전경 - 책이 반, 대학 홍보 잡화가 반

'이상한 나라의 앨리스'와 '허클베리핀의 모험' 책 표지

오래전에 읽은 고전이긴 한데, 표지가 너무 이뻐서 소장용으로 구입했다. 표지의 힘은 정말 강하다.

난장이들 화보집

난장이에 관한 아기자기한 일러스트레이션과 핸드라이팅에 반해서 구입한 그림책

Atlanta Botanical Garden

많은 관광객들이 코카콜라 박물관 또는 CNN센터를 방문하겠지만, 서울 도시 생활에 한참 찌들어 있던 나에게는 관광지보다 자연을 많이 느낄 수 있는 한적한 아틀랜타 식물원이 가장 매력적이었다. 35도가 넘는 뜨거운 날씨 속에서 장시간 동안 꽃을 감상하고 사진 찍느라 얼굴이 온통 땀으로 젖었다.

아틀랜타 식물원 정문

난(Orchid) 화원, 처음보는 다양한 형태와 색상의 난

다양한 색상으로 함박 피어있는 수국

아틀랜타 도시의 더 많은 사진을 보고 싶으세요?
웹액츄얼리 플리커를 방문해 보세요~

아틀랜타에서 열린 AEA(An Event Apart) 컨퍼런스 스케치가 Part 2 에서 계속됩니다.