[Interview] CA Korea – DDANGA

News | April 9, 2014 | 1 Comment
IMG_0769
흐르는 갤러리

디자인: 조상희
DDANGA.COM
&
개발: 김종민
CMISCM.COM


땅아(DDANGA) 프로젝트
디자이너 조상희가 포트폴리오 웹사이트를 디자인하였다. 사이트의 전체적인 컨셉은 ‘흐르는 갤러리’이다. 갤러리 섹션에서는 이미지, 동영상, 시퀀스, 세 가지의 형식으로 작품들이 전시되고, 프로젝트 섹션에서는 각각의 프로젝트들을 일러스트 아이콘으로 상징화하여 재미를 주었다. 블로그 섹션의 이미지 프레임은 그녀의 닉네임인 ‘땅아’의 한글 형상을 모티브로 작업하였다.

이 사이트의 특이한 점은 메뉴 대신, 갤러리, 프로젝트, 블로그의 세 가지 작업의 공간을 한곳에 모아서, 마치 미술관에서 지도를 보고 전시장을 찾듯, 맵 페이지를 통해 각각의 페이지를 찾아갈 수 있게 하였다. 또한 세 가지 작업에 배치된 동물 아이콘이 네비게이션 역할을 수행한다.

“프로젝트 섹션은 제가 가장 좋아하는 작업인 일러스트 작업으로 꾸며보고 싶었어요. 그래서 각각의 프로젝트에 맞는 주제를 정해 이미지를 아이콘으로 만들어보았죠.” 조상희가 프로젝트 아이콘에 대해 설명한다. 그녀는 아이콘 작업을 하는 도중, 아이콘을 스티커로 만들어보면 어떨까, 하는 생각에 <히어로즈 프로젝트>를 진행하기도 하였다. 또한 스티커.js(stickers.cmiscm.com)라는 자바스크립트 라이브러리 프로젝트로 발전시키기도 하였다.

개발을 맡은 김종민은 HTML5와 PHP로 사이트를 제작하였다. 또한 아이패드에서의 구동에 신경 써, 부드러운 움직임을 위해 애니메이션의 디테일과 코드의 최적화에 중점을 두고 작업을 진행했다. 전체적인 움직임은 CSS 트랜지션(Transition)을 사용하였으며, 물결 애니메이션과 갤러리 시퀀스 부분은 캔버스 드로잉(Canvas Drawing)을 사용하여 성능을 향상시켰다.

PRESS

FFF now updated to support mobile devices!

Lab | April 6, 2014 | Comment

IMG_0637

[Speaker] Improve animation performance

News | March 20, 2014 | Comment
l1
a2
a3
a4
a5
a6
a7
a8
a9
k1
k2
k3
k4
k5
c2
c3

SPEAKER

  • Google, Mountain View – March 2014