평택대학교 정보디자인연구소 2014년 12월 3일

1. 모바일 앱(App) 디자인과
모바일 시장 변화의 이해잏
Vercoop Inc
하 승 범
2014-12-03

2. Intro… 하 승 범 Vercoop Inc.
한국사업총괄/상무 2014년 ~
미디어 콘텐츠 유통 플랫폼 사업추진
㈜다우기술 콘텐츠사업본부장/상무, 2012년 ~
영화/방송콘텐츠 부가판권유통 및 뉴미디어 사업
㈜다우데이타 모바일사업본부장/상무, 2010년 ~
스마트폰 및 태블릿PC B2B 서비스 및 사업총괄
㈜다우기술 eBiz사업본부장/상무, 2005년 ~
유니텔 등 인터넷서비스 사업 및 B2B2C 영업 총괄
1998년 ~ ㈜다우기술 인터넷사업부 팀장, 인터넷 신규기획 및 원격교육사업
1996년 ~ 한국엠엘티㈜ 대표이사, CD-ROM 개발 및 컴퓨터 주변기기 수입유통
1993년 ~ ㈜다우기술 멀티미디어사업팀 과장, 멀티미디어 신규사업 및 CD-ROM 기획개발
1990년 ~ 삼성전자㈜ 반도체부문, DRAM Assembly Test 및 QC 프로그램 개발
중앙대학교 전기공학과 졸업
2000년 ~ ㈜이너베이 부사장, 유무선 메신저 및 콘텐츠 서비스

3. Section 01
모바일 앱(App)의 이해와 시장현황

4. 스마트폰 사용자의 급속한 증가
7,200백만명
2,500백만명
34.7%
5,567만명
3,904만명
70.1%
407백만명
2,400백만명
589.6%
2015년 12월 예상 2014년 6월 2013년 12월
출처 : 미래창조과학부 2014-06. 통계청 2012-12, Portio Research/SA 2013

5. 모바일, 대한민국을 지배하다
출처 : 닐슨코리아클릭 2014-10
스마트폰 사용자
3,904만명
유선인터넷이용률
77.0% ↓
Only 모바일이용률
11.3% ↑
안드로이드이용자비율
92.7%
매일 모바일인터넷이용
85.0%
일평균 모바일이용시간
96분

6. 모바일 앱(App) 유형과 그 비교
Native App Web App Hybrid App
장 점
구동속도가 빠르다
가장 동적으로 표현할 수 있다
인터넷 연결 없이 사용가능
개발기간이 짧다
업데이트, 수정변경이 용이하다
mOS 무관 웹브라우저로 접근
구동속도는 중간
필수적인 요소만으로 개발가능
동적인 데이터는 실시간 통신
단 점
개발기간, 비용이 상대적 높다
앱스토어를 통해 등록 배포
각기 다른 mOS,버전별 개발
인터넷 접속으로 구동이 느리다
스마트폰 특정기능 사용불가
(GPS, 카메라, 센서기능 등)
자체 사이트만 지원하므로
타 사이트 브라우징 불가능
네비게이션 사용자 불편함 증가
비 고
빠른 구동속도 및 스마트폰에
최적화된 앱(App) 개발가능
웹브라우징을 통한 높은 접근성
별도의 설치과정이 없이 사용
Native App과 Mobile App의
장점을 수용한 방식
Native Application Mobile Browser
Web Code
HTML5/CSS/JS
Native Container
Web Code
HTML5/CSS/JS
Device APIs Device APIs

7. 모바일 앱(App) = 네이티브 앱(App)
모바일 앱(App) 모바일 웹(Web)
8
632
15
1,005
22
1,366
32
1,764
45
2,202
단위 ; 억건
62
2,625
2012 2013 2014 2015 2016 2017
출처 : 가트너 2013-09
모바일 앱(App) 시장은 모바일 기기에 최적화되어 개발되는 네이티브 앱(App) 주도
웹 앱(App) 콘텐츠 적용 편리, HTML5 개발경험부족, 멀티플랫폼 최적화문제로 한계
네이티브 앱(App)과 웹 앱(App)의 장점을 수용한 방식의 ‘하이브리드 앱(App)’성장

8. 모바일 앱(App), App Store 분류
단말제조 운영체계개발 통신서비스 독립사업자
주요
사업자
Apple App Store
Blackberry App World
LG SmartWorld
Nokia OVI Store
Samsung Apps
HTC Apps
Google Play
Windows Phone Store
MS one App
Firefox Marketplace
Windows Store
SKT T스토어
KT 올레마켓
AT&T App Center
China Mobile Market
Orange App. Shop
Amazon Appstore
네이버 N스토어
AndAppStore
bPlay
OnlyAndroid
SlideMe
Store 13개 5개 약 30여개 100여개 이상
출처 : Reseach2Guidance 2013-06
판매등록 및 업로드 App 다운로드
개발자 App Store 사용자
수익분배 지불결제
애플 83만개, 구글 67만개, 블랙베리 4만개, 원도우폰 3.5만개 (2013년 3월 기준)
애플 120만개, 구글 130만개, 원도우폰 30만개, 아마존 24만개 (2014년 6월 기준)
주요사업자들은 App Store 플랫폼을 통해 생태계(Eco-System)을 장악하기 위해 경쟁

9. 모바일 앱(App) 시장 급성장, 그러나...
단위 ; 벡만건
다운로드 증가추이 2012 2013 2014 2015 2016 2017
무료 모바일 앱(App) 57,331 92,876 127,704 167,054 211,313 253,914
유료 모바일 앱(App) 6,654 9,186 11,105 12,574 13,488 14,778
Free App (%) 89.6% 91.0% 92.0% 93.0% 94.0% 94.5%
단위 ; %
모바일앱 매출전망 2012 2013 2014 2015 2016 2017
Paid App 82.8% 75.9% 69.5% 59.5% 47.5% 37.8%
In-app purchase 11.4% 17.2% 22.5% 30.9% 40.8% 48.2%
Mobile AD 5.8% 6.9% 8.1% 9.6% 11.6% 14.0%
출처 : 가트너 2014-01
이제 유료 모바일 앱(App)의 시대는 갔다.
무료 모바일 앱(App)으로 마케팅을 한 후, 유료 업그레이드 진행
무료 모바일 앱(App) 내부에서 콘텐츠 또는 제품의 구매 유도

10. 모바일 앱(App) 무료가 확산될 전망
2013-01 2013-11
Free App
Paid App
In App Purchase
89%
6%
5%
98%
1%
77%
12%
11%
단위 ; 수익비중 (%)
92%
4%
2013-01 2013-11
출처 : Distimo 2013-12, eMarketer 2013-12
Free App
In App Purchase
Paid App
무료 모바일 앱(App) 수요와 공급이 확대되면서 지속적으로 확산될 전망.
특정한 업무를 확실히 처리하는 실용적인 유료 모바일 앱(App) 시장 존재
모바일 앱(App) 자체로 수익을 내는 것이 아니라 활용하여 수익을 내는 구조로 변화

11. 모바일 앱(App) 요즘 많이 듣는 말!
1,300,000
1,200,000
300,000
240,000
“이제 모바일 앱(App)이라면 나올 만큼 나오지 않았나?”
단위 ; 모바일 앱(App) 등록숫자
“이젠 새로운 혁신적인 서비스가 또 나올께 있을까?” “그런게 뭐가 있지?”
130,000
Google Play Apple App Store Windows Phone Store Amazon Appstore BlackBerry World
출처 : Statistica 2014-07

12. 모바일 앱(App) 하지만 우리 주변은?
“여전히 불편해!!”

13. 그러나 모바일 앱(App) 현실는?
2014년 출시된 앱(App) 중에서 100만 이상 다운로드 된 앱(App)은? 단, 게임은 제외
(2014년 1월) (2014년 6월) (2014년 9월)
최근 1개월 모바일 앱(App) 다운로드 빈도.
77.4%
66.1%
2011년 2013년

14. 그러면 모바일 앱(App) 성공의 방향?
만능? 글쎄! 모바일 앱(App)시장에서는 선택과 집중 관점에서 기회 ↑
더 깊고 좁은 문제(Problem) 해결에 집중하는 것이 성공 가능성을 높인다.

15. 모바일 앱(App) 성공조건!
⑴ 강력한 Field Player
음식주문/배달, 숙박, 부동산, 쿠폰/마일리지, 주차장/자동차공유, 차량수리 ↑
O2O(Online-to-offline) IoT(Internet of Things) 웨어러블 디바이스 …

16. 모바일 앱(App) 성공사례
어린이집/유치원 수기 알림장을 스마트폰 알림장으로 대체
시장점유율 20%↑
재방문율 90%↑

17. 모바일 앱(App) 성공조건!
⑵ 경쟁력있는 Tech Company
The Intersection of Mobile and Physical World
How to Get Mobile Contextual Data and Analyze It
Cloud Integration – Intelligence from Data
Intelligence and Cognition
New Mobile Devices

18. 모바일 앱(App) 성공사례
‘이미지 인식기술’을 통해 이미지를 통한 정보검색 기술개발
Barrel = 82.8%
Triumphal arch = 100%

19. 모바일 앱(App) 성공사례
‘이미지 인식기술 (Image Recognition)‘과 ‘Fashion’의 결합

20. 하지만 모바일 앱(App) 시장은 …
Nick D'Aloisio

21. Section 02
모바일 환경에 적합한 사용자 경험 디자인

22. UX is not UI
UI (User Interface)
UX (User eXperience)
사용자 경험을 만드는 구체적인 행동 관찰 사용자와 서비스를 잘 이용하도록 지원
경험에 따른 ‘감성요소’↑소비자 선택 지원 ‘화면설계’를 통해 사용자의 편리성 증대
EMOTIONAL TECHNICAL
UI is a Small Part of UX, UX Designers and UI Developers are Complementary

23. UI ; User Interface 구성요소
Status Bar
Navigation Bar
Custom Bar
Tab Bar
ToolBar

24. UI ; User Interface 와 콘텐츠
(1) 동적 콘텐츠 (Pull)
; 변동기준 분류기법
(2) 정적 콘텐츠 (Push)
; 관리자에 의한 조정
(3) 킬러 콘텐츠
; 전략적인 콘텐츠
; 프로모션 연계
; 오프라인 이벤트

25. 모바일 앱(App) UX/UI
“모바일 환경에 적합한 사용자 경험 디자인”
UX UI
Designing for Emotion User Interface
“제품 = 디자인, 감성, 사용성, 편리성의 결합체”
Usable Useful

26. 모바일 앱(App) UX is Everything
“사용자 경험은 디자인의 대상이 될 수 있는가?”
“사용자 경험(UX)는 규칙(Pattern)을 찾는 작업”
“UX은 Design되지 않고, UX Pattern를 Design한다”

27. Usability Findings & Guidelines
A B

28. Context of Mobile Interaction

29. 모바일 앱(App) UX/UI

30. UX=인간+기술+비즈니스=종합 디자인
기술
(Technology)
비즈니스
(Business)
단순생산
모바일
UX
인간가치
상호작용
디자인
조직행동
(Value of Human)

31. 모바일 UX 의 중요성
본 능 기 억 신 뢰 행 동
사용자 경험 (UX) = 복잡한 것을 쉽게 “단순”하게 만드는 것
사용자 경험 (UX) = 사람들이 기억하는 사소한 경험
사용자 경험 (UX) = 본능 = 기억력 = 무의식적 행동 = 규칙
사용자 경험 (UX) = 사용자의 규칙(Pattern)를 디자인한다
사용자 경험 (UX) = 사용자의 최종 목적인 “행동”을 끌어내는 것

32. Web과 다른 모바일 UX/UI 개념
모바일 기기(H/W) 구성과의 연관성
사용자와 24시간 함께하는 밀접성
사용자와 상호작용(Interaction)하는 환경
Touch, Gesture, Audio 등을 이용한 입력(Input)방식
모바일 기기가 갖고 있는 센서(Sensor)를 적용하는 환경
휴대성(Mobility)이 극대화된 환경
모바일 운영체계(OS)가 탑재된 환경

33. UX & UI ; App 전략 및 목표 설정
⑴ Customer 선언 + Life Goal → Target Customer
⑵ Target Customer의 Experience Goal 선언
⑶ Contents + Service (Function) 영역 선언
⑷ Contents & Function List
⑸ Persona에 의한 Activity 도출

34. UX & UI ; App 전략 및 목표 설정
⑹ Service Scenario 설계
⑺ Task 선언 ; Activity 그룹화
⑻ Task & Flow 설계
⑼ Service Logic 설계 → Sketching
⑽ Page Code별 UI Component 구성도

35. 모바일 UX 프로세스
사업기획
아이디어
시장조사
고객분석
IA 설계
(정보구조도)
Mobile UI
Storyboard
Visual Design User Test
아이디어
발상
모바일향
아이디어
모바일기획
키포인트
시장조사
Research
모바일환경
트렌드이해
고객분석
Research
결과도출
Mobile IA
설계
Service Flow
(Flow Chart)
Mobile UI
Design
Storyboard
작성
Wireframe
작성
Source
Coding
Mobile UI
Pattern설계
서비스별 UI
Pattern설계
Interface UI
설계
Visual Style
Guide
Mobile GUI
Guideline
Mockup
제작
기본단계 패턴설계

36. 모바일 UX 의 4가지 원칙
⑴ 디자인 하기 전, 상황을 이해하고 질문하라
⑵ 유연한 UXD(User Experience Design)을 한다
⑶ 모든 사용자가 당신과 같지 않다는 사실을 인정한다
⑷ 공감하고 더 좋은 경험을 디자인한다
UX Pattern Design = “관심”과 “호기심” 그리고 “소통”

37. Section 03
모바일 ICT 트랜드를 이해해야 성공한다

38. 기술혁신은 새로운 행동양식과 인간관계 요구
“Wheel of Disruption”

39. 끊임없이 나타나는 혁신 기술과 새로운 매체, 기기
Internet of Things Amazon Drone Wearable Device
3D Printer Smart TV Smart Healthcare

40. Wearable Device is a Fashin Accessory

41. Wearable ; ‘스마트워치’ App 생태계와 디자인

42. 메이커 혁명의 시대 ; DIY문화의 기술기반 확장

43. 메이커 혁명의 시대 ; Funding 구조의 변화
“USD 10,266,846”
“USD 2,437,429”

44. Visual Computing ; Virtual AI + AR

45. 가상현실 대중화로 확산될 수 있을까?

46. Visual Computing ; VR과 스마트폰의 만남

47. Internet of Things ; 초연결시대 사물인터넷
With the Smartphone
“SDK & App Store”
“App as a Service”
Next of Smartphone
“Open Hardware”
“H/W as a Service”
Internet of Things ;
with Intelligence
with Connectivity
with Sensor
with App

48. Internet of Things ; 우리 생활 속 사물인터넷

49. Always-Connected People

50. 수치와 데이터로 읽혀지는 삶 ; Quantified Self

51. 넘쳐나는 데이터와 정보 ; Big Data의 미래는?

52. Omni-Channel ; 메시지와 정보의 과잉시대

53. Omni-Channel ; 정보취득과 의사결정과정 다변화

54. 온 오프라인 유통경로의 변화 ; 쇼루밍, 모루밍

55. Cognitive Computing and Robot

56. Social Robot ; 또 하나의 가족 소셜 로봇

57. Industrial Economy vs. Sharing Economy
Industrial Economy
“Money”
“Centralized”
Sharing Economy
“People”
“Distributed”
“Global” “Local”

58. 콘텐츠 유통방식 ; 전통적인 TV 방송시장지형 변화
Operator Walled-Garden Service Over The Top (OTT) Service
통신사업자가 영화, 방송 등 콘텐츠를 구매하여
“자사 가입자” 대상으로 서비스
사업자가 영화, 방송 등 콘텐츠를 구매하여 “인터
넷에 연결된 모든 이용자” 대상으로 서비스
ex, 국내 통신사 IPTV, Cable TV MSO ex, Netflix, HuluPlus, Amazon, Smart TV
OTT, 미국에서 (1) 플랫폼 확보 용이 (2) 초기 투자비용 낮은 편 (3) 상대적 규제에서 자유로움, 성장
Over The Top 사업자 유형
가입자기반 사업자
Netflex, Hulu
가입자에게 월정액을 받고 콘텐츠 사업자로 부터 구매한 콘텐츠를 서비스
이용자에게 제공하는 사업자. “Contents Aggregator”
광고기반 사업자
Youtube
광고를 기반으로 짧은 동영상, UGC, 뮤직비디오 등을 주로 제공하고 광고수
익을 얻는 사업자
e커머스기반 사업자
Amazon
기존 아마존 고객을 대상으로 동영상 콘텐츠의 판매를 위한 복합상품 등을
연계한 N스크린 서비스 사업자.
국내 서비스 사업자 지상파 콘텐츠연합, 푹(Pooq) 유료방송 CJ헬로비전, 티빙(Tving)

59. 콘텐츠를 활용한 “시간점유율”에 집중하라!
단순함을 통한 결정적 순간의 획득 ; Member’ “moments of truth”
‘제로TV가구’ 증가세 확대, 이것이 ‘TV 종말의 시대’의 종말인가?
콘텐츠 소비방식 변화 ; Cliffhanger Ending vs Binge Viewing

60. 짧고 굵은 드라마 ”웹드라마” ; “스낵컬처”
모바일 기기에서 시청, 적합한 10~1분 분량 영상 콘텐츠
짧은 시간 간편하게 소비하는 문화 콘텐츠(웹툰, 웹소설, 웹드라마) 활성화
‘클립형 영상“ 공유에서 “창작형 영상“ 콘텐츠로 진화
기존 TV 드라마와는 다르게 접근 – 젊은 세대를 목표하라
TV, 중장년 고시청, 모바일 영상 젊은층 고시청
⑴ 다양한 소재의 웹툰 영상화로 진화 ⑵ 아이돌 중심의 다양한 배우 캐스팅
기업의 새로운 마케팅 Tool! 간접광고(PPL)의 진화
기존 TV방송 대비 낮은 제작비 ( TV드라마 1편 = 웹드라마 시즌 1 (6편))
기업이 직접 웹드라마를 제작 = 모바일 소셜 등 다양한 유통매체의 확대

61. ‘스낵컬처“의 성장전략 ; “재미있고 유용한 콘텐츠”

62. From Mobile First to Mobile Centric
Internet of Everything

63. myxlog@stevenh.net
seungbeomha
@seungbeom
stevenh.net / stevenh.co.kr