狠狠撸

狠狠撸Share a Scribd company logo
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
技術選択と
アーキテクトの役割
(要約版)
C-7
デブサミアワード2015冬?あの人気セ
ッションの再演&アワード表彰式
July 29, 2015
Toru Yamaguchi
Senior Architect and Sub Business Unit Head
Open Platform Business Unit
DeNA Co., Ltd.
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
自己紹介
? 会社
? 株式会社ディー?エヌ?エー
? 組織
? オープンプラットフォーム事業本部
? 役職
? 副事業本部長 シニアアーキテクト
? 活動
? 前 Japan Perl Association 理事
? Perl Monger
? Identity Conference 設立メンバー
? OAuth 2.0, OpenID Connect
? インターネット上のアカウント
? @zigorou (Twitter)
? zigorou (Facebook)
2
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
Abstract – 今日の概要
? 枠の長さから要約版という事にしました
? 前回のスライドは http://www.slideshare.net/zigorou/ss-
44864139 から読む事が出来ます
? 自分で改めてスライドを読んでみて要約してみると、「アーキテクトの
役割」は過去?現在?未来に向き合う役割だと主張したかったように思
えました
? そうして向き合って得た知識や経験、志向などがその時々の「技術選択
」を確からしくしていくのだと思います
? こういった事の要約をお話したいと思います
3
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
Shortcut Service が生まれるまで
技術選択とアーキテクトの役割(要約版)
4
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
Shortcut Service とは
? Mobage の HTML5 ゲーム開発環境である JavaScript SDK の機能の一
つです
? スマートフォンブラウザではあまりなじみの無いホームスクリーンアイ
コンを作成する為のヘルパー機能 + αです
5
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
アーキテクトの役割 – 課題意識を常に持つ事
? 当時も現在もスマホブラウザでショートカットを作成する事は稀
? つまり、スマホブラウザはスマホアプリに比べてリテンションが低
くなる
? 蛇足ですが、ショートカット以外の要因も含めてまだまだネイティブアプリ
には及びません
? 何となくこれが勝手に常識になっていませんか?
? 課題意識は常日頃から考える癖をつけた方がいいです
? 何故稀になってしまっているのか
? 技術的制約?UX の悪さ?
6
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
UX の比較 – ネイティブアプリ
? ネイティブアプリはマーケットでアプリを見つけると、インストールと
同時にホームスクリーンアイコンが出来る
7
インストール探す 遊ぶ
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
UX の比較 – ブラウザアプリ
? ブラウザアプリの場合は探したらすぐ遊べる点が利点
? 但しこの為、どこかのタイミングでショートカットアイコンを作って貰う必要
がある
? どこかのタイミングって言うのはつまり、ユーザーが楽しいと思ったタイミン
グが自然な解釈ですよね?
? つまり人それぞれ異なるということ
8
探す 遊ぶ
ここで言うブラウザアプリとは、インス
トール型の物ではなく、ブラウザで動作
するアプリケーションの事です。
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
技術的制約
? iOS Safari も Android Chrome も現在閲覧している URL に対するショ
ートカットを作る為の機能は提供しています
? Configuring Web Applications
? Add to Homescreen
? そのため、良くあるウェブサイトではトップページでポップアップバナ
ーなどでショートカットアイコンの作成を促します
? 当然、ショートカットを押したらトップページに戻って来るから
? 得てしてユーザーが楽しいと感じるタイミングはトップページでは
ない
? またこのショートカット作成機能はそこまで簡単な操作ではないのも難
点です
9
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
突然のひらめき
? 同僚から上記のようなアプリの存在を教えられる
? ブラウザ立ち上がってるぞ???
? しかも作成時の url と起動時の url は同じはずなのに挙動が違う?
??
10
アイコン選択 ショートカット作成
ショートカットクリック
アプリ起動
とあるアイコン
着せ替えアプリ
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
多分こういう形で実現出来ます
? load イベント時の fragment の有無で挙動を変える
? ショートカット作成時は fragment を付けずにアクセス
? load イベントで fragment 付与をすると、ショートカット作成時の url には
fragment が付く
? fragment がついている場合はトップページなど意図した URI に飛ばす
11
アイコン選択 ショートカット作成
ショートカットクリック
アプリ起動
とあるアイコン
着せ替えアプリ
/path/to /path/to#fragment
/path/to#fragment
load イベント時に fragment の有無で
無ければ location.hash で付与
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
何が実現出来るようになったか
? 閲覧時の url ではなく、任意の url に対してホームスクリーンアイコン
付きのショートカットが作成出来るようになった
? 元の課題感の技術的制約はクリアした
? 但し UX その物は解決していない
? 任意の url に戻れるショートカットアイコンを作成する為の新しい
window を立ち上げる仕組みとして Shortcut Service という形にまと
めてローンチしました
? ショートカットアイコン作成支援機能
? JS SDK ホームスクリーンアイコン機能が生まれるまで -NBPF 構
想の小さなピース (今日の元ネタです)
? ここまでは普通に出てくる発想ですが実はショートカットアイコン作成
機能は他にも面白い機能があります
12
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
不慣れな体験を定着させる為に
? ここまで色々とやってきましたが Native App と比較し、やはり UX と
してユーザーに手頃とは言えない
? まずは使って貰う事が大事
? 使って貰ったらインセンティブが渡せるような枠組みを作った
? 具体的には?
? 実際には Platform のサーバーが仲介する仕組みなのでショートカ
ットから起動したかどうかは基本的には fragment の有無だけで判
定出来ます
? fragment ありでアクセスした場合は誰がアクセスしたのかを Application
Server に通知する仕組みがあります
? 通知が来たらアイテムプレゼント、、、みたいな使い方です
13
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
アーキテクトの役割 – システムをどう使って貰うか
? 常日頃から情報は仕入れましょう
? 人から聞いてひらめく事もあります
? 初めて見た仕組みがどう動いているか自分で実現出来ると確信出来る程
度に考えましょう
? 自分は動作確認のために簡単なコードを書きました
? 新しい概念を提供する場合はそれを使いやすくさせる仕組みを提供して
いきましょう
? 今回はインセンティブを付与しやすい仕組みを追加
? また他にも実は楽しく見せる為のネタを幾つか仕込んでいました
? どう使って貰うかを設定する事は KPI 指標としても使えます
? 要するにこう使って貰おうという意図が当たったのか外れたのか
14
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
アーキテクトの時間軸
? ちょっと変な絵ですが自分はこんなイメージを持っています
? 突然やって来た要件をその場限りで解決する繰り返しとは大きく異
なる頭の使い方をしないとアーキテクトにはなれないと思います
15
現在過去 未来
課題意識?
知識?経験
疑問
R&D
実現力
予測
ビジョン
Copyright (C) DeNA Co.,Ltd. All Rights Reserved.
Developers Summit 2015
時間?目線をずらす事が大事
? 前のページのように時間軸の視点をずらすのも重要です
? また当然システム全容に対してマクロ?ミクロに視点を移し替えてそれ
ぞれ良く理解し構想も出来るようにすべきです
? 常日頃からそういった疑問や課題を持ち、実際に試す事
? また試すだけでなく活かすような工夫をする
? こういった事がアーキテクトの役割であり、技術選択の基準だと思いま
す。より詳細には前回のスライドも読んでみて下さい。
? ご清聴ありがとうございました
16

More Related Content

技術選択とアーキテクトの役割 (要約版)

  • 1. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 技術選択と アーキテクトの役割 (要約版) C-7 デブサミアワード2015冬?あの人気セ ッションの再演&アワード表彰式 July 29, 2015 Toru Yamaguchi Senior Architect and Sub Business Unit Head Open Platform Business Unit DeNA Co., Ltd.
  • 2. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 自己紹介 ? 会社 ? 株式会社ディー?エヌ?エー ? 組織 ? オープンプラットフォーム事業本部 ? 役職 ? 副事業本部長 シニアアーキテクト ? 活動 ? 前 Japan Perl Association 理事 ? Perl Monger ? Identity Conference 設立メンバー ? OAuth 2.0, OpenID Connect ? インターネット上のアカウント ? @zigorou (Twitter) ? zigorou (Facebook) 2
  • 3. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 Abstract – 今日の概要 ? 枠の長さから要約版という事にしました ? 前回のスライドは http://www.slideshare.net/zigorou/ss- 44864139 から読む事が出来ます ? 自分で改めてスライドを読んでみて要約してみると、「アーキテクトの 役割」は過去?現在?未来に向き合う役割だと主張したかったように思 えました ? そうして向き合って得た知識や経験、志向などがその時々の「技術選択 」を確からしくしていくのだと思います ? こういった事の要約をお話したいと思います 3
  • 4. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 Shortcut Service が生まれるまで 技術選択とアーキテクトの役割(要約版) 4
  • 5. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 Shortcut Service とは ? Mobage の HTML5 ゲーム開発環境である JavaScript SDK の機能の一 つです ? スマートフォンブラウザではあまりなじみの無いホームスクリーンアイ コンを作成する為のヘルパー機能 + αです 5
  • 6. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 アーキテクトの役割 – 課題意識を常に持つ事 ? 当時も現在もスマホブラウザでショートカットを作成する事は稀 ? つまり、スマホブラウザはスマホアプリに比べてリテンションが低 くなる ? 蛇足ですが、ショートカット以外の要因も含めてまだまだネイティブアプリ には及びません ? 何となくこれが勝手に常識になっていませんか? ? 課題意識は常日頃から考える癖をつけた方がいいです ? 何故稀になってしまっているのか ? 技術的制約?UX の悪さ? 6
  • 7. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 UX の比較 – ネイティブアプリ ? ネイティブアプリはマーケットでアプリを見つけると、インストールと 同時にホームスクリーンアイコンが出来る 7 インストール探す 遊ぶ
  • 8. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 UX の比較 – ブラウザアプリ ? ブラウザアプリの場合は探したらすぐ遊べる点が利点 ? 但しこの為、どこかのタイミングでショートカットアイコンを作って貰う必要 がある ? どこかのタイミングって言うのはつまり、ユーザーが楽しいと思ったタイミン グが自然な解釈ですよね? ? つまり人それぞれ異なるということ 8 探す 遊ぶ ここで言うブラウザアプリとは、インス トール型の物ではなく、ブラウザで動作 するアプリケーションの事です。
  • 9. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 技術的制約 ? iOS Safari も Android Chrome も現在閲覧している URL に対するショ ートカットを作る為の機能は提供しています ? Configuring Web Applications ? Add to Homescreen ? そのため、良くあるウェブサイトではトップページでポップアップバナ ーなどでショートカットアイコンの作成を促します ? 当然、ショートカットを押したらトップページに戻って来るから ? 得てしてユーザーが楽しいと感じるタイミングはトップページでは ない ? またこのショートカット作成機能はそこまで簡単な操作ではないのも難 点です 9
  • 10. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 突然のひらめき ? 同僚から上記のようなアプリの存在を教えられる ? ブラウザ立ち上がってるぞ??? ? しかも作成時の url と起動時の url は同じはずなのに挙動が違う? ?? 10 アイコン選択 ショートカット作成 ショートカットクリック アプリ起動 とあるアイコン 着せ替えアプリ
  • 11. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 多分こういう形で実現出来ます ? load イベント時の fragment の有無で挙動を変える ? ショートカット作成時は fragment を付けずにアクセス ? load イベントで fragment 付与をすると、ショートカット作成時の url には fragment が付く ? fragment がついている場合はトップページなど意図した URI に飛ばす 11 アイコン選択 ショートカット作成 ショートカットクリック アプリ起動 とあるアイコン 着せ替えアプリ /path/to /path/to#fragment /path/to#fragment load イベント時に fragment の有無で 無ければ location.hash で付与
  • 12. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 何が実現出来るようになったか ? 閲覧時の url ではなく、任意の url に対してホームスクリーンアイコン 付きのショートカットが作成出来るようになった ? 元の課題感の技術的制約はクリアした ? 但し UX その物は解決していない ? 任意の url に戻れるショートカットアイコンを作成する為の新しい window を立ち上げる仕組みとして Shortcut Service という形にまと めてローンチしました ? ショートカットアイコン作成支援機能 ? JS SDK ホームスクリーンアイコン機能が生まれるまで -NBPF 構 想の小さなピース (今日の元ネタです) ? ここまでは普通に出てくる発想ですが実はショートカットアイコン作成 機能は他にも面白い機能があります 12
  • 13. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 不慣れな体験を定着させる為に ? ここまで色々とやってきましたが Native App と比較し、やはり UX と してユーザーに手頃とは言えない ? まずは使って貰う事が大事 ? 使って貰ったらインセンティブが渡せるような枠組みを作った ? 具体的には? ? 実際には Platform のサーバーが仲介する仕組みなのでショートカ ットから起動したかどうかは基本的には fragment の有無だけで判 定出来ます ? fragment ありでアクセスした場合は誰がアクセスしたのかを Application Server に通知する仕組みがあります ? 通知が来たらアイテムプレゼント、、、みたいな使い方です 13
  • 14. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 アーキテクトの役割 – システムをどう使って貰うか ? 常日頃から情報は仕入れましょう ? 人から聞いてひらめく事もあります ? 初めて見た仕組みがどう動いているか自分で実現出来ると確信出来る程 度に考えましょう ? 自分は動作確認のために簡単なコードを書きました ? 新しい概念を提供する場合はそれを使いやすくさせる仕組みを提供して いきましょう ? 今回はインセンティブを付与しやすい仕組みを追加 ? また他にも実は楽しく見せる為のネタを幾つか仕込んでいました ? どう使って貰うかを設定する事は KPI 指標としても使えます ? 要するにこう使って貰おうという意図が当たったのか外れたのか 14
  • 15. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 アーキテクトの時間軸 ? ちょっと変な絵ですが自分はこんなイメージを持っています ? 突然やって来た要件をその場限りで解決する繰り返しとは大きく異 なる頭の使い方をしないとアーキテクトにはなれないと思います 15 現在過去 未来 課題意識? 知識?経験 疑問 R&D 実現力 予測 ビジョン
  • 16. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. Developers Summit 2015 時間?目線をずらす事が大事 ? 前のページのように時間軸の視点をずらすのも重要です ? また当然システム全容に対してマクロ?ミクロに視点を移し替えてそれ ぞれ良く理解し構想も出来るようにすべきです ? 常日頃からそういった疑問や課題を持ち、実際に試す事 ? また試すだけでなく活かすような工夫をする ? こういった事がアーキテクトの役割であり、技術選択の基準だと思いま す。より詳細には前回のスライドも読んでみて下さい。 ? ご清聴ありがとうございました 16