• isotope 사이트
• masonry 레이아웃

위 사이트의 플러그인을 활용해서 핀터레스트 처럼 카드의 height에 상관없이 막 움직이는 사이트를 만들고 싶은데;;;
안되고 있음 ㅠㅠ

그리고.. 참고사이트를 보면 부드러운 애니메이션이 구현되어 있는데, 내꺼는 안되고 있음 ㅠㅠ
내가 뭘 잘못했는지 파악이 안됨;;;

#5. Lesson 5 | “The Consumer–Brand Relationship”

마케팅 채널

• 마케팅 채널에 따라서 각각 다른 접근이 필요합니다.
• 마케팅 채널은 총 4가지 카테고리로 구분할 수 있습니다. (검색, 디스플레이, 비디오, 소셜)
• 이미지 001

검색 광고에서 봐야하는 지표

• Click-Through Rate: 검색 광고를 클릭하고 들어가는 비율
• Macro Conversion Rate: 판매에 영향을 주는 컨버전
• Cost Per Acquisition: 신규유저 유입비용

디스플레이 광고에서 봐야하는 지표

• 디스플레이 광고는 interactive 하게 바뀌고 있음.
• Click-Through Rate: 클릭하고 들어가는 비율
• Macro Conversion Rate: 판매에 직접적으로 영항을 주는 컨버전 rate.
• Cost Per Acquisition: 신규 유저 유입 비용
• Events / Visit: 이벤트, 방문자 수 등

비디오 광고에서 봐야하는 지표

• Video Views: 비디오를 끝까지 다 듣거나 Full-length (“complete”) 일부만 보는 경우를 모두 포함함 partial (“incomplete”) 비디오 뷰.
• Play Through Rate: 비디오를 끝까지보는 시청자의 비율
• Engagement Rate: 비디오를 보고 정해진 액션을 하는 비율

- C세대는 대부분은 비디오를 만들어 본적이 있다.
- 2/3의 시청자들은 '브랜드가 마음에 들면, 다른 사람들에게 소개하겠다' 라고 했음. 
- 56%의 C세대들은 유튜브의 광고를 보고 반응했다. 
- 76%는 유튭에 매주 들어오고 36%는 매일 방문한다. 

소셜 광고에서 봐야하는 지표

• Audience Growth: 팔로우나 라이크가 증가하는 비율 등
• *Amplification Rate: 리트윗 등을 통해서 확대되는 비율 *
• Applause Rate: Likes, +1’s, Favorites 등을 받는 비율
• Micro Conversion Rate:

추가로 봐야하는 자료
[Online video and “Generation C”](http://think.storage.googleapis.com/docs/the-power-of- gen-c-connecting-with-your-best-customers_articles.pdf)
[The simple truth about search:](http://marketinggeek.blogspot.com/2007/02/search-is- more.html)
[How banner ads are placed and the data involved](http://battellemedia.com/archives/2013/05/behind-the- banner-a-visualization-of-the-adtech-ecosystem.php)

• ID를 직접 달고 들어온 경우에는 카드를 revealed 상태로 표시하고 싶음.
• 현재는 카드 하나만 덜렁.. 있음
• http://dusskapark.github.io/analytics101/?id=1637579389859351

광고를 어디에 달 것인가?

광고 위치 및 어떤 광고 플랫폼을 사용할 것인지.

광고 효율성을 측정하고, GA로 분석하기

구글 플러스 주소 - https://plus.google.com/u/1/communities/111231601305395904092

Coursera Module 2 > Lesson 2 : Basic Analytics

스터디의 목적

• 일단 데이터라는 것이 너무 많다. (심할 정도로 많다.)
• 그래서 각 데이터의 의미를 이해하고
• 사용자의 행동 및 경험을 파고드는 것이 필요하다.

웹사이트의 데이터 수집

• 쿠키와 태그를 활용해서 수집한다.

Pyramid model of web data

• 웹 데이터는 피러미드 형태로 정보를 구성한다.
• 피라미드 위로 올라갈수록 중요한 정보이다.
• Hit
  • html/css 등 코드 레벨의 정보이다.
  • hit은 이미지를 교체하거나 영상 임베드 등으로도 올라갈 수 있으므로 의미있는 지표가 아니다.
• Visit
  • 일반적으로 생각하는 UV 이다.
  • 누군지는 모르지만 Unique 한 사용자가 '방문' 한 경우.
• Unique identified Visitors
  • 누군지 알고 있는 사용자가 언제 방문했고. 등
  • LV(Login Vaule) 정도에 해당함.
• DATA는 양이 적을수록 가치가 높다.

각 사업별로 중요한 데이터

• 사업의 규모에 따라서 쓸 수 있는 예산의 숫자가 작다.
• 또는 서비스의 규모에 따라서 해야하는 행동의 차이가 있다.

작은 사업자

• 초기 사업자는 Acquisition 이 가장 중요하다.
  • 이유는 신규 사업자의 경우 외부에서 새로운 사용자를 끌고오는 것에 집중해야 하기 때문이다.
  • 따라서 초기 현금을 효과적으로 활용할 수 있도록 지표를 관리해야 한다.
• 따라서 Cost per acquisition 또는 New User acquisition cost (UAC)가 상당히 중요하다.
• 상세하게는 아래와 같다. (CPA, CTR NewVisitsRate)

중간 규모 사업자

• 가장 중요한 것은 사용자의 행동 패턴(Behaivor) 이다.
• 초기 단계가 넘은 사업의 경우는 내부 사용자를 분석하고 그에 맞는 서비스나 조치를 내려야 한다
  • 따라서 이탈율, 새션당 페이지 수(Page Depth), 구매 전환/이탈율 등 관련 지표를 관리해야 한다.

대규모 사업자

• 대형 사업자의 경우는 수익 극대화가 가장 중요하다.
• 목표전환율(ConversionRate)과 각종 지표를 관리해야 한다.
  • 다만 5번의 Assisted Conversion은 따로 측정해야 하는 이유를 잘 모르겠다.
  • (뜻은 2개이상의 마케팅 체널에 노출된 경우, 각각의 컨버전을 잡는 것인데... 뭔 의미가 있는 것인지?)

예를 들어

• 사용자가 http://dusskapark.github.io/analytics101/#1637579389859351 를 친구에게 공유했는데,
• 친구가 해당 주소를 눌렀을 때, 웹브라우저가 불러온 API (20개)에 1013878668644263 항목이 없을 경우에는 동작이 실패함
• 따라서 hash(#1013878668644263)를 브라우저에 직접 치고 들어오는 경우(direct)에는 id=1637579389859351로 변경해서 처리해야함

카드가 열릴 때, 플레이 되는 카드를 가운데에 놓기

Lesson 3 An Introduction To Web Analytics Tools,

Analytics의 3가지 카테고리

고급) 기업용 패키지

• 기업용 유료 Analytics 툴이 많지만 비싸다.

중급) Point Solutions

• Analytics는 마케팅의 다양한 숙제들를 풀어내는데 실마리를 제공한다.
  1. 마케팅 성과 측정 또는 AB테스팅 등
  2. Attribution 모델 (First, Linear, Last)
  3. 사이트 최적화
  4. 미디어 최적화

초급) Analytics 가젯

• 클릭스트림 애널리틱스, 수익 애널리틱스 등 간단한 수준의 애널리틱스
  • 예) 야후 웹 애널리시스, 구글 애널리틱스, 몽구스 매트릭 등
• 공짜 또는 매우 저가로 제공함
• 어떤 것이 가장 자신의 비즈니스에 도움이 되는지를 잘 파악해야 한다.

비즈니스 사이즈 별 분석도구 사용 우선순위

다른 분석도구도 중요하지만 특히나 중요한 것이 각 비즈니스별로 있다.

• 소기업: ClickStream Analytics
• 중기업: 수익보고서
• 대기업: VOC

Anlytics Gadgets

No tool is ever as valuable as the analyst.

툴은 데이터를 수집하고 정보를 주지만, 분석가가 하는 일이 더 중요하다.

카드의 어디를 눌러서 reveal을 했는지?

비디오 플레이

1. reveal 한 카드에서 플레이버튼을 눌렀는지?
2. 눌렀으면 얼마나 플레이를 했는지

여러방향으로 활용할 수 있도록

비디오 플레이어를 video.js로 교체를 하려고 합니다

• 구글 비디오 광고 추가
• 비디오 플레이어의 스타일 커스텀 등

#6. Lesson 6 | Data, Data, Everywhere

raw data와 processed data

data 출처의 크기

• raw data >> processed data 로 발전

예) 20대 여자 
+ 커피 애호가 (관심사)
+ 커피 사이트 방문자 (인텐트)
+ 리마케팅 대상

![screen shot 2015-08-02 at 2 00 15 am](https://cloud.githubusercontent.com/assets/4177529/9022795/4d526234-38be-11e5-8148-8676f7d44a51.png)

데이터를 획득하는 방법

• API, CSV다운로드, web에서 스크랩핑

획득한 데이터의 오류(bias)문제

• 질문 오류: VOC, 설문지 등의 경우 애초에 질문이 문제가 되는 경우는?
• 샘플링 오류: 잘못된 표본을 뽑았을 때의 문제,
• 해석의 오류: 애매모호한 상황을 해석자의 성향에 따라서 해석하고자 하는 성행
  #7. Lesson 7: New Media – New Data, New Opportunities, New Dangers

대부분의 내용은 기존 내용의 wrap up 인데, 일부 추가 내용이 있습니다.

소셜미디어의 새로운 Bios의 사례

• VTview.com의 사례
  • 돈을 내면 유튜브의 비디오 조회수를 올려주는 사이트
  • 유튜븨 조회수를 실제로 믿을 수 없다
  • 
• 영국 유명가수의 사례
  • 수백만명의 twitter follower를 보유하고 있으나, 실제로 트위터 이벤트는 완전히 실패했다
  • 약 2000명의 팬을 제외한 나머지 follower 들은 가짜이다.
  • 

구글이 해결책은 광고에 돈을 써라?

이 강의를 하고 있는 Harman 아저씨가 구글의 광고 담당이라 그런지.. 광고 영업을 살짝 넣으신 듯. 

• 마케팅에 사용할 수 있는 정보는
  • paid 돈을 내고 사용하는 광고성 정보
  • owned 직접 만들고 컨트롤 하는 공간 (예. 티스토어 배너 등!)
    • 홍보기사(PR), 유튭 채널, 트위터 계정, 페북 페이지, 제품(티스토어 등)
  • earned 남이 리트윗, 라이크를 해주는 것들 사실상 컨트롤이 어려운 정보이다.
• 구글의 주장에 따르면...
  • paid 가 가장 정확하고, 확실한 정보이고
  • earned 는 확장성이 높지만 신뢰성이 떨어진다.

parameter 로 API를 호출해서 화면을 구성하기

3개 먼저 보내고
17개는 나중에 그리기

MP를 통해서 할 것

카드가 열리면

• grid-item 에서 grid 로 클래스 변경
• card grid (co12) 가 변경됨

카드가 닫히면

• grid-item 으로 다시 변경됨
• video paused 됨

Lesson 4 - McKinsey Customer Decision Journey

ZMOT의 등장

전통적인 소비자의 의사결정 모델은 2005년 P&G에서 정의한 것처럼 Stimulus > FMOT > SMOT 과정을 따른다고 볼 수 있습니다. 즉, ++광고에 노출++된 소비자가 ++매장에서 제품을 골라서 구매++하고, 해당 ++제품이 만족스러운 경우 반복구매(로열티)++를 하게되는 것 입니다.

하지만 구글(Think Insight Google)에서 2011년 인터넷을 활용한 검색, 리뷰 읽기 등 정보탐색 확동이 구매 의사결정에 많은 영향을 준다는 것을 발표하면서 새롭게 ZMOT이라는 개념이 등장했습니다. 보다 자세한 ZMOT에 관한 내용은 아래 영상을 참고하기 바랍니다.

ZMOT 개념의 문제점

ZMOT은 말그대로 Messy 합니다. 따라서 ZMOT의 개념으로는 소비자의 구매흐름 모형 (CDJ)을 그리기 어렵습니다. 따라서 이를 잘 설명하기 좋은 모형으로 McKinsey에서 09년 발표한 Customer Decision Journey (CDJ)를 활용해서 소비자의 구매흐름을 따져봅니다.

CDJ 모델 설명

• 주요 레퍼런스는 [The Consumer Decision Journey:](http://www.mckinsey.com/insights/marketing_sales/ the_consumer_decision_journey) 를 참고하세요.

• Trigger
  • 이 고객이 왜 뽑뿌가 왔지? 왜 우리 사이트에 들어왔지?
  • 어디서 광고를 봤나? 친구가 추천을 했나?
• initial Consideration Set
  • 자동차하면 떠오르는 것에 우리 제품이 있나?
  • 컴퓨터 하면 떠오르는 것에 우리 제품이 있나?
    • 만약 없어도 다음단계(Active Evaluation)에서의 마케팅 활동으로 올릴 수 있다.
• Active Evaluation
  • ZMOT의 단계와 상당부분 유사하다.
  • 내 제품이 소비자의 니즈를 충족시킬 수 있나?
• Moment of Purchase
  • FMOT와 동일한 부분이다.
  • 이 상품을 샀으면 내 브랜드를 좋아하게 될까?
• Post-Purchase Experience
  • 구매 후 산 사람들이 만족할까?
• Loyalty Loop
  • 넌 내게 미쳐 헤어날 수 없어 I got you~
  • 로열티가 생기면 이전단계를 무시하고 산다.

각 모델의 상황별로 권장되는 Analytics Tool은?

• Trigger 단계
  • 고객이 왜 뽐뿌가 왔는지를 볼 수 있도록 ClickStream 분석을 하는 것이 맞다.
  • 예를 들어, Google Analytics에서는 어디서 왔는지(referral)이나, 유입 검색(keyword) 등이 중요하게 작용한다.
• Initial Consoderation Set 단계
  • 고객의 Top-of-mind가 어떤 것인지를 보면 좋다.
  • 랭키닷컴, 코리안클릭, AppAnnie 같은 서비스가 여기서 힘을 발휘한다.
• Active Evaluation
  • 다양한 실험과, A/B테스트 등이 해당한다.
  • 자세한 설명은 뒤에서 추가로 진행한다.
• Moment of Purchase
  • Google Analytics (E-commerce 설정 추가)
  • 얼마나 벌었나? 를 확인하는 용도
• Post-Purchase Exp & Loyalty Loop
  • VOC의 영역이다.
  • Analytics라기 보다는 Survey 의 영역

모바일 앱 비즈니스에서도 CDJ를 동일하게 적용 가능할까?

맞는 부분도 있지만 디지털 컨텐츠의 특징으로 말미암아 몇가지 중요한 차이점이 존재합니다.

• 무과금 유저는 고객일까?
  • 기본적으로 CDJ 모델은 FMOT 단계에서 소비자가 구매를 하는 것을 전제로 하고 있습니다. 하지만 인앱결제가 일반적인 '모바일 앱 비즈니스'에서 상품을 다운받는다고 바로 구매가 이뤄지지 않습니다.
  • 즉, 무과금 사용을 하는 것 자체를 ZMOT의 한 과정으로 볼 수 있을 것 같고, 확대 해석하면 모바일 앱 비즈니스에서는 다른 전통적인 인터넷 비즈니스(예를 들어, 인터넷쇼핑몰)보다 ZMOT의 과정이 훨씬 길다고 생각할 수 있습니다.
• 부분유료 상품만이 상품일까? 본체(모상품)이 상품일까?
  • 인앱결제 모델에서는 부분유료 상품, 예를 들어 '칼', '활' 같은 인앱 게임 아이템이 결제를 일으켰다면 소비자의 만족도나 로열티 루프에 영향을 주는 것일까? (대부분은 아니다. 모상품이 사용자 경험을 주도함)
  • 또한 인앱상품을 특정해서 마케팅, 프로모션을 진행하기도 어렵다.
  • 메시지A - 레이븐을 다운받으세요. | 메시지B - 레이븐의 앱내 결제로 '전설의 도끼'를 구매하세요.
  • 누가봐도 B가 생소하다.
  • A고객이나 B고객이나 모두 레이븐을 플레이했다고 기억하지, 전설의 도끼를 구매했다고 기억하지 않는다.
  • 인앱 아이템의 구매 만족도가 다른 게임의 구매로 이어진다고 보기 어렵다. 결국 무료앱인 본체(모상품)의 구매 경험/만족도가 동일 브랜드의 다른 게임의 무료 다운로드로 이어진다고 볼 수 있다.
    *유사한 모델이 뭐가 있을까?
    • 면도기 회사의 비즈니스 모델과 유사하다. (면도기 본체를 구매하고, 수익은 면도날로 버는 모델)
• 아몰랑.. 겁나 Messy 하다. (여전히 연구가치가 있는 부분)
• 도움되는 글
  1. https://www.thinkwithgoogle.com/articles/mobile-app-marketing-insights.html
  2. 한번 보세요. 시장 트렌드 보여주고 구글 솔루션 끼워파는 기술이 훌륭.

웹사이트 구축

• Markquery 스킨(bootstrap3 기반) 으로 블로그 웹 구축
  • 티에디션 적용
  • 햄버거 매뉴 구현
  • 콘텐츠 내부 CSS는 CDN 형태로 구현

앱 레이아웃 기획

• 웹과 거의 동일하게 그리기
• 리소스는 잘라서 쓸 수 있게 키노트로 구현
• API 범위에서 구현

누구를 위한 스터디?

Overview

• 스터디 OverView 키노트
• 인터넷 서비스에서 필요한 통계를 이해하자
• 이해한 내용을 실제 서비스에 적용해보자
• 보다 편리하게 GA를 사용할 수 있도록 지원해주는 공개된 Lib를 찾아보고 스터디 하자

스터디 내용

이론 스터디

Coursera 에서 진행되는 Marketing Analytics 강의를 수강함

• Digital Analytics for Marketing Professionals: Marketing Analytics in Theory
• Google 에서 Admob, Double Click 등 상품을 서비스하는 OPG 그룹의 임원이 강의함
• 개론부터 ZMOT 등 최신 트랜드까지 개념을 정의함

이론 스터디 방법

• 강의는 개인이 알아서 청강
• 집합 스터디에서는 박주형 이 내용을 짧게 요약해서 전달함.
• 전달한 내용은 Github에 공지함

기술 스터디

Rake And Shuttle 스터디

1. Sentinel 은 로그를 정의하고 관리하는 서비스 입니다.
   1. 사전에 MMI에서 필요한 로그를 정의하고 수집하고자 하는 타입/내용/태그 등을 정의합니다.
   2. Sentinel 서버 및 관련 처리 시스템은 SK플래닛에서 자체 개발한 것입니다.
2. Rake는 로그 수집 라이브러리 입니다.
   1. Sentinel 에서 정의된 로그에 따라서 앱내에서 수집된 로그를 저장 및 JSON 포멧으로 SK플래닛 DAS그룹의 RAKE 서버로 쏴줍니다. (이 과정에서 Shuttle 이라는 라이브러리가 사용되는듯)
3. SK플래닛의 경우 이렇게 이렇게 전달된 로그를 사내 솔루션인 Hive 등에서 사용하며 1000만 쿼리를 넘지 않는 선에서 샘플링한 데이터를 Measurement Protocol 로 GA로 쏴줍니다.
   (즉, RAKE를 적용한다고 제한이 풀리거나 그러지는 않습니다.;)
4. RAKE와 Shuttle 클라이언트는 오픈소스인 mixpanel 를 기반으로 만들었으며, mixpanel의 라이선스 장책(Apache V2)에 따라서.. 현재 깃허브에도 라이브러리, 도큐먼트, 샘플앱이 공개되어 있습니다.
   (https://github.com/lonslonz/rakedocument/wiki/Rake-manual)

Measurement Protocol 스터디

• 원래는 POS 등 인터넷에 연결된 Device에서 GA로 로그를 전달하기 위해서 만들어진 규격

• 현재는 Web-App 등을 하나의 Property / Session 에서 볼 수 있도록 하는 Universal Analytics의 기본 규격으로 활용됨

  • 예를 들어, T store 처럼 1) 웹에서 다운로드 클릭 2) App이 실행돼서 다운로드 / 설치 등 복잡한 Flow가 있는 경우, Measurement 프로토콜로 앱/웹을 연동하는 것이 중요

• 참고: UA 플랫폼 설명