スマデバリッチ広告をプロトタイプで作り上げる #yxdena
DESCRIPTION
7/16の勉強会にて発表された資料です。 Yahoo! JAPAN DeNA「iOSエンジニア・UI/UXデザイナー勉強会」 http://dena.com/campaign/2014/yahoo_dena/TRANSCRIPT
スマデバリッチ広告を プロトタイプで作り上げる
小林 大介
@bonegollira
自己紹介
小林 大介
Yahoo! JAPAN
エンジニア
アルティメットフリスビー
こんな話します
こんな広告をやりました
こんな広告をこうやって作ってます
こんな広告をやりました
スマデバリッチ広告って?
インラインバナー
AD
フローティングバナー
AD AD
スクロールしても画面下部へついてくる
タップしてエキスパンド
AD
AD
広告をタップすると画面全体へ広がる
リッチ広告って?
こんな広告のことです
こんな広告を こうやって作ってます
こんな広告を こうやって作ってます
!アイデア
リッチ広告って どんなUI/UXがいいのか
見ていて面白い ユーザの行動を邪魔しない
広告主の商品を存分にアピール
見ていて面白い
タップ、スワイプ、ジャイロと連動
視差
色んな表現を広告に応用
ユーザの行動を邪魔しない
コンテンツの閲覧を妨げない
ユーザの意図しない挙動
UXを下げない
広告主を存分にアピール
スマートデバイスでは画面が小さい
広告の領域はさらに小さい
チャンスは一瞬
こんな広告を こうやって作ってます
!取り組み
まず自分の中のアイデアの プロトタイプを作る
プロトタイプを見て チームでアイデアを膨らます
この2つの繰り返し
!
!
もっと面白くするには? マッチするクライアントは? もっとUXを良くするには? もっと良いUIはないのか?
!
アイデアを思いつく アイデアをプロトタイプ化
個人
みんなで
通常のプロトタイプ
デザイナーやエンジニアで認識を合わせたい
手戻りを少なくしたい
ユーザからの評価を得たい
広告のプロトタイプ
動くものを見ないと良さがわからない
とりあえずアイデアの数だけ作る
無駄が多く手戻りだらけ!
でもプロトタイプから作る 何故か?
広告を実現するまでの ステップ
広告開発者 広告企画 アプリ
営業 代理店 レップ 広告主
広告は関係者が多い
広告開発者 広告企画 アプリ
営業 代理店 レップ 広告主
5ステップ
どこかで 「これ面白いの?」
っていう疑問が生まれる
企画書では ファーストインプレッション
が弱い
プロトタイプでは伝わる
アイデアの時点から 面白さがわかるプロトタイプを
持って話す
アイデアプロトタイプ
まとめ
プロトタイプから作って アイデアを膨らます
「!」な広告
ご清聴ありがとうございました