지난 번 미디어 아트 동영상에 이어, 오늘은 UI 인터랙션 시연 동영상들을 보려합니다. 이미 보편적인 UI 인터랙션에는 눈이 익을만큼 익어버렸죠. 그래서 독특한 UI 인터랙션을 공유해드립니다.^^ 1. Katachi Heroine Issue 1 Katachi는 분기별로 발행되는 패드용 매거진 앱입니다. 아래 동영상은 2011년 11월에 첫발행된 매거진 시연 영상이고요. 크고 작은 UI 요소들에 신선한 인터랙션이 인상적인 앱입니다. from : Katachi Mag 출처 http://katachimag.com/videos/heroine-fashion/ 2. Poly / Pixl INNOIZ사에서 만든 Poly와 Pixl 앱입니다. 이 두 앱은 간단한 조작을 통해 사진을 기하학적인 이미지로 변환해주는 앱입니..

한 달에 한 두 번씩 명사 분들의 경험과 좋은 생각을 공유하는 pxd talks. 이제는 사내 강의에서 벗어나 외부 초청도 같이 진행하며 보다 많은 분들과 함께하는 뜻 깊은 시간이 되어가고 있습니다. 2013년의 첫 번째 pxd talks 시간은 새해를 맞아 처음 진행된 강의라는 것과 함께 특히 참여 열기가 뜨거웠는데요, 바로 국산 토종 앱으로는 드물게 미국 앱스토어 메인에 소개되며 뜨거운 반응으로 큰 화제를 몰고 온 Phoster 앱 개발 이야기를 들을 수 있는 시간이었기 때문이었습니다. Phoster 앱. 아직 모르신다면 이제부터 Phoster 앱 개발사 Bucket Labs의 심찬용 대표님이 전하는 Phoster 앱의 개발 과정과 흥미진진한 미국 앱스토어 입성기를 들어보겠습니다. 1. Photo +..

메뉴에서 2차적으로 나오는 서브 메뉴를 표시할 때, 대충 만들면 생각보다 큰 낭패를 당하게 됩니다. 저희 블로그에서도 이 문제를 여러 차례 지적했었는데요, 공군 가기 힘들어(Global Navigation Bar 디자인)에서, 메뉴 경로를 너무 좁게 만들었다가 망신 당한 공군 웹페이지를 보여 드리고 그 근본 원인을 알려드렸구요, 피츠를 알려주는 퀴즈 (A Quiz Designed to Give You Fitts)에서는 이 문제를 해결하기 위해, 맥과 윈도즈가 어떻게 다르게 접근하였는가를 설명했습니다. 지난 3월 6일 발표되어 많은 인기를 끌고 있는 Ben Kamens님의 아마존 메가 드롭다운 분석(BREAKING DOWN AMAZON'S MEGA DROPDOWN)은 메뉴 UI에서 꼭 알아야할 이 문제를 ..

pxd library에는 보석같은 책들이 곳곳에 숨어있다. 어느날 PM의 역할에 대해서 고민하던중 이 책을 library에서 접하게 되었다. 이 책의 주인공 '보 스캠베클러' 감독은 20년간 234승, 승률 85%라는 대 기록을 세운 미시간대학교 풋볼팀의 전설적인 감독이다. 이 책을 읽고 나서 느꼈던 교훈은 명료했다. 나에게는 초심으로 돌아가서, UX를 하게 된 열정에 대해서 다시금 생각하게 된 계기가 되었다. 또한 나 스스로에게 엄격한 사람이 될 수 있도록 노력해야겠다는 생각이 들었다. (물론 풋볼팀의 감독과 실무 중심의 PM의 상황에 동일하게 적용하기 어려운 부분도 있다.) 이 책을 읽게되면 각자 느끼는 바가 다를것이다. 좋은 리더가 되기 원한다면 꼭 읽어보기를 권한다. 또한 예전에 Kyoung ho..

지난 번 인터랙션을 이용한 홍보 영상에 이어, 오늘은 미디어아트 영상을 공유하려합니다. 여전히 프로젝션과 스크린 안팎에 묶여있는 작품들이 많지만.. 언젠가는 이 제한선을 깨부수는 작품이 나오길 바라며~ 가벼운 마음으로 한번 보실까요? 1. Pool Party from : Red Paper Heart music : Talamak - Toro Y Moi 출처 http://redpaperheart.com/work/poolparty Interactive Media art 2. Augmented Shadow_2010 form : 문준용 출처 http://joonmoon.net/Augmented-Shadow Interactive Media Canvas 3. IRIS_2012 Interactive Media Can..

지난 1월 30일, HCI korea 2013에서 pxd 동료들과 함께 아이데이션 워크샵을 진행했었는데요. 간단한 후기와 현장 사진들 그리고 장표를 공유합니다. 워크샵에 대한 목적과 구성은 아래와 같습니다. 최근 pxd에서는 실무에서 다수의 Ideation Workshop을 진행하였습니다. 이 중 결과가 좋았던 수평∙수직 사고기법을 활용한 Intensive Workshop 노하우를 공유하려고 합니다. 이 방법은 창의력 사고 기법의 권위자 에드워드 드 보노 박사의 수평적 사고 기법과 IDEO의 브레인스토밍 프로세스를 기반으로 하고 있으며, pxd만의 방식으로 응용 및 발전시켰습니다. 이 방법으로 단시간에 참가자들의 발상 범위를 넓히고 산출된 아이디어를 의미있는 수준으로 올릴 수 있습니다. 워크샵의 구성은 ..

'심리학 산책'은 UX 디자이너를 위해 심리학 책들을 총 10회에 걸쳐서 소개하는 연재입니다. 연재 의도와 전체 책 목록은 아래 글을 참고하세요. [연재 소개] UX 디자이너가 읽어야할 심리학 책 10가지 보이지 않는 고릴라 우리의 일상과 인생을 바꾸는 비밀의 실체 - 크리스토퍼 차브리스,대니얼 사이먼스 지음 / 김명철 옮김 The Invisible Gorilla And Other Ways Our Intuitions Deceive Us - by Christopher Chabris and Daniel Simons 이 책을 아직 읽지 않은 분들은 먼저 실험 하나를 직접 체험해 보세요. 바로 여기서 간단하게 참여할 수 있습니다. 이 실험은 주의력에 대한 실험입니다. 실험은 동영상을 보면서 진행됩니다. 동영상이..

지난 2월 14일에는 심리학 산책의 첫 번째 독서 토론회가 열렸습니다. 참가자는 블로그에 도서 연재를 해주시는 마음경험님 외 pxd 사내 직원들을 포함한 총 17명으로, 저의 예상인 5~7명을 훌쩍 넘는 열광적인(?) 반응이었습니다. 독서 토론회는 총 4개의 세션으로 나누어 - SESSION 1 : 도서 리뷰 - SESSION 2 : 느낌, 흥미로운 점 및 질문거리 공유 - SESSION 3 : 공통되거나 흥미로운 주제 2-3가지를 선정하여 질의 응답과 논의 - SESSION 4 : 정리 를 하는 방식으로 진행되었습니다. 본 포스팅에서는 토론회 현장 모습과 주요 내용을 소개하고자 합니다. 첫 독서 토론회의 책은 블로그에도 소개되었던 입니다. 한 달 전부터 pxd 인들에게 참여 신청을 받고, 주기적으로 책..

2012년의 기록의 담은 pxd의 ANNUAL STORY 가 완성되었습니다. 보통의 ANNUAL REPORT란 기업의 1년동안의 연차 보고서로 결산기가 끝난 다음 해당 1년간의 실적, 기말 시점에서의 재정상태등을 망라한 보고서 일반적으로 통용되는 애뉴얼 리포트의 뜻은 위와 같지만, pxd의 주주분들(?)에게 보고할 것도 아니고, 이미 pxd의 훌륭한 회사 소개서가 있기때문에 어떤 애뉴얼 리포트를 만들어야 하는지, 누구에게 무엇을 보여줄 것인가부터 고민을 시작했고, 결론적으로 pxd의 대표적인 홍보 수단이자 기록물인 블로그를 기반으로 하되, 블로그가 미처 담지 못하는 뒷이야기와 책이라는 매체가 갖는 물성을 살려 2012년 한해를 돌이켜 보는 ANNUAL STORY를 제작하였습니다. 2012 pxd ANNU..

지난 번에 기하학 도형을 이용한 모션그래픽에 이어, 이번에는 인터랙션을 이용한 홍보 영상을 모아 보았습니다. [인터랙션]_Promotion video / Video sketch 이번에는 UI 인터랙션에 관한 영상을 공유할까 합니다. 프로모션 비디오, 데모, 및 비디오 스케치 영상입니다. 머리가 복잡할 때 리프레쉬 겸 가볍게 즐기면서 보셨으면 하는 바램입니다.^^ video sketch 1. Spatially aware devices from : Ishac Bertran / http://www.ishback.com/ 출처 http://blog.ishback.com/?p=1025 promo video 2. Reader from : Marcus Eckert promo video for Zinio's updat..

1탄 기본적인 전통 UI 용어와 2탄 최근 웹에서 많이 사용되는 UI 용어에 이어, 이번에도 웹과 앱에서 많이 사용하는 UI 용어를 좀 더 알아보도록 하겠습니다. 관련 글 ▷ UX 신입 디자이너가 알아야 할 UI디테일 용어 1탄 ▷ UX 신입 디자이너가 알아야 할 UI디테일 용어 2탄 ▷ UX 신입 디자이너가 알아야 할 UI디테일 용어 3탄 ▷ UX 신입 디자이너가 알아야 할 UI디테일 용어 4탄 1. 라이트 박스(Light Box) 팝업이 뜨는 동시에 백그라운드 화면이 어두워지거나 밝아지는데, 이를 '라이트 박스'라고 부릅니다. 라이트 박스 처리된 영역은 컨트롤 할 수 없으며 사용자가 대화 상자에 집중해야 한다는 시각적인 알림을 제공합니다. 일종의 Modal Dialog(혹은 Modal Window)라..

pxd 사무실에는 회의실 복도를 따라 책장이 있습니다. 책의 이미지들에 영감을 받아 바로 모니터상에 스케치를 하는 경우가 많은 GUI디자이너들에게, 복도 책장은 물리적, 심리적으로 멀게 느껴졌습니다. 그래서 새로 구매한 책을 비롯해 몇가지 유용한 책들을 추려 GUX센터 자리에서 볼 수 있도록 'GUI디자이너들을 위한 이동식 책장'을 장만했습니다. 이미지출처 : http://www.ply.co.kr/product/shelves/04_c2.php - 초기 - 처음엔 단순히 그래픽 도서를 추려 책장에 꽂고 리스트를 만들어 붙여 놓았는데 예상했던 문제점들이 나타났습니다. ㄱ. 도서 이탈 ㄴ. 도서 분실 ㄷ. 대출자를 알 수 없는 대출 ㄹ. 도서 이용 후 정돈이 안 되는 점 ㅁ. 정돈을 하려 해도 이탈된 도서가 ..