관심사 중에 하나인, 매거진 스타일 웹 출판쪽에서 아주 흥미있는 제품이 나왔습니다.

이름하여 Flipboard for iPad (http://flipboard.com), 일명 소셜매거진.  iPad용 앱으로, flipboard에서 제공하는 미리 준비된 매거진(스타일로 생성된 웹)을 볼수도 있고, 자신의 twitter 팔로어와 facebook 친구들이 연결하거나 공개한 내용을 이용해서, 역시 보기좋은 매거진 스타일로 보여주기도 합니다.

(이미지 출처: flipboard.com)

초기화면의 보기좋은 켄번즈 효과나는 이미지들이나, 각 페이지에 잡지형태로 정렬되어 있는 내용을 클릭했을때 보여지는 트랜지션, 시간대별로 생성된 내용을 볼 수 있는 하단의 썸네일등,  기존 페이퍼매거진의 장점과 웹베이스 매거진의 장점을 잘 섞어놓은 듯 합니다. 게다가 무료입니다.. 아직은..

비슷한 형태의 시도로 프로토타입 형태로 제안되었던 Mag+ (이후 Popular Science용 앱에 적용)와 비교해볼만 할것 같습니다.

Meet Flipboard on YouTube.

Mag+ from Bonnier on Vimeo.

종이천하의 초기화면이나, 테마별 화면으로 비슷한 구성을 찾던 나에게 또하나의 자극제가 되었고, 비슷한 효과, 특히 트랜지션의 효과를 낼 수 있는 javascript을 찾아보았습니다.  비슷하지는 않지만, 그중 jQuery기반 Quicksand가 눈에 들어왔습니다.  html의 li 항목들(특히 이미지들)을 부드러운 트렌지션을 통해서 바꿔치기해주는 효과로서, 애플 프로그램인 AppZapper의 효과를 웹에서 구현하였다고 합니다. Quicksand의 동영상은 없지만, AppZapper의 동영상을 보면 어떤 효과인지 알수있을것 같습니다.

궁극적으로는 Flipboard같은 매거진 스타일의 페이지 구성이 목적이고, 현재는 Quicksand를 이용해서 종이천하에 등록된 전개도를 꼬리말별로 보여주는 페이지를 구성해봤습니다.  http://finalpaper.net/lab/magazine.php .  Default로 ‘스타크래프트’로 등록된 전개도들을 보여주고, 같이 등록된 다른 꼬리말들을 선택하거나 다운로드 수, 완성작 수로 정렬할 수 있게 했습니다.  ’?tag=꼬리말’ 옵션으로 원하는 꼬리말을 볼 수도 있습니다.  (예: 동물로 등록된 전개도들 - http://finalpaper.net/lab/magazine.php?tag=동물).

(Transition between sort by #downloads and #galleries)

Comments

One Response to “Flipboard for iPad 그리고 Quicksand”

  1. Automatic Magazine Layout : J2Paper on September 1st, 2010 8:46 am

    [...] Flipboard for iPad 그리고 Quicksand [...]

Leave a Reply