매주 ab180 디자인팀에서 Ad Tech/UX/GUI/BX 관련 크고 작은 이슈, 포스팅, 컬럼 등을 모아 디자인 트렌드 리포트를 발행합니다.


Ad Tech

크롬, 새로운 광고 필터링 기능으로 퍼블리셔와 애드테크 업체들 긴장

크롬 내 노출되는 광고의 질적 향상을 위해 정보 탐색을 저해하는 광고 포맷(팝업, 화면 전체를 가리는 형태 등)을 노출하지 않는 필터 기능을 넣을 예정. 구글의 온라인 광고 생태계 독과점으로 단행할 수 있는 이번 기능으로 소규모 광고 퍼블리셔들이 타격을 입을 것이라 예상. 이를 타개하기 위해 개인화된 광고가 점차 중요해지고 있는데, 실제 데이터를 분석하여 사용자의 사용 컨택스트 내에서 유용하고 건설적인 메시징을 창조적으로 전달해야할 것
By Garett Sloan @adage.com
관련 기사 2 by Justin Peyton @mumbrella.asia

구글/애플, 자동 재생 동영상 광고 차단 예정

사운드 부터 순차적으로 차단할 예정. 이러한 아웃스트림 광고는 단가가 높아 퍼블리셔들이 선호하나 사용자들은 자신의 사용 맥락을 방해한다고 생각하여 선호도가 낮음. 정말 좋은 광고는 사용자들이 ‘보고자하는’ 광고
by Mike Shields @businessinsider.com

스냅챗, 광고플랫폼 출시

젊은층의 사용자가 두터움에도 제대로 수익화를 못하고 있다는 지적을 받은 스냅챗이 광고플랫폼을 새롭게 출시하며 페이스북과 구글에 도전. 광고주가 직접 광고를 올리고 관리할 수 있는 ‘애드매니저’, 모바일 동영상 광고 제작 툴 ‘스냅 퍼블리셔’ 출시. 광고주는 ‘애드 매니저’의 대시보드는 모바일에서도 캠페인 효과를 추적할 수 있으며 광고비용 설정 및 관리 계정 추가 가능
by 손경호 기자 @zdnet.co.kr

Comcast, 블록체인 기반 TV광고 플랫폼 발표

이번 칸 광고제에서 TV광고 구매를 위한 블록체인 기반 플랫폼 발표. 이는 전통적인 TV광고 시장에서 데이터 기반 마케팅을 도입한 새로운 시도로 보안을 보장하면서 광고 구매, 잠재고객 타게팅 및 기여도 측정을 용이하게 할 것이라 기대
by David Kirkpatrick @marketingdive.com

앱넥스트, 인도 사업 확장 위해 현지 전문가 고용

인도의 관련 스타트업 CEO 및 멘토 역할을 역임한 Manish Singh Rajawat를 영입하여 인도 내 퍼블리셔 및 광고주와의 네트워킹에 힘쓸 얘정이라고. 참고로 인도에서 모바일 광고 기술 산업은 작년 대비 3억 5천만 달러 증가했으며, 2019년 까지 13억 달러를 돌파할 것으로 예상
by Appnext @prnewswire.co.uk

MediaMath, 175백만 달러 융자 확보

이번 융자금 확보로 기존 부채를 상환하고 사업 기반을 다시금 정비할 수 있을 것이라 기대
by Anthony Ha @techcrunch.com

온누리 DMC, 비보상형 광고 플랫폼 에이폴리오

지난 4월 출시한 비보상형(NCPI, Non-incentive CPI) 광고플랫폼 에이폴리오, 어뷰징을 방지할 수 있도록 설계되었으며 탭티카, 모비스타, 클릭키 등 글로벌 상위 매체 70여 곳과 연동 중. 게임, 유틸리티, 커머스 등에 강점이 있는 이 매체들과의 연동을 통해 국내 뿐만 아니라 미국, 동남아, 일본 등 200여개 국에서 트래픽을 확보 중이라고 밝힘
@biz.chosun.com

나스미디어, 페이스북 애드테크 부문 마케팅 파트너 선정

애드테크 부문 마케팅 파트너는 나스미디어 포함 국내 7개 사, 전 세계 91개 업체가 선정 됨. 공식 선정시 페이스북의 다양한 지원 프로그램의 참가 자격이 있으며 페이스북의 신규 기능을 우선적으로 접할 수 있음. 나스미디어의 페이스북 광고플랫폼 ‘애드포크’에서는 그간 자사에서 축적해온 방대한 데이터를 통해 타겟 오디언스 데이터를 추출하고 업종 및 제품별로 제공
by 고수정 기자 @dailian.co.kr

핀터레스트, 성과측정 솔루션 파트너로 Neustar 선정

Neustar는 광고 통합 측정 및 분석 솔루션 ‘MarketShare’ 서비스를 제공하는 회사로 핀터레스트의 온라인 구매 전환 및 모바일 앱 설치 데이터를 살펴볼 수 있음. 번외로 Neustar 리서치 결과에 따르면 핀터레스트 사용자는 구매를 위해 다른 플랫폼보다 핀터레스트를 먼저 탐색하는 비율이 높은 것으로 나타남

@destinationcrm.com

인도 블록체인 스타트업 Audience Farm, 애드테크 사업 시작

인도에서 블록체인은 핀테크를 넘어 운송, 물류, 애드테크로 확장 중. 최근 오디언스팜은 블록체인 솔루션 기반으로 애드테크 사업 영역 확장을 발표했는데, 이로 인해 광고주 등이 구입한 사용자 데이터의 보안과 안정성을 보장하여 많은 자원을 절약할 수 있을 것이라 예상. 수집된 사용자 데이터를 통해 행동과 관심사를 예측하는 것은 광고업계에서 특히 중요한 사실인데 오디언스팜의 블록체인 상품은 광고주가 동일한 사용자 데이터에 중복 지출을 방지할 수 있도록 도울 것
by Gautham @newsbtc.com

크리테오, 온라인 광고 입찰 플랫폼 ‘Criteo Direct Bidder, CDB’ 릴리즈

CDB는 헤더 비딩 방식으로 광고주와 매체사 사이에서 입찰을 중개하는 애드익스체인지(ADX)의 독과점을 완화시킬 수 있음. 현재 많음 매체사들이 ADX에 인벤토리 판매 후 추가 수익을 기대하기 어렵다고 함. 크리테오가 이번에 발표하는 다이렉트 비딩 방식은 프리미엄 인벤토리까지 ADX의 개입 없이 이용할 수 있으며, 크리테오 내 조사 결과에 따르면 기존 ADX 활용 방식 대비 매체 수익이 20% 증가했다고 밝힘

by 손경호 기자 @zdnet.co.kr

애드테크 회사가 데이터 기반 프로덕트 전략이 필요한 이유

데이터 기반의 제품 개발 프로세스는 팀 모두가 공통의 비전에 참여할 수 있어 그 자체가 동기부여에 도움이 될 것. 먼저 각 부서 그룹의 리더들이 제품 전략팀을 구성하여 우선순위 프로세스에 참여해야 함. 이후 각자 그룹 내에서 아이디어를 적극적으로 구하고 조직의 요구에 맞는 우선순위 점수를 산정 함. 그 기준은 이번 분기 리소스 할당의 주안점, 시간 절약 및 효율성, 신규 및 기존 고객의 수익, 경쟁사 등의 항목이 있을 수 있으며(자세한 항목은 기사 참조) 5점 척도로 매겨 우선순위 산정을 위한 프레임워크를 만들어야 함. 새로운 로드맵도 동일한 방식으로 우선순위를 산정하여 제품 개발 프로세스에 포함시켜야 함
By Roy Firestone @adweek.com

메조미디어, 2017 상반기 미디어 트렌드 리포트: 빅데이터, 인공지능이 주도할 것

메조미디어가 미디어, 콘텐츠, 기술, 서비스 및 제품의 4가지 분야별 상반기 동향 및 하반기 전망을 발표함. 상반기에는 특히 애드테크 시장에 빅데이터와 인공지능이 화두였으며, 관련하여 카카오는 ‘캐시프렌즈’ 및 ‘카카오모먼트’의 생활 플랫폼과 접목한 광고에 빅데이터를 활용할 것이라 밝혔으며 구글은 인공지능을 사용해 불건전하고 무분별한 광고를 제한하고 차단하는 등 광고 환경을 개선하려 노력 중이라 밝힘
by 이경은 기자 @bloter.net


UX

SEO와 사용자 경험이 어떻게 비즈니스를 용이하게 할까

사이트 유입량 증가와 전환율 상승을 위해 온라인에 의존하는데, 이는 웹사이트 최적화와 더불어 SEO도 최적화해야 한다는 것을 의미. 사용자들은 본인의 문제나 니즈를 해결하기 위해 답을 찾기 위해 검색엔진을 이용하는데 그들의 니즈와 부합하는 웹사이트를 발견하면 굉장한 경험을 기대함. UX + SEO가 곧 돈이라는 포인트가 여기에 있는데, 검색엔진 알고리즘은 사용자 경험에 근거해 발전해왔으며 SEO팀은 유엑스팀이 사용자 경험 개인화를 위해 필요한 정보를 갖고 있고, UX팀은 웹사이트 프레임워크와 콘텐츠 최적화 인사이트를 갖고 있으므로 사용자를 이해하기 위해 서로 협업하여 메타 데이터와 웹사이트 데이터를 리뷰해가며 SEO와 사용성 개선 전략에 활용해야 함. 예로 어떤 키워드로 유입되었는지 안다면 사이트 내에서 그 정보의 발견을 용이하게 해야하며, 컨버전을 높게 할 수 있는 페이지(사용자 검색 트렌드)를 결정하는데 활용할 수도 있을 것
by Chris Giarratana @searchenginejournal.com

사용성을 향상시키는 보이지 않는 UI

최근 디자인 트렌드인 인비져블 UI, 그 경험이 너무나 직관적이어서 눈에 보이는 UI가 필요하지 않은 것을 뜻함. e.g. 어도비 제품군의 스마트 가이드는 레이어 이동 시 자동 표시됨. e.g.2. 구글의 보이지 않는 보안문자: 입력할 필요 없이 robot이 아니라는 버튼만 누르면 됨. e.g.3. 스케치, Adobe XD의 컨택스트 인터페이스: 선택한 객체나 시점에 이용할 수 있는 기능만 노출. e.g.4. 개인화: 수집된 사용자 정보를 바탕으로 핀터레스트 등 서비스에서 관련 콘텐츠 노출
By Daniel Schwarz @sitepoint.com

퍼널 전환을 위한 사용자 심리 프레임워크

저자의 인사이트를 요약하자면 “페이지의 모든 요소들이 사용자의 감정적 에너지를 더하거나 제하며, 요소와의 마찰만큼 어떤 요소에서 ‘감동’하는 것도 중요” 글에서 소개하는 사용자 심리 프레임워크는 Tickle, Bebo, Dropbox와 같은 회사에 쓰였던 방법. 사용자의 심리 에너지(이하 Psych로 표기)는 각기 다름(여기에서는 0~100의 점수로 구분) 여기서 꼭 어떤 과업을 달성해야하는 혹은 검색을 통해 방문한 Psych가 100인 사용자는 어떤 경험에든 충실할것이고, 실수로 광고배너 등을 선택하여 사이트에 유입된 Psych가 0인 사용자는 거의 바로 이탈할 것. 이 기본 Psych 점수가 전환으로 이어지려면 이후 User Journey가 Psych+할 수 있도록 설계되어야 함. 보통 글을 왼쪽에서 오른쪽으로 읽으므로 많은 사용자들의 정보 스캔 패턴인 F자 패턴에 따라 페이지 왼쪽 상단에서 오른쪽 하단까지 User Journey가 자연스럽게 이어질 수 있도록 해야하며 각 Journey에 위치한 UI들의 Psych 점수를 계산하여 CTA에 도달했을 때 +수치가 되어야 함. Psych+ 요소는 명확한 광고 유도 문안 등. Psych- 요소는 긴 서명 양식, 명확하지 않은 UX, 너무 많은 텍스트 등, 결제는 보통 Psych- 요소인데 보안이나 환불 보장 안내가 강조되면 되려 서비스에 대한 신뢰를 더할 수 있음
by Darius Contractor @darius.com

사용성 개선과 전환율 상승을 위한 Visual Hierarchy 개선 방법 소개

페이지 내 콘텐츠의 순서와 중요도를 시각적(크기, 색상, 대비, 모양, 위치, 정렬 등)으로 전달할 수 있어야 함. 텍스트가 많은 페이지나 상품 목록과 같이 카드형 콘텐츠 페이지의 경우 F자 스캔 패턴을 따라 정보를 배치하며, 광고와 같이 보다 비주얼적 요소가 중요한 페이지는 Z자 스캔 패턴을 따라 정보를 배치. 인간의 뇌는 두 가지 추론 시스템을 가짐 (직관에 의해 영향 받는 충동적인 사고 과정, 느리고 분석적인 사고 과정) 구매로의 전환을 위해 ‘느리고 분석적인 사고 과정’이 필요한데, 페이지 내 정보들을 여백으로 구분하여 이러한 사고 과정의 환기를 이끌 수 있음. 시각적 정보 패턴에서의 반복은 상대적인 중요 정보를 나타낼 수 있는 좋은 방법. 이러한 반복을 중단하면 주의력이 높아지는데 이때 CTA를 배치하면 전환율이 보다 상승될 수 있음
by Rohan Ayyar @business2coimmunity.com

좀비 스크롤러 사용성 개선

사용자가 페이지 내 모든 단어를 주의깊게 읽지 않는 것을 ‘좀비 스크롤러’라고 하는데 페이지 스크롤이 길어질 수록 피로도가 높아져 이 현상이 잦아짐. 집중할 수 있는 지점(포커스 포인트)에 따라 스크롤 길이를 조정해야 함. 텍스트 정보가 거의 없는 경우(최소 정보만 표시할 경우) 피로도가 상대적으로 낮아져 스크롤 거리를 늘려도 됨. 콘텐츠 유형에 따라 목록 레이아웃을 달리 하는 것도 피로도 경감의 한 방법. 선형 목록: 구글이나 이베이 검색 결과가 같이 클래식한 패턴에 적합하며 모든 항목을 나란히 비교할 수 있으나 미적으로 아름답지 않고 시각적으로 지루할 수 있음. 클래식 그리드: 콘텐츠에 그래픽적 요소가 많은 경우 유용한 방법이지만 그만큼 시각적 피로도가 높아질 수 있어 콘텐츠 청크를 건너뛸(좀비 스크롤링을 할) 확률이 높음. 벽돌 그리드: 핀터레스트와 같은 방식으로 순서가 없고 명확한 그리드 패턴이 없어 혼란스러울 수 있음. ‘새로고침’이라는 액션이 포커스 포인트를 다시 환기할 수 있는 방법. 콘텐츠 성격도 이 새로고침에 유효할 수 있음(Food, Sex & Danger 성격의 콘텐츠를 배치), 보상 트리거와 예상치 못한 시각적 변화(밝은 색상, 열의 수 변화 등), 로딩 버튼 등도 효과적일 수 있음
by Petras Baukys @sitepoint.com

인터콤은 제품 디자인을 어떻게 설계하는가

많은 디자이너들이 바로 인터페이스 디자인을 시작하는데, 이는 방 크기를 모르는 상태에서 가구를 고르는 것과 같으며 ‘시스템적 사고’를 제품 디자인 설계에 적용해야 함. 먼저 인터페이스의 핵심 요소, 연결되는 기능, 목적에 대해 분명히 정의하고 인터페이스를 디자인해야 함. (참고서적: Thinking in Systems) 이와 같은 프로세스로 기존의 자산의 활용 가능성을 타진해보는 등 제품 개선 프로세스에도 적용할 수 있음
by Sherman Tang @blog.intercom.com

Inside Atlasssian’s Design Teams

아틀라시안 디자인 팀 멤버들이 이야기하는 자사 디자인 팀 프로세스와 성장 요인. 이 팀은 ‘고객 접점’의 디자인을 위해 개발, QA, 프로덕트 매니징 등 유관 부서와 밀접히 일함. 특히 사용자 리서치를 중요하게 생각하며 매주 월요일마다 VOC 리포트로 이슈 상황을 도출하고, 사용자 리서치를 진행하여 문제가 무엇인지 명확하게 알아내려 함. Contextual Inquiry, Interview 등 문제 상황이 발생하는 컨택스트를 파악하고 솔루션을 도출하는데, 이 솔루션에 대해 팀 내외로 사용성과 개발 가능성에 대해 Rapid Prototyping을 반복하며 피드백을 주고받음. 그 외 사내 해커톤을 통해 개인이 프로덕트의 개선 방향을 발의하는 문화가 있음. 끊임없이 질문하며 겸손한 자세를 갖고, 모르는 것을 자신있게 말할 수 있는 팀 분위기를 조성해야 개인이 아니라 ‘팀’ 단위로 움직일 수 있으며 이렇게 회사와 프로덕트를 도울 수 있는 매커니즘을 끊임없이 셋업하는 것이 아틀라시안 디자인 팀의 핵심 가치라 평가한다고 함
@truenorthpodcast.com

그로스해킹을 돕는 8가지 도구 소개

그로스해커스닷컴: 그로스해킹 프로세스 관리 도구 (커뮤니티에서 사례와 의견들도 공유 가능) / 랜담그로스: 그로스해킹 아이디어를 하루에 하나씩 얻을수 있는 서비스 / 페이위드트윗: 트위터를 활용한 보상형 바이럴 홍보도구 / 헬로우바: 웹사이트 상단에 메시지를 넣어 고객의 행동 유도를 돕는 도구 / 수모: 이메일 수집, A/B테스팅, 앱 연동 등 고객확보와 트래픽 성장을 자동화 할 수 있는 도구 / 파이프파이: 마케팅 가설 검증 도구 / 얀덱스 매트릭스: 세션 리플레이, 히트맵 기능을 지원하는 웹트래킹 도구 / 브랜치: 딥링크 생성, 모바일웹-앱 연결, 트래킹 링크를 통한 설치 분석 툴
by 박용훈 @bloter.net

인공지능이 사용성 향상에 도움이 될 것, 하지만 여전히 브랜딩은 난제

고객 경험이 경쟁력의 기본이 되면서 많은 브랜드들이 브랜드 일관성과 개인화된 경험에 집중하고 있음(소비자 응답자의 58%가 상품 추천 등 자신들의 니즈에 부합하도록 서비스를 개선하는 데에 자신들의 데이터를 제공할 용의가 있다고 밝힘) 그러나 CRM 툴 세일즈포스의 연간 보고서에 따르면 채널이 범람하면서 브랜드 메시지 전달 자체와 일관성 유지에 어려움을 겪고 있음
By Lisa Lacy @thedrum.com


GUI

인포그라픽도 움짤로

최근 구글 뉴스랩이 ‘Data GIF Maker’ 툴을 발표하는 등 인포그라픽 콘텐츠 생산 미디어들이 GIF 형식을 활용하는 중. 이는 사용자의 탐색이나 인풋 없이 10초 내외로 핵심만 직관적으로 간단하게 자동으로 보여줄 수 있고 어디서나 첨부 가능한 포맷으로 배포에 용이하기 때문
by 임송이 @brunch.co.kr

앱 릴리즈 노트 작성법 소개

간단한 포맷을 적용하여 앱 릴리즈 노트의 가독성과 사용성을 향상시킬 수 있음. 요약을 먼저, 설명은 나중에 할 것. 핵심 항목을 먼저 표기할 것. 사용자가 개발자에게 피드백을 보낼 수 있는 방법을 안내하며 글을 마무리할 것. 불릿, 제목, 섹션, 여백 등을 이용하여 가독성을 개선할 것. 버그 수정을 당당히 표기할 것. 다음 업데이트를 예고할 것
by 이끼마우스 @brunch.co.kr

그라디언트 컬러가 사랑받는 이유

조너선 아이브가 iOS7에서 플랫, 그라디언트 디자인을 소개하면서 스큐어모피즘에 익숙해있던 디자이너들에게서 조롱(?)을 받았지만, 이제는 트렌드로 자리를 잡았으며, 그 원인은 생동감, 구조적이고 단순한 UI 접근성과 서비스 적용에의 용이함 그리고 감정적 호소력을 그 원인으로 평가함 (덧)감정적 호소력은 스큐어모피즘이 더 강력했지 않았나 싶습니다만..
by sangster @brunch.co.kr/@sangster

디자인에 Git을 도입한지 3주가 지났다

필자는 한 동안 디자인을 혼자 담당하다가, 업무량이 많아지며 파일들이 점점 분산되게 됨. 여기에 추가 디자인 인력이 합류하며 디자인 업무 프로세스 적응이 어려워짐. 파일과 버전 관리의 필요성을 느껴왔던 와중 스케치에서 Git을 통해 버전 관리를 시작하게 됨. 버전을 분산하여 작업하고 관리하며, 롤백함으로써 작업이 보다 용이해짐
by 문정현 @brunch.co.kr/@moonshot91


BX

2017 런던 디자인위크 선정작 발표

지난 6월 23일 런던타워에서 열린 디자인위크 어워드 선정작 발표. 아래 부문 별 선정작은 기사 링크 참조

Communication - Brand campaigns, Editorial design, Identity design, Packaging, Poster design, Print communications, Self-promotional projects, Writing for design

Space - Exhibition design, Retail interiors, Wayfinding and environmental graphics, Hospitality and Workplace

Digital - App design, AR and VR, Digital installations, Website design

Products and Furniture - Product design – consumer, Product design – industrial, Furniture design

Landmarks Awards - Social design, Rising Star

@www.designweek.co.uk

티몬 브랜드북 제작기

자사 직원들이 브랜드 아이덴티티를 이해하고 이를 일관되게 유지할 수 있도록 티몬의 브랜드 비전과 전략, 핵심 사업과 서비스를 소개하고 로고, 심볼, 전용 폰트, 컬러, 브랜드 슬로건, 캐릭터, 그래픽 모티브 등 가이드를 담음
by 티몬 크리에이티브 센터 @brunch.co.kr

스카이프, 마이크로소프트 브랜딩에 맞춰 새로운 로고 공개

기존 거품모양의 로고 타입에서 보다 심플한 심볼과 워트마크로 리뉴얼 됨. 이에 따라 웹사이트 앱도 재설계 되었으며, 기능적으로는 StubHub, BigOven, Expedia가 앱에 통합 되어 레시피, 항공, 호텔 등을 검색하여 메시지를 보낼 수 있게 됨
by Sarah Dawood @designweek.co.uk