Contents
1st Section · 트렌드라는 이름의 착시 현상지난 3년간의 유사 디자인 트렌드유니온 크림의 Design System을 통해서 보는 인문학과 디자인 및 디자인 프로세스2nd Section · Designing for Marketers with Empathy3rd Section · Design with Scale, 14억을 위한 디자인4th Section ·
2019년 비디오 엔터테인먼트 서비스의 UX/UI 트렌드 분석
What is 'Azar'? 비디오 서비스로부터 일어나는 마켓의 변화소셜 비디오 서비스에 담겨진 사용자 경험을 고려한 장치우리가 겪고 배운 것들우리가 일을 하는 방식Seminar Review1st Section · 트렌드라는 이름의 착시 현상
연사 | 신민호
現 더 크림 유니언 디자인본부 본부장
지난 3년간의 유사 디자인 트렌드
- Bold Colors - 대담한 색상들, 파스텔 톤이나 차분한 색상보다는 형광, 과감한 색상의 많은 사용
- Gradient - 그라디언트 칼라, 질감 적용
- Mobile First - 모바일 기기 대응 관련 중요성은 항상 더 높아지고 있음
- Bold fonts - 과감하고 두꺼운 폰트 사용
- Broken Grids - 탈 레이아웃
- ETC - 카드형 UI , Video Background, 개인화 서비스, Drop Shadow, 콘텐츠 집중, Flat Design…
- 2019년 올해 역시 비슷한 형태로 표현이 될 것이라 예상됨. 하지만 디자인 트렌드에 따른 표현 기법에만 매달리지 않는것이 중요. 표현 기법에만 치중하여 어떻게 디자인할 것인가의 문제가 아니라 ‘누구를 위해? 왜? 디자인 하는가’의 생각이 우선되어야함.
- 트렌드란 전체적인 거대한 흐름, 표현양식의 맥락 왜 이런 표현 기법들이 트렌드로서 명시되고 있는지에 대해 생각해야함.
결국은 크리에이티브 한 것과 트렌디하다는 것의 이 흐름들은 시대의 환경 변화 속에 당면하는 낯선 환경에서도 사람들이 쉽게 적응할 수 있도록 ‘맥락’을 이어주는 역할
- 최근 트렌드에서 Flat, Simple 디자인이 더 주요해지는 이유는 사용자에게 전하는 단순하고도 명료한 메시지 표현 기법이 필요하기 때문에 Flat, Simple한 표현방식이 더 중요해지는 것이 아닌가 싶음.
- 최근 두드러진 UX 트렌드의 흐름은 디자이너(프로덕트 디자이너, 설계자)의 역할이 그림만 잘 그리는 범주를 넘어서 그 이상의 고민과 표현이 필요.
- 작년까지 Design Concept & Wireframe 에 대한 키워드가 많이 두드러졌었고, 결국 그림을 잘 그리는것보다 ‘사고’ 하는 디자인이 더 중요해짐을 나타냄.
"사자가 말을 할 수 있다고 하더라도 우리는 그 말을 이해할 수 없다." 비트겐슈타인의 철학적 탐구 사자와 우리의 삶의 방식은 다르기 때문이다. 주어진 환경과 개인의 경험은 다르다. 그 사람의 삶과 환경을 이해하고 존중할 수 있어야한다. 그렇기때문에 트렌드의 변화 속에서도 어떻게 하면 조형적, 미학적으로 잘 보여줄 수 있을지에 대해 고민하는 것보다 사고하는 디자인이 더욱 중요한 것이다.
2019년 트렌드 관련 아티클 및 포스트
https://www.behance.net/gallery/71481981/2019-Design-Trends-Guide
https://www.behance.net/gallery/74203889/DESIGN-TRENDS-2019-WEB-UIUX-3D-ANIMATION
https://uxplanet.org/review-of-ui-design-trends-we-start-2019-with-68f128151215
유니온 크림의 Design System을 통해서 보는 인문학과 디자인 및 디자인 프로세스
- 유니온 크림의 Design System → Concept · Reference · Wireframe · Design Draft
- 레퍼런스를 먼저 찾고 디자인 시안을 잡는 것이 일반적인 방식으로 여겨질 수 있으나, Concept과 Wireframe 설계가 더욱 중요. 컨셉에 대한 설정이 끝난뒤에는 논리적 사고가 필요한 Wireframe 작업에 들어감.
- Wireframe이란 (Color, Font type 등 디테일한 요소들이 제외 된) 화면 설계 과정으로, 더 크림 유니언의 경우 기획 담당 팀에서 와이어프레임 작업을 진행하기 전 디자이너가 먼저 와이어프레임을 제작함. 이 부분은 '어떻게 하면 작업이 예뻐보일까'에 대한 집중을 하는 과정이 아니라, 끊임없는 Test가 필요한 과정임. 와이어프레임이 300장 정도 나오고 모두 프린트하여 회의실로 가지고 가게됨. 협업을 위해서는 아직은 디지털 툴보다는 오프라인의 아날로그적인 방식이 조금 더 편하다고 생각함. 회의실에서 GNB, 각 Elements들을 칼 · 가위로 오려 컨셉을 충분히 담을 수 있는 탄탄한 구조가 될 수 있는지 퍼즐 맞추기 놀이와도 같이 여러 경우의 수를 만들어보며 최적의 UI가 나오도록 테스트를 진행함.
- '더 크림 유니온'의 한화 리조트 (Le Ciel) 제안 · 수주 사례 - "관점을 옮겨 이야기를 만들다."
- Luxury & Premium을 기초로 ‘품격’있는 컨셉으로 발전시킴
- 타겟층 자체도 Luxury, Premium Life Style을 지향하는 타겟층
- 버락 오바마의 '51초간의 침묵' · 스티브잡스의 프레젠테이션 · 마크로스코의 작품 ‘무제’ · 리움 미술관의 ‘시대의 교감전’과 같은 사례들의 공통점은 여백을 품고 있음. 여백의 품고있다는 의미는 곧 숨을 고르다는 의미로, ‘여백’이 존재할 때에 여유있고 품격있는 사례로 풀 수 있다고 생각하였음.
- Web의 경우 ‘정보 전달’을 중점적으로, App의 경우 타겟층인 상류층의 Private한 요소를 위해 담백한 디자인 표현(기교)으로 ‘고객 또는 투숙객의 개인 정보 전달’에 초점을 맞춤. Web Design Concept의 경우 품격있고, 여유있는 사람들의 삶이란 시와 같은 삶, 한 폭의 풍경화와 같은 자연의 삶이라고 생각을 하여, 예술과 사람, 그리고 자연이 하나로 만나는 공간을 ‘거제 한화 리조트 Le Ciel’로 테마 컨셉을 잡은 뒤 병풍이 가지고 있는 그리드 및 고풍스러운 품격의 상징성을 활용하여 웹사이트 표현에 활용함.
더 크림 유니온 웹 사이트에서 보기 https://www.crea-m.com/crea-m_2017/view.php?seq=395
- 현대페이에서 만든 블록체인 웹 페이지 'Hdac' 제안 · 수주 사례
- 연사님의 경우 블록체인에 대한 프로젝트를 시작하게되었을 때에 블록체인에 대해 잘 모르고 있던 상황이였기 때문에 일단 투자를 시작해 본 블록체인. 투자하고 폭락하고를 반복, 해당 코인에 대해 홈페이지 살펴보고 공부하고 또 폭락하는 과정들을 반복하며 개인의 경험을 토대로 '유저 저니맵'을 작성하였으며, 타겟층에 대한 생각과 코인이 발전하는 단계에 따른 정보 구조화를 통해 디자인 작업 전 과정을 선행함.
- Hdac 사례에 활용한 디자인 표현 기법 과감하게 이미지를 사용하지 않고 Text View, Roadmap, Timeline에 대한 정보, Tool Tip (블록체인 관련 전문용어가 굉장히 많기때문에 어려운 용어를 따로 찾아보려면 번거로우므로 간단한 용어는 웹 사이트에서 표현해주기위한 툴팁 기능 추가), Animated되어지는 Color Gradient 표현 기법을 통해 끊임없이 블록체인이 성장하고 상승한다는 느낌을 주었음.


“예술품이란 색을 칠하거나 구성할수 있지만 단지 선택만을 할 수도 있다.“ - 마르셀 뒤샹
마르셀 뒤샹의 ‘샘’이란 명령 예술, 개념 미술로도 불림. 전통적인 의미의 정형화된 예술의 의미가 꼭 예술의 의미 모든 것만은 아니라는 것을 보여줌. 마르셀 뒤샹의 Quote와도 같이 트렌드에서 명시된 표현 기법들을 맹목적으로 좇는것이 아니라, 내가 사고한 디자인 컨셉을 담을 수 있는 표현 기법을 알맞게 선택해서 표현하는 것이 가장 중요한 것임.
- Mobile First 또한 시대가 지난 이야기일 수 있음. 디바이스를 위한 표현 양식 이전에 Human First가 우선 되어져야한다고 생각함. 디바이스 표현보다 더 중요한 것이 사용자 중심 디자인임. (Human Centered Design)
- 결코 트렌드에 쫓기며 살아가는 것보다, 디자이너라는 직업이 하는 일에 대한 확신과 함께 트렌드를 직접 만들어가고 메세지를 만들어가는 디자이너가 될 수 있기를 소망함.
Q&A Time
- 디자인을 위한 인문학적 소양을 높이기 위해 연사께서 하고 계신 노력은? 서양미술 전공을 하다 젠더학에 대해 배우게됨. 그리하여 인문학에 관심을 갖게 되었고, 하루 아침에 인문학적 사고가 생길 수는 없음. 가장 쉬운 방법은 독서가 제일 좋은 방법. 분야를 막론하고 책을 많이 읽어야 함. 지식과 인문학적 사고의 깊이는 서로 정비례하지 않는다고 생각. 상대방의 이야기를 경청하고, 상대방의 감정, 행동 습관 등을 집중하는 습관 또한 필요하며 끊임없는 상대에 대한 배려와 이해 등도 도움이 될 수 있음.
- 와이어프레임 테스트 과정의 구체적인 설명을 덧붙인다면? 와이어프레임 작업시 처음으로는 구조에 대한 테스트 먼저 시작함. (컬러 · 시각적으로 조형적인 부분은 모두 배제하고 테스트를 진행) 스케치, ADOBE XD와 같은 그래픽 툴을 사용하여 작업이 된 와이어프레임을 프린트하여 여러 사람들이 만든 시안들의 Element 조합들을 종이로 잘라 조합을 하여봄. 조합을 통해 최적화되어진 여러가지 안들을 다시 Sketch, XD로 옮겨 디테일을 잡고 또 다시 테스트를 반복. 여러 시안이 나왔을 때, 더 나은 상황을 위한 경우의 수를 테스트 해보고자 와이어프레임 작업을 하는 것임.
- 테스트 이후 FIX 시안을 결정하는 시점, 포인트의 경우에는 어떤 경우인지? 콘텐츠가 더 명확하게 보이고, 정보 전달이 잘 되는 디자인 작품인지에 대한 부분이 가장 큼.
- 타겟층에 대해 고민하는 방식은? 개인적으로는 빅 데이터, 데이터마이닝, 통계치에 많이 의존하지 않으려고 하는 편. 통계학에만 의존하게되면 오류를 범할 수 있음. 진짜 그들이 원하는것을 찾기가 쉽지 않을 수 있음. 요즘 10대들의 경우 정보 검색시 네이버와 같은 포털들을 사용하기보다 유튜브로 검색을 한다는 기사를 보게되었음. 유튜브 컨텐츠에 대한 맥락을 보면 단순하게 무엇이라는 정보를 주기보다는, How To에 대한 정보를 제공함. 무언가에 대한 결론보다는 그 결과를 위해서는 어떻게 할 수 있는지에 대한 방법을 알고싶어 10대들이 유튜브를 찾는 것이 아닌가 하는 생각이 듬. (사회 현상, 그들이 실질적으로 향유하는 매체, 현실적인 부분들의 주요 이슈들을 통해 타겟에 대한 특정 현상을 이해하고자 함.)
- 클라이언트(비디자인 계통)를 설득하는 방법은? 와이어프레임 작업 과정 시점에서 커뮤니케이션을 많이 하는 편임. 수주가 된 이후부터는 클라이언트를 많이 괴롭히는 편. 디자인적으로는 우리가 전문가일 수 있지만 사업적으로는 더욱 더 전문가인 클라이언트의 이야기를 경청해야하고, 이 프로젝트가 왜 시작되었는지에 대해 물어봐야함. 디자이너가 하기 쉬운 오류의 경우, 디자이너가 좋아하는 디자인을 하기 때문에 클라이언트로부터 좋지 않은 피드백을 받을 수 있다고 생각함. 우리가 와이어프레임 작업 단계(색상, 디테일 요소가 배제된 상황)를 걸치고 클라이언트에게 해당 작업을 가지고 가는 이유의 경우, 색상 및 디테일 등의 피드백으로부터의 걸림돌을 조금 줄일 수 있기 때문. 담백하게 클라이언트와 소통할 수 있기때문에 와이어프레임을 먼저 이야기하곤 함. 클라이언트에 대한 공감과 소통에 노력을 많이 기울이는 편.
2nd Section · Designing for Marketers with Empathy
연사 | 이근배
現 Product Designer at Facebook [Related with AD, Marketing Team]

- Product Design at Facebook
It’s integrated into the entire end-to-end product development process. - Luke Woods vp.head of Design at Facebook
구글과 같이 디자이너의 역할을 인터랙션 디자인 · 시각디자인 · 프로토타이핑 업무로 나누는 경우도 있으나 페이스북의 경우 Interaction, Visual, Prototype 모두 프로덕트 디자이너가 담당함. 페이스북에서는 이 3개의 요소와 Product Thinking이라는 부분을 중시함. Product Thinking이란 사용성에 대한 사고, 전략, Success Metrics 등의 부분에 대한 고민을 의미함.


거의 매일 컨텐츠 전략 담당자와 함께 프로덕트 디자이너가 회의를 하면서 브레인 스토밍을 함. 데이터에 대한 디테일한 피드백이 필요할때 Researcher가 필요하고 High level thinking이 필요한 프로젝트에서도 Researcher가 도움을 많이 줌.
- Empathy in Design








- Facebook 광고팀 디자이너로서의 역할



- 마케터들을 공감하기 위한 능력을 쌓기위해 필요한 과정들










Q&A Time
- 정량적 조사, 정성적 조사의 비율이 궁금하고 리서치 과정의 노하우가 궁금합니다. 정량적 조사는 방향성에 도움을 주고 Research Trip의 경우 전환율 · 유저가 어디에서 싫증을 느끼는지, 짜증을 느끼는지 알 수 있고, 리서치를 먼저하고 데이터를 뽑아낼 때가 있으며, 데이터를 먼저 뽑고 리서치를 할 때가 있음. 리서처들이 리서치 트립 전 도큐멘테이션을 많이 하고 준비를 많이 함. 클라이언트와의 디스커션 시 노트테이킹 해두었다 후반부에 궁금한 질문은 물어봄. 리서치 트립의 경우, 작은 부분도 보아야되지만 큰 그림을 봐야함. UI를 보여주면서 설명을 하기도 하고, 무작정 들으려고 하기보단 클라이언트 입장을 직접 많이 물어봐야 얻을 수 있는 부분이 많고 호기심을 많이 가지고 여러 인사이트를 얻을 수 있도록 스스로 노력해야 함.
- 타켓 세그먼트의 범위가 큰 경우에는 어떻게 타겟 세그먼트를 잡는지? 타겟 세그먼트를 전체로 잡을 수는 없기 때문에, 정확히 타겟세그먼트를 특정 타겟으로 잡아서 그 타켓에 맞게 디자인 작업을 진행함
- 리서처, 컨텐츠 전략 담당자를 찾아가기 전 준비 요소와 디자이너 스스로 작업을 진행하는 경우가 있는지? 일주일에 2-3번 컨텐츠 전략 담당자와 회의를 함. 유저 관련 도큐먼트, 디자인 원리들에 대해 공유하고 커뮤니케이션 해야하는 부분에 대해 컨텐츠 전략 담당자들이 많이 고민을 함. (ex. 툴팁 추가 관련). 컨텐츠 전략 담당자와 리서처를 디자이너가 찾아갈 때에 디자이너도 도큐멘테이션을 준비 해 가야함. 디자이너의 중심, 주관없이 타 업무 담당자들을 찾아가서는 아무것도 남는 것 없는 데이터일뿐임. 혼자 디자이너가 비전을 가지고 하는 경우는 거의 없고 팀웍, 각자의 일에 대한 Ownership이 강하기 때문에 혼자하기 보다 함께하는 일이 많음.
- 집중하는 타겟 세그먼트는 어떻게 정하는지? 그리고 타겟 세그먼트에 따라 UI 화면도 다르게 보여주는 경우도 있는지? 테스팅에도 비용이 들고, 테스팅을 하려고 하는 집단은 전문성이 있는 집단이 많음. (광고 비용도 그만큼 많이 투자할 생각이 있는 집단) 그리고 타겟별로 다른 UI 를 나누어보여주지까지는 않음.
3rd Section · Design with Scale, 14억을 위한 디자인
연사 | Tencent PCG 이현주
- 알리바바와 텐센트의 경우 인력 경쟁이 심함
- 중국의 심천 = 미국의 실리콘밸리와 같은 혁신도시
- 텐센트의 총 직원 수는 4만명, 평균연령 30대
- 텐센트 · 화웨이 = 심천을 대표하는 회사
- 심천의 Tencent 사옥은 건물 자체가 IoT로 이루어진 건물로 엘레베이터와 위챗과 연동이 되어 더 빨리 갈 수 있는 엘레베이터를 알려주고, 주차장 관리를 모바일로, 회의실에서의 회의실에 참석한 사람들의 체온등을 자동으로 체크하고 회의실 온도 및 환경을 조절해줌.
- Data로 보는 중국 - 진격의 대륙은 이미 모바일 선진국
- China has 9 of the world’s 20 biggest tech companies by MIT Technology Review [중국의 경우 세계의 가장 큰 20개의 기술 회사 중 9개의 회사를 지니고 있음] 5. Alibaba / Tencent 8. Ant financial 14. Bytedance (TikTok 서비스) 15. Baidu 16. Didi chugging 17. Xiaomi 18. Meituan Dianping 19. JD.com
- China is 2/3 of global “on-demand” transportation market. [중국의 경우 세계의 '주문형' 운송 시장의 2/3을 차지하고 있음]
- China’s mobile payments market is 41 times the size of US’s. [중국의 모바일 결제 시장은 미국의 41배 규모임]

- Data로 보는 중국; 진격의 대륙은 이미 모바일 선진국
- 중국 UX / UI 이해하기 1. “오프라인의 한계를 온라인의 혁신으로” - Didi (중국 택시 모바일 앱, 베이징에서 많이 이용된 차량 호출 앱) - 콰이쳐 (항저우 베이스-항저우에 있는 알리바바가 만든 서비스, 차량 호출 앱) ※ 현재 Didi 와 콰이쳐는 합병이 됨 ※ 차량 호출 앱이 중국에서 Mobile Payment가 발달할 수 있도록 일조함. (차량 호출앱과 모바일 결제가 서로 니즈가 있었기 때문에 공조함.) 2. “중국 모바일 생태계를 바꾸다, 알리바바와 텐센트” Wechat, qq, qq input, Alipay, mobile taboo, Tencent video, iqiyi은 중국에서 가장 다운로드수가 많은 APP
광군제 (Alibaba T Mall) 날 타오바오, 티몰, 알리페이의 경우 큰 사업적 성과를 냄. 광군제 하루 매출의 경우 34조 육박, 택배량 10억건 돌파.
Tencent의 대표적인 서비스는 WeChat으로 위챗이 없으면 중국이 없다는 이야기가 있음.
WeChat(웨이신) = 10억 8천만명이 이용[MAU], 메시지전송량 450억건[하루]
Alipay는 온라인 결제시 많이 사용하고, 오프라인 결제시에는 Wechat pay를 더 많이 사용하는 양상을 보임
WeChat팀에서 팀내부적으로 사용하던 ‘새뱃돈’ 기능이 2014년에 도입이 되었고 Wechat Pay가 그로 인해 더욱 성장하게 되었는데, 카카오 페이의 돈 봉투 송금 기능도 이 영향을 많이 받음
Alibaba Group’s mission statements → Make it easy to do business anywhere.
어디에서나 사업을 쉽게하자 = B2B 기반의 태생을 가진 Alibaba다운 미션
Tencent’s mission statements → We aim to create value for users.
(QQ를 시작으로 젊은 사람들의 소통을 이끈 텐센트, 어떻게 하면 소비자들을 위한 value를 만들 수 있을 것인가)
서로 경쟁관계가 심하다보니 Taobao 제품 공유시 Wechat 에서 상품을 열 경우 다이렉트로 들어갈 수 없음. 링크를 복사해서 브라우저에서 한번 더 연결시켜야함.
- “Scan and Go - 현금없는 사회로”

실제 중국 생활에서 지갑을 가지고 다니지 않은지 6개월이 되었을 정도로
현금이 필요하지 않고 그 이유는 Alipay, Wechat pay가 있기 때문.

택시 탑승도 모바일 페이로 쉽게 결제가 가능하고, 그로 인해 자전거 공유 서비스도 발전될 수 있었음.
중국의 플랫폼들이 한 플랫폼 안에서 모든걸 이용할 수 있도록 하는 것은 이탈율을 줄이고자 하며(너무나도 많은 인구 및 사용자의 큰 변수에 대한 위험 부담감 관련) Abuse나 불만의 소리도 크게 올 수 있는 부담감을 줄이기 위해 새로운 시도를 많이 하지 않는 편
- "INPUT IS HARD” (디바이스상 입력 체계가 어려운 중국어의 다양한 Input 방식 시도)
- 다른 언어보다 한자를 입력하는 것은 획이 많고 시간이 많이 소요되며, 너무나도 어려움.
- 병음이라고 하는 방식으로 소리나는대로 영어로 입력하거나 Hand writing 방식이 많이 쓰임. 그리하여 가게 등에서도 검색 또는 정보 전달을 위해 QR CODE를 많이 사용하고, 그로부터 입력 부담을 줄임. (전세계에서 QR코드를 제일 많이 쓰고있는 나라일 것임)
- 글자 입력 부담이 있기 때문에 Voice 전송도 많이 함. 음성입력이 병음입력이나 Hand writing에 비해 늘고있는 추세이며, 새로운 방식의 Input도 많이 나옴. 이미지 인식 · 제스춰 인식을 통해서도 입력을 하며, 이미지 검색을 통해 제품을 살 수 있고 정보 검색을 하기도 함.
- Trust Issue in China - Review, Ranking, 5 Stars (상호간의 신뢰가 중요함)
- 중국은 가짜분유, 가짜계란 등 ‘진실성 여부’에 대한 논란이 많기 떄문에 예를 들면 중국의 Open Kitchen의 경우 Cool함을 나타내는 것보다 생존을 위한 방법이기도 함. 그렇기때문에 상점의 평점, 얼만큼 제품을 팔았냐, 사람들의 반응 등이 중국 시장에서는 더욱이 중요한 요소. 얼마나 믿을만한 상점인지 E-commerce mall에서도 주요하게 보여주고 있고, 음식물 배달, 가게 선택, 택시 차량 호출 기사님들의 경우에도 평점 서비스를 통해 탑승하기에 안전한 택시인지, 탑승 경험이 있는 택시의 기사님에 대한 평점을 주지않으면 다음 페이지로 넘어갈 수 없게끔 하는 장치들도 있음.
- 2019 UX TREND KEYWORDS from China UI, UX
- 가볍게, 빠르게 - Mini program 1. Wechat의 Mini Program이란 위챗 내에서 관계사(입점사)들이 미니 App을 만들 수 있는 API 제공하는 것 2. 위챗의 미니 프로그램을 통해 레스토랑 위치 · 어떤 메뉴를 먹을 수 있는지 정보 공유도 가능함. 별도의 앱을 설치하는 번거로움 없이 회원가입, 로그인도 불필요하며 가볍고 편리함을 추구하는 사용자들의 모바일 행태를 반영하여 Mini Program과 같은 스타일의 In-App 서비스가 많이 나올것으로 생각됨. 최근에 Alipay에서도 비슷한 서비스를 만들어냄.
- Design meets Technology - AI , ROBOT 1. Tencent에서 최근에 색다른 Robot을 론칭하였는데, 기존의 스마트 스피커에 캐릭터를 도입하고, 여러 게임 캐릭터들의 버전으로 스마트 스피커를 출시함. 이제 Ai, Robot에서도 스토리나 이미지, 톤앤매너, 캐릭터의 성격도 중요해지기 때문에 Alexa, Siri에서 보여지지 않았던 이러한 부분도 연구가 많이 이루어지고 있고 증강현실이 접목된 스피커도 최근에 출시가 됨. 2. 알리바바에서 론칭한 ‘루반’이라는 배너를 자동으로 만들어주는 기술의 경우에도, 2017년 광군제 때 처음 만들어져 1억 7천만개의 배너를 생성함. 배너의 배경 · 장식 · 카피 · 이미지를 분리해서 Ai 기계에 학습을 시키고 그 기계가 배너를 제작함. 사람마다 / 타겟마다 다 다르게 보여지는 개인화에 초점을 맞춘 배너 제작이 필요한데, 이 AI 기술을 통해 가능해짐. 디자이너가 20분동안 1개의 배너를 제작한다고 하면 4억개의 배너의 경우 100명의 디자이너가 쉬지않고 150년동안 만들어야함. 그러나 AI 기술은 쉽게 해냄. 인공지능이 배너 컴포넌트를 학습하고 라이브러리를 생성, 심미적 · 사업적으로 평가를 진행하여 앞으로 더 좋은 배너를 만들수있도록 프로세스를 거쳐 만들어짐. 루반과 같은 인공지능을 통한 디자인 학습 로봇이 앞으로 더 많아질 것으로 생각됨
- 짧게, 자주 - 15초 동영상 1. Ticktok의 서비스와 유사하며, 틱톡의 경우 AI와 연동이 되어 사용자들이 좋아하는 컨텐츠를 연결시켜줌. Tiktok의 서비스 중에서도 Gaga Dance Machine이 인기를 많이 얻었는데 사람의 모션을 감지해서 춤을 따라추는 게임. 2. Douyin(Tiktok) 과 Kauishou 두 서비스가 급격한 성장세를 보여주고 있음. 3. China Short form Video의 주 사용층 → 2~30대 여성층 4. Internet Influencer 마케팅을 활용하여 서비스를 더 넓게 퍼트리고 있음.


Q&A Time
- 신기술에 대한 습득을 내부에서 어떻게 공유하는지 궁금하여 신기술(AI 등)에 대한 디자이너들의 대처방법은? AI와 디자이너와의 간극은 여전히 많다고 생각하지만, 가시적으로 보이는 것은 많지 않은 것이 현실. AI Speaker를 제작할 때 자연어를 어떻게 조합하여 사람처럼 자연스럽게 만들것인가에 대한 고민은 모든 업체들이 하는 고민일 것이며 디자이너들이 직접적으로 부여할 수 있는 부분이 많지 않았음. 앞선 발표 자료에서의 Banner Maker Bot의 경우 AI가 접목되기 전에는 원시적인 기능의 툴이였지만 AI 기술이 접목되어 더욱 파워풀한 Bot이 됨. 캐릭터 Voice Speaker와 같이 신기술에 캐릭터, 인격 등을 부여하는 부분들이 디자이너가 조금은 기여할 수 있는 부분이라고 생각하지만 지금으로서는 아주 많지는 않다고 보는 편.
- 중국에서의 자동차 UX, Infotainer에 대한 부분은? 텐센트에서 하고 있는 경우에는 대부분의 기술 기업들이 추구하고 있는 것이 자율주행 자동차이기 때문에, 맵을 통해 사용자들이 이용하는 데이터를 많이 모으고 있고 그것을 통해 자율 주행 자동차에도 접목 중. Human Machine Interaction(자동차 UX)의 경우 Tencent에서도 진행하고 있는 것으로 알고 있음. 중국같은 경우도 한국처럼 전기차, 자율 주행 자동차에 대한 Support, 기술, 데이터가 많기 때문에 향후 촉발적인 힘을 발휘할 수 있을 것이라고 생각하고는 있음.
- 중국의 경우에도 보수적인 조직문화를 가지고 있을것만 같은데 알리바바와 텐센트의 조직문화의 경우에는 어떠한지? 중국이 유교사상의 근원으로 보수적일 것 같지만, 직접 경험한 중국의 조직문화는 수평적. 그러나 5년차에 접어드니 보이지 않는 규율이 보이는데 가부장적인 부분이 일부 존재함. 결국 의사결정권자들이 모든 것을 결정하는 것은 동일. 한국과 다른 부분은 객관성을 많이 추구함. 데이터를 통해 서비스의 승패를 많이 판단하고, 중국같은 경우는 소위 사회생활에서의 정치와 같은 부분보다, 정말 실력있는 사람들만 위로 올라갈 수 있기 때문에 상사들이 매우 존경받는 분위기이며 그에 따라 상사들의 의견을 경청하려는 분위기가 있음. 한국처럼 가부장적인 분위기가 있지만 한국보다는 열려있다고 생각함.
4th Section · 2019년 비디오 엔터테인먼트 서비스의 UX/UI 트렌드 분석
연사 | Hyperconnect Product Designer 김성호


What is 'Azar'?
- 비디오 기반 소셜 플랫폼, 하이퍼 커넥트의 대표 프로덕트 ‘아자르’
- 전세계의 새로운 사람들과 만난다는 소셜 디스커버리(Social discovery)개념을 구현한 비디오 기반 소셜 엔터테인먼트 플랫폼
- 전 세계의 서로 알지 못했던 사람들이 아자르를 통해 국가, 언어, 성별, 문화의 장벽을 넘어 다양한 사람들을 만나고 그들의 삶과 문화를 이해하며 새로운 즐거움을 경험할 수 있음 (유튜브에서 #studywithme라는 태그로 같이 영상 Live 기능을 켜두고 공부를 하는 경우가 있는데 아자르의 영상 서비스 또한 유사함.)
비디오 서비스로부터 일어나는 마켓의 변화
- Social Video - 2018년의 핫했던 제품은 Tiktok - 2012년 → 2016년 → 2018년으로 지나갈수록 이전에는 비디오 컨텐츠를 소비하는데에 어려움이 있었지만 디바이스나 통신기술이 발달하며 비디오 컨텐츠를 다량으로 빠르게 소비하게될 수 있는 환경이 마련됨 - 메신저 앱 · 넷플릭스와 같은 App들은 더이상 신규 서비스가 많이 출시되지 않고 있지만 Social Video 서비스들은 1달에 100개씩은 나오고 있음. (스타트업같은 작은 규모가 아닌 글로벌 대기업들도 계속 진행하고 있음)

- 트렌드의 변화 ⓐ 단방향 & 비동기 → Youtube, Instagram, Netflix ⓑ 양방향 & 실시간 & 지인 → Snapchat, House party, Air time ⓒ 양방향 & 실시간 & 비지인 → Azar, Big Live, Live.me, Spoon Radio, HQ Live(Jam Live), Tiktok(musically) - 위와 같이 ⓐ, ⓑ, ⓒ순으로 트렌드가 변화하고 있음. 단방향&비동기 서비스들이 현재는 양방향&실시간&비지인의 트렌드 영향을 받아 신규 적용되기도 함. (Youtube - 커뮤니티와 메신저 기능 추가 · Tinder - 영상 프로필 테스트 기능 · Badoo - 라이브 방송 기능 추가 · Tiktok - 라이브 방송 기능 추가 ← 서로의 서비스들이 점차 닮아가고 있음 - 전세계 엔터테인먼트 앱 소비자의 지출이 늘어나고 있어, 그로 인해 많은 신규 서비스들이 출시되고 있다고 생각
- Mega Trend Azar, Tiktok, live.me, Spoon live (Entertainment Social Video Service)와 같은 이러한 서비스들이 넷플릭스나 왓챠와는 성격이 다르며, 방송 개념이 아니라 비지인들이 만나 App에서의 공간을 놀이 장소로 활용하는 개념임. 컨텐츠의 경우 매우 자유분방하며(틀이 없음) 양방향 실시간 서비스 사용에 대해 사용자들도 거부감, 거리낌이 많이 사라졌고 허들이 굉장히 낮아졌음. 옛날에는 아프리카나 유튜브 방송을 하기위해 내가 정보를 많이 지니고 있고 비쥬얼적으로 특별하거나 재능 · 특이한 테마가 있어야했으나 비지인 양방향 실시간 Video Social App의 경우 이에 대한 허들이 굉장히 낮음.
소셜 비디오 서비스에 담겨진 사용자 경험을 고려한 장치

Sportify, Airbnb, Instagram은 UI 요소들의 특징이 많이 감춰지고 있고 컨텐츠들이 더 강조되고 있음(Contents Centered Design). 하지만 Social Video 서비스의 UX 장치의 경우 심리, 기술, 맥락, 소셜, 보상, 컨텐츠 등의 단어로 표현하기 힘든 디테일한 부분들도 존재
- 심리 - Ex. 얼굴 보정 이펙트 (사용자가 화장을 하지 않아도 영상 촬영시 불편함이 없도록 심리를 파악하여 사용자의 허들을 낮춰줌)
- 맥락 - 사용자의 뒷 화면을 가려줌으로써 방송을 할 수 없는 상황임에도 방송을 할 수 있도록 허들을 낮춰줌. 또한 사용자가 있는 Context에 따라 Video를 Audio로 바꿀 수 있음 (Voice Only 방송). 나 자체를 완전히 드러내지 않는 장치들이 심리적 장벽을 낮춰주고 서비스의 접근성을 높이고 있음.
- 기술 - 손 떨림방지 기술을 가진 회사를 인수한 인스타그램과 같이 인스타그램 서비스에 기술을 녹여내어 사용자들이 더 퀄리티 있는 비디오 컨텐츠 및 사진 컨텐츠를 많이 업로드할 수 있도록 함. (기술이 UX를 건드린 부분)
- 소셜 & 컨텐츠 - 게임을 지켜보거나, 함께 참여할 수 있는 개념. 비디오 서비스가 포용할 수 있는 다양한 컨텐츠가 존재하고 그로인해 Social한 효과를 만들어냄. (Ex. 함께 게임을 하거나 게임을 지켜보며 커뮤니케이션) 또한 Azar에서는 2명의 유저가 방송을 하는 방의 경우 'PK Mode'라는 Mode가 존재하는데 2명의 방송 유저끼리 경쟁을 하고 시청자들은 승패를 주는 개념으로 이 또한 소셜 & 컨텐츠 효과를 만들어내는 사례 중 하나.
- 소셜 - 소속감을 느낄 수 있게하는 커뮤니티 기능도 존재. 나를 표현하고 관심을 받고 싶은 유저의 심리를 관통하여 채팅창에 입장할 경우에도 일반적인 입장이 아닌 화려한 이펙트와 함께 입장하는 효과도 유저가 직접 구매하여 적용할 수 있도록 하였으며, 이와 같은 이펙트를 구입하고 VIP 뱃지를 다는 개념들이 나를 표현하고 관심 받고싶은 심리를 반영한 것. 또한 경쟁심리와 존재감 또한 나타낼 수 있으며, 방송을 하는 Broadcaster에게 선물을 많이 한 유저, 매칭을 많이 받은 유저 등 랭킹을 보여주는 것도 비지니스에서 실제로 의미있는 성과를 나타내었음.
- 보상 - 유저로부터 강력한 동기부여가 되는 부분. 유튜브에서도 방송을 보고 실제로 돈을 보낼 수 있는 기능과 같이 사용자가 방송자에게 보상을 할 수 있는 기능 또한 방송자에게 강력한 동기부여가 되고 그로 인해 Azar라는 서비스가 유지될 수 있으며, 더 많은 사용자를 유입하게할 수 있다고 생각함.
우리가 겪고 배운 것들
- 세계화 & 현지화 - 현지화 되었을 경우 이름이 안 좋은 의미는 아닐지 등 현지화 경우 문제가 발생되는 점들이 없는지 여러 고민을 함. 또한 인식하고 행동하는 차이까지 파악이 필요. (우리나라의 경우 스와이프를 Left to Right로 스와이핑하지만 Right to Left의 방향으로 스와이핑을 하는 국가들이 존재함) 현지인 QA가 검증하는 것이 제일 좋으나 현실적으로 200개국을 모두 현지 QA가 검수할 수 없으므로, 구글이 지원하는 RTL 문서 규정을 잘 참고해볼것.
- 글로벌 QA - 위의 '세계화 & 현지화' 요소와도 같이 나라별 네트워크, 디바이스 환경을 고려한 App 서비스 및 기능을 제공해야함
- 소통의 이슈 - 다국적 사용자를 가진 App이니 만큼 타국 사용자들이 만났을 경우에 각국의 언어로 서로 인사할 수 있도록 인사말을 Azar 내부적으로 제공. 내가 방송에서 만난 사용자의 국가의 인삿말들을 Azar가 보여주니 매칭되었을 때의 소통 시간이 늘어난 유의미한 결과를 볼 수 있었음. 또한 관심사도 선택하여 보여줄 수 있는 기능을 적용하여 대화 테마를 만들어 주는 기능 또한 존재.
- 자기 표현 - 유료 회원의 경우 VIP 뱃지를 달아주는데, 실제로 VIP 뱃지를 달고 있는 유저들의 경우 다른 사용자들이 더 많이 매치를 원하였음. (자기 표현 요소 제공의 중요성)
- Effect - 문화적, 인종적 배경에 따른 선호 차이가 존재하며(피부 색이 어두운 인도같은 곳에서는 밝은 필터에 대한 선호도가 있고 북유럽 같은 곳은 밝은 필터를 비선호하는 것으로 보여짐) 중동지역에서는 얼굴을 드러낼 수 없기때문에 얼굴을 인지하기 어려운 수준의 이펙트도 많이 사용하는 것을 볼 수 있었음. 또한 안경 · 선글라스와 같은 Effect 아이템을 많이 사용함. 그리고 눈썹이 원래 진하고 수염이 많기 때문에 눈썹, 수염과 관련된 이펙트의 경우에는 잘 사용하지 않음. 우리의 얼굴은 아시안이기 때문에 우리 나라 얼굴형이나 눈, 코, 입 위치를 기준으로 개발해서는 얼굴형이나 이목구비 스타일이 많이 다른 타국의 경우 이펙트가 잘못 적용될 수 있으니 여러 안면 인식 테스트가 필요함
- EVENT & MATCHING - 종교적 행사나 국가별 행사, 이벤트, 문화적 차이를 잘 고려해서 적용하면 좋을 것 (행사, 이벤트별, 국가별 테마 및 앱 디자인, 이펙트 적용)
- 국가별 차이 - 가끔은 이유를 모르겠는 부분이 있으나, 계속 찾고 있는 중. 어떤 국가의 경우에는 선물을 보내고 VIP가 되는것을 좋아하는 국가가 있지만, 그렇지 않고 부담스러워하는 국가가 있음. 현상만으로는 원인이 시원하게 밝혀지지 않는 이유들은 계속 찾고자 시도 중.
우리가 일을 하는 방식
- 아자르 스튜디오 - Product Manager, Product Designer, Developer가 있음. (3가지 조직이 스튜디오에서 일함) 이 외에는 Creative Design 부서, Ux Researcher 부서도 있음.
- UX에 대한 부분들은 꼭 디자이너분들만 관여하는것은 아니고, 개발자 · PM 중 UX 전공자도 많기에(HCI) 모든 조직이 UX에 관해서는 관여하는 편.
- Discover - 레퍼런스를 찾아볼 때 유명한 Bechance, dribbble도 참고하지만 연사님은 Product Hunt & Muzli 를 많이 활용 - Product Hunt에서 새로운 서비스를 많이 보고, Muzli에서 Tech, The Buzz 등에 나오는 부분들을 많이 봄 (인수 소식, 업계 소식등을 보고 그 서비스가 어떻게 바뀌어나가고 있는지 지켜봄)
- Monitoring = Version History + Market Review (관심있는 앱들을 처음 다운받고 쇠퇴 전 단계까지 계속 앱을 지켜봄. 버전에 대한 히스토리를 살펴보고 Market Review를 봄. Updates상황도 계속 모니터링 함.) ※ App Annie > 모바일 환경, 모바일 마켓 분석 서비스 https://www.appannie.com/en/
- Simulation - 이전에는 Principle을 사용했으나, 지금은 Protopie를 사용하고 있음. (사용하기 편하고 쉬움), 협업하는 사람들을 설득하기 위해서도 프로토타입화가 필요함.
Q&A Time
- 무해한 컨텐츠를 대응하는 방식은? 무해한 컨텐츠의 경우 AI 딥러닝을 통해 사용자의 잘못된 행동을 App 내에서 해결하고있음. 이 부분에 대해 굉장히 중요하게 생각하고 대처하고자 여러 방편으로 노력하고있음.
- 초반의 비즈니스 모델이 궁금하며, 비디오 관련 컨텐츠들이 여러 개 있으시다고 하셨는데 각각의 수익모델이 다른지? 처음부터 azar와 비슷한 수익모델을 가지고 있었고, 다른 컨텐츠들의 경우 azar와 수익모델이 다르며, 사용자 경험 또한 매우 다를 것임. 회사에서 과감한 신규 서비스에 대한 투자를 할 때 수익은 신경쓰지 않고, 유저가 반응하느냐, 유저가 좋아하는지에 대한 부분을 우선적으로 보려고 함.
- 지금은 시대의 흐름에 맞게 Video contents + Social service가 주력이나, 혹시모를 시대의 변화와 함께 PLAN B가 있다면? 지금은 잘되고 있지만, 항상 불안감이 존재함. 그렇기때문에 지금처럼 새로운 서비스들을 계속 만들어나가고 있음. 새로운 먹거리들을 계속 찾아나가고 있음
- Product Designer의 경우 몇 명인지? Product Designer의 경우 3명.
- Azar가 추구하는 미션 · 아이덴티티는? 소셜의 기능과 같이 친목, 혹은 자기의 시간을 지인이 아닌 누군가와 공유할 수 있는 소셜 비디오 플랫폼. 나 또한 처음엔 이 서비스는 뭘까? 라는 생각이 들었는데, 혼자 있기 싫을 때, 누군가와 대화하고 싶을 때 App을 키면 누군가가 존재하는 부분들이 방송과 Dating적인 부분들이 모두 부가적으로 발생되는 서비스라고 생각.
- 15개의 다른 서비스를 출시하는 이런 부분들은 TF Team이 Building되는 부분인지, 어떻게 만들어지는 부분인지? 한 3-4주만에 프로젝트를 만들고(주로 짧게 잡고) 마케팅팀에서 돈을 지원받아 반응을 지켜보고 잘 될 경우, 조금 더 팀 충원을 받아 프로젝트를 키워나감.
- Azar 초기 User의 유입 장치는? 현지에 현지 근무 직원분들이 계시는 나라의 경우 직원분들이 유입시켜주기도 하였음.
Seminar Review
세미나 참석 전에는 웹 상에서 아티클로만 접하게되었던 2019년의 전반적인 UI, UX 트렌드의 흐름을 세미나라는 자리에서 조금 더 자세히 알아보고자 참석하게 되었던 세미나였으나, 단편적인 트렌드라는 주제를 넘어서서 각 연사분들께서 진행하신 실재화된 프로젝트와 연사분들께서 재직중인 사업체가 가지고 있는 디자인 프로세스 및 시스템, 그리고 머리로는 인지하고 있으나 실무 환경에서 A to Z로 모두 실천하기 어려운 UX 디자인의 원론적인 이론과 방향성까지 다시금 복기할 수 있어 여러모로 너무나도 배움과 깨달음이 컸던 의미있는 자리였다.
또한, 4가지 세션들의 경우 서로 다른 연사분들의 각기 다른 주제로 이루어진 세션들임에도 불구하고 모든 세션들이 공통적으로 시사하는 바가 존재하였는데 키워드로 정리하자면 'Context'와 'Empathy'라는 두 단어로 요약할 수 있다고 생각한다. 이 Product를 주로 이용하게될 사용자는 어떠한 사용자이며 사용자에 몰입하여 공감하는 자세로 해당 사용자가 Product를 사용하는 환경, 또한 그 Product가 만들어지는 환경 등 너무도 다양한 Context와 환경에 따라 디자이너는 최대한 타겟 사용자와 맥락, 환경, 그에 필요한 리서치, 도큐먼트, 데이터에 기반하여 화려한 인터페이스를 가진 프로덕트보다 사용성에 중점을 두어 사용성과 비쥬얼이 모두 합일되는 거시적인 디자인 프로세스를 따라야한다는 것이다.
트렌드라는 시대적인 경향 또한 디자이너가 절대 경시할 수 없는 요소이지만, 트렌드라는 일시적인 현상 이전에 궁극적인 UX 디자인 및 디자인 프로세스, UX 디자이너로서의 애티튜드에 대해 다시금 제대로 깨닫고, 배울 수 있었던 너무나도 귀한 시간이였다.
Share article