Lensa AI Magic Avatar: 수백 수천의 AI가 그려주는 초상화

Lensa AI의 새로운 기능 매직 아바타 Magic Avatar가 엄청난 인기입니다. 미국 앱스토어 1위를 Lensa AI가 유지하고 있으며 기능 업데이트 후 첫 11 동안 무려 1,260만개가 설치됐습니다. Leansa AI는 이미지 편집 앱으로 2018년에 출시했으며 최근 오픈 소스 Stable Diffusion 모델을 이용해 매직 아바타 기능을 만들었습니다.

매직 아바타는 자신의 사진 10~20장을 업로드하면 디지털 아티스트가 만든 것 같은 초상화를 만들어줍니다. 7일 무료 평가판으로 체험할 수 있으며 시간이 지나면 39.99달러가 결제됩니다. 나만의 매직 아바타를 만들기 위해 인앱 결제도 할 수 있습니다.

선풍적인 인기의 이면에 위험성에 대한 비판도 제기됩니다. 원작자의 동의 없이 이미지를 사용해 모델을 학습시킨 것과 NSFW(Not Safe for Work) 이미지를 생성하는 것이 대표적인 현상입니다.

현재 AI 이미지 제작 도구는 타인의 저작권에 대한 애매한 선을 넘나들고 있습니다. Stable Diffusion 모델은 아티스트가 오랜 시간을 들여 계발한 지식 자산을 손 쉽게 복사할 수 있습니다. 타인의 노하우로 수익을 창출하는 것은 결과물을 훔치지 않고 만드는 법을 훔치는 것이겠죠.

개인 정보에 대한 관점도 달라질 수 있습니다. 지금까지는 개인 정보가 유출되어도 스팸이 늘어나는 수준이었지만 개인 정보를 획득하기 쉽고 재생산하기도 쉬워지면서 지금보다 더 위험한 상태가 될 것입니다. 쉽게 말해 내 사진과 영상으로 도대체 무엇을 만들지 아무도 알 수 없는 상태가 된 것입니다.

윤리적 문제로 기술 성장이 멈추진 않았던 것 같습니다. 흥미로운 기술로 어떻게 우리에게 더 나은 가치를 제공할 것인가?에 대한 대답이 꼭 필요하겠다는 생각이 듭니다.

더 보기 및 출처

비슷한 글

최근 글

Spotify Wrapped 2022

스포티파이에서 Wrapped 2022를 출시했습니다. 아티스트와 팟캐스터를 위한 경험이 뛰어납니다. 단순히 한 해를 요약하는 것 이상으로 사람들가 가지고 놀 거리를 주는 것이 인상적입니다.

스포티파이는 2017년부터 Wrapped를 이어 왔습니다. 작년 Wrapped에서는 청취 행동으로 두가지 기분을 보여주는 Audio Aura 기능을 제공했습니다. 올해의 경험은 listening personality입니다. 스포티파이가 만든 16가지 성격 유형 중 하나로 변환되는 4문자 조합을 도입합니다. 한국에서도 어마어마하게 유행한 MBTI 같은 느낌입니다.

내 청취 개성을 카드로 친구들에게 공유할 수 있습니다. 스냅챕이나 GIPHY, 로블록스, 틱톡 등 다양한 채널을 통해 공유하는 경험을 제공합니다. 아티스트의 감사의 말을 보여주는 것도 좋은 경험입니다.

Wrapped는 스포티파이 모바일 앱에서만 경험할 수 있습니다.

더 보기 및 출처

비슷한 글

최근 글

Youtube Music 2022 Recap

유튜브가 2022 Recap을 공개했습니다. 이번에는 유튜브 뮤직 앱 뿐만 아니라 기본 유튜브 앱에서도 경험할 수 있습니다.인기 트렌드에서 다른 사용자보다 내가 먼저 발견한 아티스트를 확인할 수 있습니다. 내 청취 습관에 맞춰 ‘Identity’을 받을 수도 있습니다. 저는 덜 알려진 음악을 좋아하는 사람이라고 하네요.

유튜브 뮤직에서는 다른 음원 서비스에서 찾기 어려운 리믹스와 라이브 공연 등 희귀한 콘텐츠가 있습니다. 이번 Recap에서 오직 유튜브에서만 찾을 수 있는 음악 중 장 사랑받은 음악을 공유합니다. 각 시즌의 인기 곡을 구글 포토에서 편집해 카드로 만들어 공유할 수 있습니다.

유튜브 ‘2022 Recap’은 iOS 또는 Android의 YouTube 앱으로 이동하여 ‘2022 Recap’을 검색하여 Recap 여정을 시작할 수 있습니다.

더 보기 및 출처

비슷한 글

최근 글

닥터 나우: 집에서 진료 받고 약 받고

아플 땐 닥터나우 병원과 약국이 찾아갑니다.

닥터나우는 비대면 진료와 처방약 배달 서비스를 제공하는 원격 의료 플랫폼입니다. 배송비가 유료며 1만원을 닥터나우와 소비자가 반씩 부담합니다. 건강을 관리하고 각종 질환 예방하는 등 헬스 케어 전반을 아우르는 서비스로 성장하는 것을 목표로 합니다. 2020년 11월 출시했으며 iOS와 안드로이드 플랫폼에서 제품을 제공합니다.

환자가 병원에 가지 않고 전화나 화상으로 진료 받고 처방전을 받을 수 있습니다. 처방 받은 약을 약국에서 수령하거나 닥터 나우와 계약한 배송 드라이버를 통해 퀵이나 택배로 배송받습니다. 24시간 전문 의료진과 실시간으로 상담할 수도 있습니다. 질문을 올리면 5분 이내로 의사나 간호사가 답글을 답니다.

진료 신청 경험

실시간 무료 상담

키 비주얼

더 보기 및 출처

소문 날대로 난 애플 페이 : 드디어 한국에서도

애플 페이 도입이 기정 사실화된 것 같습니다. 애플 페이는 2014년부터 애플이 제공하는 간편 결제 서비스입니다. iOS의 기본 애플리케이션인 Apple 지갑에서 사용할 수 있습니다. P2P 송금 기능인 Apple Cash도 있습니다. 글로벌 카드 거래의 5%를 차지하며 전 세계 iPhone 사용자의 반이 사용한다고 합니다. 현대카드의 유출된 약관 드디어 한국에서도 애플 페이를 경험할 수 있게 될 것으로 보입니다. 삼성 페이와는 사용 경험이 다르고 호환이 떨어져 불편할텐데 현대카드와 어떤 식으로 풀어냈을지 궁금합니다.

실물 카드를 사용하듯이 사용하면 됩니다. 아이폰의 지갑 앱에 기존에 사용하는 카드를 추가하고 아이폰이나 애플 워치의 측면 버튼을 두번 눌러 결제할 수 있습니다. 애플이나 판매자가 카드 번호를 알 수 없어 안전합니다. Cash에서도 비공개로 유지됩니다. 개인 정보에 신경 쓰는 애플의 정책이 진하게 드러납니다. 애플 캐쉬 앱을 이용해서 송금도 할 수 있습니다. 다양한 혜택을 주는 애플 카드만큼의 혜택이 현대 카드가 제공한다면 멋질 것 같네요. 앞으로 애플 금융이 성장해 애플 지갑, 애플 카드, 애플 캐쉬를 모두가 연결된 결제를 경험하는 것이 기대됩니다.

더 보기 및 출처

투굿투고: 남는 음식 사가세요!

투굿투고는 식당, 식료품점, 제과점의 남은 음식을 30%정도 저렴하게 판매하는 서비스입니다. 투굿투고는 2016년 덴마크 코펜하겐에서 설립됐습니다. 전 세계 음식물 폐기 문제를 해결한다는 목표로 소비자와 식료품점을 연결하는 서비스를 제공 중입니다. 지도에서 가까운 음식점을 확인하고 음식을 구매한 뒤 모바일 영수증을 보여주면 됩니다. 서프라이즈 백이라는 이름으로 정확히 어떤 음식을 받을지 알 수 없지만 앱에서 음식을 확인할 수 있는 것을 매직 백이라는 이름의 랜덤 박스 이벤트도 있습니다.

지구의 환경 문제가 점점 심각해지고 있는데요, 그 중 우리 생활 속에 음식물 쓰레기를 줄일 수 있는 노력이 늘고 있는 것 같습니다. 투굿투고는 유럽에서는 일상적인 서비스라고 하는데요, 만약 한국에서 서비스한다면 어떤 경험이 될가요? 직접 해먹는 것보다 배달해 먹는 것이 강세인 상황에서 남는 식재료나 음식을 사는 것이 임팩트를 낼 수 있을지 궁금하네요.

더 보기 및 출처

디자이너가 해석한 Google Search on 22

지난 9월 29일 구글에서 상자 밖의 검색 Search outside the box 이라는 이름으로 구글 서치 온 22 Google Search on 22를 발표했습니다. 검색의 제왕인 구글이 상상하는 정보 탐색의 미래를 엿볼 수 있는 발표였습니다. 틱톡, 아마존과 같은 서비스의 위협 속에서 구글 검색이 지향하는 방향을 대표하는 여러 기능을 발표했습니다. 그 중심에는 ‘시각’이라는 키워드가 있었습니다. 시각 탐색, 구글 지도, 음식, 쇼핑, 지속성, 안전을 주제로 약 50분가량 발표했습니다. 디자이너의 관점으로 이번 발표에서 발견한 인상적인 경험의 변화에 대해 정리했습니다.

후기와 정보 이상의 지역 검색

구글 지도는 전세계에서 사용하는 강력한 서비스 중 하나입니다. 지역에 대한 정보를 찾을 때 평면 지도와 실제 현실의 격차를 크게 줄이는 기능이 추가됩니다. 크게 동네 분위기 Neighborhood vibe, 이머시브 뷰 Immersive View , 라이브 뷰 Live view 기능이 추가될 예정입니다.

동네 분위기 Neighborhood Vibe는 구글 맵을 사용하는 사용자가 올리는 여러 콘텐츠와 AI를 결합해 가장 트렌디한 장소나 꼭 방문해야할 곳을 알려줍니다. 이머시브 뷰 Immersive View는 도시 AI 기술을 이용해 스트리트뷰, 항공 이미지, 날씨, 교통 등 정보를 결합해 해당 지역의 전체적인 모습을 조망할 수 있습니다. 과거 정보를 바탕으로 미래에 지역의 모습이 어떻게 될지도 볼 수 있습니다. 라이브 뷰 Livew View는 이동 중에 카메라를 이용해 원하는 정보를 찾을 수 있습니다. 평면 지도와 실제 세상을 비교하면서 도대체 어디에 가게가 있는지 찾을 필요가 없어집니다.

지역 기반 검색 경험 중 인스타그램이 추가했던 지역 검색이 아쉬움이 있었는데 구글 맵이라면 어떤 경험을 할 수 있을지 기대가 됩니다. 인스타그램은 인플루언서의 콘텐츠 위주라 위치 맥락의 탐색이 강력하지 않았는데, 구글 지도는 태생부터 위치를 찾기 위한 서비스이니 그 과정을 줄이는 업데이트가 큰 역할을 할 수 있으리라 생각이듭니다. 후기만으로는 알 수 없는 정보가 채워진 지역 검색 경험이 기대됩니다.

쇼핑의 미래

구글과 아마존의 경쟁은 모두 익히 알고 있을 것입니다. 아마존이 구글의 검색 광고 비즈니스에 많이 침투했기 때문에 구글은 역으로 쇼핑에 많은 투자를 하고 있습니다. 아마존 대신 구글에서 쇼핑하게 만들기 위한 고민이 담긴 기능을 발표했습니다. Shop Look 기능은 구글 검색 결과의 이미지에서 내가 살 수 있는 제품을 바로 보여주는 기능입니다. 이미지에 해당한느 상품 정보와 링크를 올려야 했던 것을 이제는 이미지를 해석해 자동으로 추가 정보로 연결하는 기술입니다. 또한 상품을 둘러볼 수 있는 3D 기능도 추가 예정입니다. 소수의 소매 파트너와 테스트를 해볼 예정이며 머신 러닝으로 몇 장의 제품 이미지를 이용해 3D 이미지를 만들어준다고 합니다.

물건을 산다는 경험과 정보를 찾는 경험은 다릅니다. 물건을 쓰는 순간을 상상하고 돈을 지불하는 것과 물건에 대해 지식을 쌓는 것은 차이가 있죠. 이번 업데이트는 정보를 탐색하기 좋아지지만, 쇼핑 경험에는 어떻게 연결될지 아직은 상상이 되지 않습니다. 정보를 탐색하고 나서 상품을 살 때는 더 싸거나, 더 빨리 도착하거나, 더 포인트가 많이 쌓이는 곳에서 구매한 경험이 많을 것입니다. 상품을 구매하게 만드는 것은 좋은 사용성 이상의 기능이 필요할 것입니다. 과연 구글은 트래픽과 좋은 사용성을 구매로 연결할 수 있을까요?

실제 세계에 성큼 다가가는 검색

멀티 서치 Multi search는 구글 렌즈 Google Lens로 텍스트와 이미지를 동시에 검색할 수 있는 기능입니다. 지금까지는 구글에서 무언가를 찾으려면 글자를 입력해야했는데 이제 글자를 입력하지 않아도 검색할 수 있는 경험으로 진화하고 있습니다. 내가 찾으려는 대상이 무엇인지 잘 몰라도 사진으로 관련된 정보를 찾을 수 있게 되는 것입니다. 이번에 발표한 멀티서치 니어 미 Multisearch Near Me는 이 멀티 서치 방식으로 근처에 있는 지역까지 연결하는 기능입니다. 의류 쇼핑을 중심으로 옷 이미지와 색 등의 정보를 조합해 검색하는 것부터 적용하고 있는데, 영역을 더 확대해 처음 보는 요리도 어느 나라의 어떤 음식인지 알고, 심지어 그 요리를 제공하는 근처 가게도 손 쉽게 찾을 수 있게 되는 것입니다.

실제 세계와의 연결을 강화하기 위한 기능이라는 생각이 들었습니다. 우리가 정보를 찾을 때 단어만으로 찾지 않듯이 다양한 방식으로 정보를 입력할 수 있게 개선이 되고 있고, 입력한 정보를 바탕으로 오프라인 공간에서 정보를 찾고 이동하는 것까지 경험에 집중하고 있다는 생각이 들었습니다. 아무리 디지털 환경이 발달한다 하더라도 우리의 신체가 없어지는 일은 없을 것이며, 신체가 있는한 반드시 수반되는 활동에 투자하는 것은 자연스러운 흐름인 것 같습니다.

토스 모바일: 이제 통신사까지

토스 모바일: 이제 통신사까지

토스에서 모바일 요금제 서비스의 오픈 알림을 열었습니다. 오픈 알림을 신청하면 토스모바일을 더…

GOOD EAT’N: 눈으로 느끼는 맛

GOOD EAT’N: 눈으로 느끼는 맛

Good Eat’n은 또띠야 칩, 팝콘, 도넛 퍼프 맛이 나는 식물성 간식을 팝니다.…

Odio: 편안한 소리의 누에고치 들어가기

Odio: 편안한 소리의 누에고치 들어가기

Odio는 Volst, Joon Kwak, MAx Frimout가 만든 애플의 공간 오디오를 활용한 AR…

마이리얼트립: 새로운 숙소 예약, 새로운 비주얼 언어

마이리얼트립: 새로운 숙소 예약, 새로운 비주얼 언어

이제 마이리얼트립에서 60만이 넘는 해외 숙소를 직접 예약할 수 있습니다.다양한 플랫폼을 통해…

브런치 앱 업데이트: 직관적으로 바뀐 탭

브런치 앱 업데이트: 직관적으로 바뀐 탭

지난 달 브런치가 앱을 리뉴얼했습니다. 가장 영향력이 큰 탭과 메인이 바뀌었습니다. 브런치…

Play the Sansoo: 내가 그린 산수화로 만드는 국악

Play the Sansoo: 내가 그린 산수화로 만드는 국악

<play the 산수>는 오색빛닮, Jellypri, 이정연이 함께 만든 온라인 예술 프로젝트입니다. 산수화를…

더 보기

점성술 클럽: 내 별자리에 어울리는 플레이리스트

점성술 클럽 Astrology Club은 2022년에 연 스포티파이의 팟캐스트 허브입니다. 나 자신을 발견하고 관계를 강화해 잠재력을 넓힐 수 있는 툴이라 소개합니다. 몇가지 질문에 대해 답하면 내게 어울리는 플레이리스트를 추천합니다. 유명 점성술사 인플루언서인 아멜리아 퀸트 Amelia quint, 알리자 켈리 Aliza kelly가 데이팅 서비스인 범블 Bumble과 협업해 별자리별 데이트 팁을 공유하고 각자의 팟캐스트를 공유합니다.

음악을 넘어 팟캐스트를 점유하려는 스포티파이의 목적을 제품으로 풀어낸 것 같습니다. 얼마전 유튜브가 만든 점성술 서비스도 생각나네요. 이런 방식으로 본래 서비스에 기능을 추가하기보다 웹 제품을 만들어 고객에게 테스트하는 것이 영리합니다. 미려한 색과 부드러운 인터랙션이 아름답습니다. 별자리를 표현하는 아트워크와 숨겨진 인터랙션이 많으니 꼭 경험해보세요.

더 보기 및 출처

디자이너가 해석한 iOS 16의 주목할만한 UX

iOS 16을 업데이트했습니다. WWDC22에서 공개된 iOS 15의 차세대 버전으로 한국 표준시 KST 기준 2022년 6월 7일 오전 2시에 공개됐으며, 2022년 9월 13일 오전 2시에 정식 배포되었습니다. 이번에 발견한 인상적인 UX와 기대되는 점에 대해 정리해봤습니다.

내게 맞는 홈 만들기

이번 버전의 가장 인상적인 변화는 홈과 잠금 화면입니다. 원하는 서체를 고를 수 있으며 위젯에는 캘린더, 배터리량, 날씨 등 유용한 정보를 한눈에 확인할 수 있습니다. 배경 이미지는 시간에 따라 동적으로 변합니다. 아이맥, 맥북의 다이내믹 월페이퍼 기능이 이제 아이폰에도 적용되었습니다.

이제 아이폰 내에서 터치 몇번으로 사진에서 원하는 영역을 잘라낼 수 있기 때문에 편집한 이미지를 이용해 잠금 화면에 고정되어 있는 시계나 상태 표시 영역보다 위에 배치해 깊이를 표현할 수 있게 되었습니다. 스마트폰을 움직여야 느낄 수 있었던 이전의 심도 효과보다 훨씬 더 극적으로 심도가 느껴집니다.

잠금 화면의 조작하는 영역과 보는 영역이 나뉘었습니다. 가장 빈번하게 사용하는 알림이 아래 영역에 압축되어 표시되고 상단은 내가 원하는 이미지와 시계 스타일이 보이도록 디자인됐습니다. 또한 보는 영역에는 스마트폰을 들자마자 바로 확인하면 좋을 정보들을 표시합니다. 홈과 잠금화면은 여러 종류를 만들 수 있고 선택한 집중 모드에 따라 보여지는 정보도 달라집니다. 여러모로 아이폰 14부터 제공하는 올웨이즈 온 상태를 고려한 디자인입니다.

최근 모바일 경험에서 신선함을 주기 위한 새로운 도전이 늘었습니다. 삼성은 완전히 다른 형태의 구조로 잠금을 해제하기 전의 UX를 별도의 스크린으로 표현했습니다. 구글은 기존의 디자인 요소들의 형태와 색을 과감하게 바꿀 수 있는 UX를 제공했습니다. 애플은 이번 업데이트로 다이내믹 아일랜드 Dynamic Island와 더불어 하드웨어의 한계를 소프트웨어 UI로 극복한 경험을 제공했습니다. 요소를 추가하지 않고 문제를 해결한 간결한 UX입니다.

이미지 해석도 척척

라이브 텍스트는 이전부터 있었지만 드디어 한국어도 지원합니다. 사진에서 원하는 피사체를 탭하면 자동으로 피사체를 배경에서 분리합니다. (애플은 Visual Look Up이라 표현합니다.) 사진에 포함된 새, 곤충, 거미 등 여러 물체나 요소에 대한 정보를 더 쉽고 빠르게 찾을 수 있습니다. 이미지 속 통화를 원하는 통화로 환율을 반영해 전환해줍니다. 동영상을 재생하다 일시 정지 후 텍스트를 번역할 수 있습니다. 스포트라이트 검색에서 사진과 동영상 속 텍스트를 검색할 수 있습니다.

기계가 해석하기 어려웠던 사진과 동영상도 이제 텍스트처럼 다룰 수 있게 되었습니다. 단순히 이미지를 설명하는 대체 텍스트를 검색하는 것을 넘어 이미지 속에 포함된 정보를 검색할 수 있게 되었습니다. 구글, 네이버, 메타 등 빅테크기업에서 경쟁하고 있는 영역인데 한국어는 얼마나 잘 자동할지 궁금하네요. 같은 문화권에 대한 깊은 지식이 있어야만 사용할 수 있는 말과 글과 같은 청각 언어 없이, 시각 언어만으로 정보를 탐색할 수 있게되면 완전히 새로운 UX가 가능할 것입니다. AR과 결합된다면 어떤 놀라운 세상이 될지 기대됩니다.

나만의 오디오 프로필

트루뎁스 카메라를 사용해 사용자 귀 모양을 스캔하는 맞춤형 공간 오디오 기능도 추가됐습니다. 공간 음향은 이어폰과 헤드폰을 썼을 때 필요한 기술입니다. 일반적인 스피커는 사람이 소리가 나오는 곳의 위치와 방향을 알 수 있지만 이어폰, 헤드폰은 내 귀 바로 옆에서 들리기 때문에 공간을 인지할 수 없습니다. 이 때 필요한 것이 공간 음향이며 이번에 새롭게 추가된 기능은 내 귀의 모양과 공간을 카메라로 분석해 최적의 공간 음향을 제공하는 것입니다.

사실 아직은 사진을 찍어서 어떻게 더 나은 소리를 제공한다는 것인지 이해가 되진 않습니다. 업데이트 후 에어팟 프로를 이용해봐도 아직은 큰 차이를 모르겠습니다. 이번에 새롭게 공개한 에어팟 프로 2세대와 결합했을 때 유의미한 차이가 있으리라 생각합니다. 애플은 그동안 여러 오디오 기기를 출시했지만 에어팟 외에는 큰 성공을 거두진 못했습니다. 앞으로 에어팟을 중심으로 어떻게 이음새 없는 청각 경험을 완성할지 기대됩니다.

속이 다 시원한 기능

  • 메시지 수정, 취소, 읽지 않음 표시
  • 와이파이 암호 보기
  • 배터리 백분율 표시
  • 와이파이 암호 보기
  • 이미지 누끼 따기
  • 중복 사진 제거
  • 이미지 실시간 번역
  • 나만의 오디오 프로필

좋은 UI를 위한 움직임

모바일 디자인이 등장하기 전 웹 디자인에서 움직임은 금기였습니다. 속도를 느리게 하고 사용자가 보고 싶어하지 않는 정보에 강제로 집중하게 만드는 장치였습니다. 공급자가 보여주고 싶은 정보를 보게하는 용도로 많이 쓰였습니다. 모바일 시대로 들어서면서 인터넷이 불안정하고 기기 성능이 떨어졌기 때문에 움직임은 거의 사용되지 않았습니다. 이제는 모바일 관련 기술이 발달하면서 서비스에 움직임을 적용하는 난이도도 낮아졌습니다. 여전히 보여주고 싶은 정보를 강조하는데 쓰이고 있지만, 사용자를 위한 적절한 움직임을 제공하려는 노력이 점차 늘고 있습니다.

청각 언어, 시각 언어와 마찬가지로 움직임 역시 언어의 한 종류입니다. 한정된 공간에 다양한 정보를 전할 수 있어 정적인 요소로 전하기 어려운 내용을 쉽게 전할 수 있습니다. 또한 우리가 경험하는 실제 세계에는 ‘가만히 있는’ 것은 절대 없기 때문에 움직임으로 자연스러움 한 스푼을 더해줄 수 있습니다. 평면 스크린에서 자연스러움을 묘사하는 마지막 조각이라 볼 수도 있습니다. 여기에 더해 나의 행동에 따라 반응한다면 추상적인 시각 요소가 물리적인 세계에 정말로 존재한다는 느낌을 전합니다.

움직임의 용도

주목하고 기다리기

움직임은 사용자가 집중하게 만듭니다. 다른 시각 기법들보다 움직이는 요소에 가장 먼저 눈길이 갑니다. 정적인 요소는 눈과 뇌가 정보를 처리하는 속도가 빠르지만, 동적인 요소는 집중력이 떨어질 때까지 시선이 머무는 편입니다. 움직임 정보를 처리하는 동안 시간을 느끼지 못해 기다리는 시간을 짧게 느끼게 도울 수도 있습니다.

가상의 공간 상상하기

움직임은 서비스를 구조를 쉽게 이해할 수 있게 돕습니다. 평면의 모바일 스크린은 추상적인 공간입니다. 추상적인 공간에 구체적인 구조를 떠올릴 수 있도록 애니메이션을 활용합니다. 한정된 화면에 공간과 구조를 떠올릴 수 있도록 화면이 전환될 때 어디서 등장하는지 알려줍니다. 오른쪽에서 등장하는 애니메이션은 왼쪽에서 오른쪽으로 진행되는 구조를 상상할 수 있으며, 아래에서 튀어나왔다 작업을 마무리하고 사라지는 구조로 일시적인 작업은 아래에서 위로 잠깐 나타나는 구조를 상상할 수 있습니다.

많은 정보 순차적으로 이해하기

움직임은 적은 공간에 여러 정보를 전달하기 좋습니다. 고정되어 있을 경우 한번 표시된 정보는 특정 공간을 점유하게 됩니다. 이 때 움직임을 이용해 보이는 정보를 교체하면 짦은 시간에 여러 정보를 전할 수 있습니다. 눈이 한번에 받아들이는 정보량을 줄이고 고객이 터치나 스크롤 액션을 하지 않고 다양한 정보를 확인할 수 있는 기법입니다. 기다리지 않으면 무슨 내용이 나올지 알 수 없기 때문에 시작부터 끝까지 요소의 맥락이 연결되는 것이 좋습니다.

직관적이고 빠른 피드백 받기

움직임은 직관적으로 예측할 수 있는 피드백을 전할 수도 있습니다. 글, 사진, 이미지 시각 요소가 추가될 때마다 사용자는 정보를 해석해야 합니다. 특정 요소에서 일어나는 변화를 따로 설명하지 않고 요소 자체의 움직임만으로 전달할 수도 있습니다. 예를 들어 특정 요소를 삭제하려고 할 때, ‘실패했습니다’ ‘성공했습니다’를 텍스트나 아이콘을 추가해 정보를 전달할 수 있습니다. 하지만 여기서 시각 요소를 추가하지 않고 삭제하려는 대상에 움직임을 추가해 사용자가 시각 요소를 해석할 필요 없이 직관적으로 이해할 수 있게 도울 수 있습니다. 실패했을 때는 고개를 흔들듯 좌우로 움직이고, 성공하면 기분이 좋은듯 살짝 점프하는 것이죠.

움직임의 요소

속도

속도와 지속 시간은 상대적입니다. 1초(1,000ms) 모바일 환경을 기준으로 0.2초(200ms) ~ 0.5초(500ms)에서 시작하는 것이 좋습니다. 이 숫자는 Neilson Norman GroupModel Human Processor에서 기반합니다. 0.1초(100ms)가 순간으로 지각되고 1초(1,000ms)가 생각할 수 있는 상한선이라고합니다. Model Human Processor 에서는 너무 짧으면 인지가 되지 않고 너무 길면 지루합니다. 웹은 실행과 연관된 애니메이션은 속도가 더 빨라야 합니다. 웹이 정상적으로 작동하지 않는다고 생각할 수도 있기 때문입니다. 또한 요소의 크기가 클수록 빨리 움직여야 합니다. 동일한 면적에서 움직여야 하는 거리가 다르기 때문입니다.

반복되는 움직임은 가속도를 주는 것이 자연스럽습니다. 같은 속도로 움직이는 것은 존재하기 어렵기 때문에 자연스럽게 느껴지지 않습니다. 빠르게 시작하고 끝에 닿을수록 서서히 느려지는 움직임이 자연스럽습니다.

등장과 퇴장 움직임은 상황에 따라 다릅니다. 요소가 등장할 때는 사용자가 기다리지 않도록 최대한 빨리 표시하는 것이 좋습니다. 퇴장할 때는 요소가 움직인다는 사실을 전한 뒤에는 최대한 빨리 사라지는 것이 좋기 때문에 사라지는 속도가 점점 빨라지는 가속도로 표현하는 것이 좋습니다.

동선

디지털 프로덕트에서 요소가 표시되는 환경과 동선을 고려해야 합니다. 움직임이 사용자의 경험 단계에서 어떤 문제를 해결해주는지 명확하게 정의하고 사용자의 목표를 달성하는 여정에 도움을 줄 수 있는 맥락을 찾아 움직임을 적용합니다. 여러 요소가 움직여 혼란스럽지 않게 우선 순위를 명확하게 하고 인지 부하가 없도록 설계합니다.

사용자가 행동하는 위치에서 움직임이 시작되는 것이 좋습니다. 예를 들어 사용자가 오른쪽에서 화면을 쓸면, 새로운 창이 오른쪽에서 등장해야 합니다. 사용자가 팝업을 띄우는 버튼을 누르면 상세한 내용을 선택하는 창이 누른 버튼에서부터 시작해서 확장되어 등장하는 것이 자연스럽습니다.

요소 등장하는 순서는 맥락에 따라 다릅니다. 모든 요소들이 순차적으로 움직임이 진행될 필요는 없으며 가급적 움직임의 량과 시간이 적을수록 좋습니다. 정보의 시작과 끝을 표현하기 위해 모든 정보를 동시에 표시하지 않을 때에도 최대한 움직이는 요소를 그룹으로 묶어 사용자가 눈으로 쫓는 동선을 최소화해야합니다.

UI 디자인 가이드

좋은 UI를 위한 움직임

좋은 UI를 위한 움직임

모바일 디자인이 등장하기 전 웹 디자인에서 움직임은 금기였습니다. 속도를 느리게 하고 사용자가…

좋은 UI를 위해 꼭 확인해야 하는 20가지 경우의 수

좋은 UI를 위해 꼭 확인해야 하는 20가지 경우의 수

인터페이스를 디자인할 때 종종 개발자 분께서 ‘앗 그것도 정의해주셔야 해요’라고 말씀하실 때가…

좋은 UI를 위한 알림

좋은 UI를 위한 알림

알림은 애플리케이션에서 발생한 일에 대해 알려주는 것입니다. 시스템 변경사항이나 다양한 커뮤니케이션에 대한…

UI를 위한 글쓰기

UI를 위한 글쓰기

UX 글쓰기(UX Writing)는 제품과 고객의 대화를 디자인합니다. 웹사이트, 앱과 같은 다양한 디지털 환경에서…

패턴

패턴

패턴은 사용자가 디바이스를 조작해 행동하는 일반적인 과정을 뜻합니다. 컴포넌트와 다양한 시각 요소를…

컴포넌트

컴포넌트

컴포넌트는 사용자와 상호작용하는 기본적인 형태로 어느 공간에서도 기능을 수행할 수 있는 최소한의…

더 보기