Your SlideShare is downloading. ×
今さら聞けないfacebook
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

今さら聞けないfacebook

10,363
views

Published on

2011-12-21 …

2011-12-21
gumi×マイネット勉強会
@gumi株式会社

Published in: Technology

0 Comments
15 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
10,363
On Slideshare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
37
Comments
0
Likes
15
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. 今さら聞けない facebook 2011-12-21株式会社マイネット・ジャパン 伊藤 祐策
  • 2. 今日のテーマ
  • 3. facebookthe Social Networking Service
  • 4. 今回は アプリ開発編 使い方編 の2本でお送りいたします
  • 5. <アプリ開発編>
  • 6. このセクションではfacebookの実装の世界 についてご紹介します
  • 7. facebookアプリ開発といえば
  • 8. facebookGraph API
  • 9. まずはGraph APIを使うための 基礎 についてご紹介
  • 10. 題して
  • 11. ここが凄いよ facebook
  • 12. 何が凄いのか?
  • 13. facebook実装のここが凄い1.データ構造がシンプル2.URL構造がシンプル3.APIがシンプル
  • 14. simple is best!
  • 15. 1.データ構造がシンプ ル
  • 16. facebookの中では全てが「オブジェク ト」
  • 17. これらが全部「オブジェクト」• ユーザー• Facebookページ – 場所(例:「東京都」) – 趣味(例:「野球」) – 言語設定の言語(例:「日本語」)• ウォールへの投稿• 共有した写真• etc
  • 18. オブジェクトは共通してid と type という属性を持 つ
  • 19. 基本オブジェクトObject id type
  • 20. しかもidは全て同じID空間で管理されている
  • 21. Object statusUser link Photo Page
  • 22. 例for example
  • 23. 私のObjectIDは11億6310万2843 です
  • 24. FacebookユーザーオブジェクトUser < Object id:1163102843 type:user name:伊藤 祐策 username:ito.yusaku
  • 25. こんな感じで、 IDさえわかればあらゆるオブジェクトを 特定することができる 仕組みになっている
  • 26. ちなみに
  • 27. facebookアプリ開発者が絶対に使いこなしておくべきたった一つのfacebookア プリ
  • 28. facebook公式アプリGraph API Explorer
  • 29. これさえあればfacebookの内部データ構造がまるわか り!
  • 30. オブジェクトの話に戻って
  • 31. facebookアプリ開発者が覚えておく べき基本的な8種類のオブジェクトタ イプ
  • 32. 1.FacebookユーザーUser < Object type:user facebookを利用しているユー ザー
  • 33. 2.FacebookページPage < Object type:page 会社、学校、言語、宗教、場 所、音楽、映画等、世の中に 存在するあらゆる存在。
  • 34. 3.ユーザーによる投稿Status < Object type:status ユーザーによって投稿された文 字だけの近況
  • 35. 4.リンクのシェアLink < Object type:link ユーザーによって投稿されたURL ※URLを含んだ近況を投稿すると linkになる
  • 36. 5.写真Photo < Object type:photo ユーザーによって投稿された画 像 ※facebookアプリからもよく自 動生成される
  • 37. 6.アルバムAlbum < Object type:album ユーザーによって作成された写 真アルバム ※facebookアプリからもよく自 動生成される
  • 38. 7.イベント(行事予定)Event < Object type:event ユーザーによって企画された行 事予定。
  • 39. 8.友達リストFriendList < Object type:friendlist ユーザーが任意に作成した友達 のリスト。または所属先によっ て自動的に生成された友達リス ト。 ※後述
  • 40. 以上8種類これだけ覚えておけば多分大丈夫
  • 41. 2.URL構造がシンプル
  • 42. 例for example
  • 43. http://www.facebook.com/ito.yusaku
  • 44. 名前空間のトップレベルからユーザーにあげちゃうなんて 超太っ腹!
  • 45. もうひとつ 例for example
  • 46. ユーザーの友達リストのURL
  • 47. http://www.facebook.com/ito.yusaku/friends
  • 48. 超シンプル!わかりやすい!
  • 49. 実はGraph APIでもほとんどURL構造が同 じ
  • 50. https://graph.facebook.com/ito.yusaku/friends
  • 51. このURLでユーザーの友達情報をjsonで取得でき る!
  • 52. あれ、もしかして
  • 53. Graph API Explorerでhttps://graph.facebook.com/1163102843って打ったら自分のユーザー情報引っ張れたよ ね?
  • 54. じゃあさ、
  • 55. http://www.facebook.com/1163102843 って打ったらどうなるのっ と・・・
  • 56. 表示された! (リダイレクトされます)
  • 57. 誰が得するのか分からないけど なんか凄い!
  • 58. 3.APIがシンプル
  • 59. 例for example
  • 60. status(近況投稿)の GETで取得できる データ構造
  • 61. { "id": "1163102843_2861493774125", "from": { "name": "伊藤 祐策", "id": "1163102843" }, "message": "ぽっぽっぽ~♪ぬるぽっぽ~♪データが欲しいかもうないぞ~♪", "actions": [ { "name": "Comment", "link": "http://www.facebook.com/1163102843/posts/2861493774125" }, { "name": "Like", "link": "http://www.facebook.com/1163102843/posts/2861493774125" } ], "privacy": { "description": "Only Me", "value": "SELF" }, "type": "status", "created_time": "2011-12-19T09:49:16+0000", "updated_time": "2011-12-19T09:49:16+0000",
  • 62. じゃあ近況をGraph APIから 投稿したいときはどんなデータ構造にすればいい の?
  • 63. { "id": "1163102843_2861493774125", "from": { "name": "伊藤 祐策", "id": "1163102843" }, "message": "ぽっぽっぽ~♪ぬるぽっぽ~♪データが欲しいかもうないぞ~♪", "actions": [ { "name": "Comment", "link": "http://www.facebook.com/1163102843/posts/2861493774125" }, { "name": "Like", "link": "http://www.facebook.com/1163102843/posts/2861493774125" } ], "privacy": { "description": "Only Me", "value": "SELF" }, "type": "status", "created_time": "2011-12-19T09:49:16+0000", "updated_time": "2011-12-19T09:49:16+0000",
  • 64. { "message": "ぽっぽっぽ~♪ぬるぽっぽ~♪データが欲しいかもうないぞ~♪", "privacy": { "value": "SELF" },}, 投稿に必要そうな属性だけ抜き出して、同じデータ構造でPOSTしてあげればいいだけ!
  • 65. これでOK
  • 66. 超簡単!
  • 67. 簡単すぎて技術仕様書要ら ず!
  • 68. これで今日から君 も facebookアプリ 開発者だ!
  • 69. </アプリ開発編 >
  • 70. <使い方編>
  • 71. このセクションではfacebookの機能仕様について紹介します
  • 72. しかもお題はなんと
  • 73. 「動作仕様がよくわからない機 能」
  • 74. 10人中8人くらいはちゃんと理解して使っていないだろうと思われる 機能を3つ紹介
  • 75. その1友達の親密度設定
  • 76. トモダチ
  • 77. facebookには 3種類の友達レベルがあるの を ご存知でしたか?
  • 78. 1.普通の友達2.親密な友達3.知り合い
  • 79. 親密度設定をすると一体どうなるのか?
  • 80. デフォルト設定では・・・※この状態に特に名前はついていないので、便宜上「普通の友達」と言うことにします• フィードの表示対象が「ほとんどのアッ プデート」になる。• あとはfacebookの表示対象選定エンジン任 せ
  • 81. 「親密な友達」に設定する と・・・• フィードの表示対象が「すべてのアップ デート」になる。• その人が何か投稿するたびに左上の通知 領域に通知が表示されるようになる。
  • 82. 主な利用用途ネットストーキング
  • 83. 「知り合い」に設定する と・・・• フィードの表示対象が「重要なアップ デートのみ」になる。• いわゆる「友達以下」に分類される人用• 近況に興味がない友達の設定としてオス スメ• 転職したり、結婚した時に「おめでと う!」と言っておしまい程度の関係
  • 84. おまけ1:「フィードの購読をやめ る」• 友達申請を受理したものの、正直近況を 見たくない人用• これを設定すると、その名の通りフィー ドが一切表示されなくなる• 先方からは察知されないので安心
  • 85. おまけ2:「アプリからの投稿を非表示にす る」• やたらむやみにPOSTしてくるアプリをつ かっている人におすすめ• 「アプリ」単位で非表示設定ができる• 「個人×アプリ」単位では非表示設定はで きない• これを行使されたアプリ開発者は深く反 省すべき
  • 86. ちなみに
  • 87. これらの親密度設定は Graph API からは 一切取得できません
  • 88. こんなの他人にバレたら大変ですもんね
  • 89. それ以上に自分がハブられてることを知ってしまうことのほうが 辛いかもしれませんが
  • 90. その2友達リスト
  • 91. 友達リストとは• 増えすぎた友達をグループ化して管理す る機能• あまりにも使われなかったせいか、 facebookのアップデートが進むにつれ隅に 追いやられてしまった不遇な存在• でも「情報の共有範囲」に神経質な人に とっては非常に便利な機能
  • 92. 使い方
  • 93. マウスオーバーしないとでてこない!
  • 94. 友達リストの活用例• 「あれ、こいつ誰だっけ?」を防ぐ – 「X年Y月Z日の合コンで知り合った人」 – 「○○株式会社」 – 「ナントカ勉強会で会った人」• 投稿の共有範囲の設定に使う – 「同僚」 – 「取引先」 – 「大学の友人」
  • 95. この投稿を「同僚」ではない人 or 「上原仁」が閲覧しようとすると
  • 96. もちろんフィードにも表示されることはありません
  • 97. 閲覧可能な人の図公開対象者を足し算してから非表示対象者を引き算 公開対象者 非表示対象者
  • 98. 友達リストの登録方法 その2
  • 99. その3「いいね!」ボタン
  • 100. facebookには 2種類の「いいね!」がある のを ご存知でしたか?
  • 101. 1.ユーザー投稿に対する「いいね!」2.facebookページに対する「いいね!」
  • 102. 1.ユーザー投稿に対する「いいね!」• 友達の投稿を見ておもしろかったら押す もの• 投稿者が喜ぶので気軽にやるべし• 「投稿を読んだよ」というメッセージの 代わりでもよい
  • 103. 2.facebookページに対する「いいね!」• そのページに書かれているものに対 して「ファンになることを宣言」す ることを意味する• そのページの所有者による投稿が自 分のフィードに表示されるようにな る ※facebookページには所有者が存在している
  • 104. 例for example
  • 105. 押したら最後あなたは「イ」という番 組の ファンとみなされます
  • 106. facebookページ所有者からみた「いいね!」• 大抵のfacebookページ作成者は、プロモー ション目的でページの作成を行う• 「いいね!」の数はそのままメディア力 となる• だからページ所有者達は「いいね!」数 を稼ぐことに必死
  • 107. facebookページあるある「いいね!」をクリッ クして 診断スタート!
  • 108. facebookページあるある「いいね!」をクリッ クしてキャンペーンに応募!
  • 109. facebookページあるある みんなもう「いい ね!」をクリックしましたよ!
  • 110. 知られざる「いいね!」の仕様• 「いいね!」は取り消すことができる ※ページ所有者が最も恐れている行為• 取り消さなくても、ページからの投稿を 非表示にすることができる• 「いいね!」をつけれるページの数は1 ユーザーあたり500ページまで
  • 111. </使い方編>
  • 112. まとめ• 開発編 – facebookの実装仕様はとってもシンプル – Graph API Explorerを使いこなそう – 基本を押さえるだけで技術仕様書要らず• 使い方編 – 知らなかったで済まされる機能は結構沢山あ る – facebookページへの「いいね!」は重い
  • 113. おしまい