クリエイティブキャンプ2013:スマホでFacebookアプリの第一歩

2,717 views

Published on

関連ブログ:MUSHIKAGO APPS MEMO
http://mushikago.com/i/?p=3176
http://mushikago.com/i/?p=3270
http://mushikago.com/i/?p=3331
http://mushikago.com/i/?p=3368

サッポロクリエイティブキャンプ2013
スマホでFacebookアプリの第一歩

Published in: Technology
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,717
On SlideShare
0
From Embeds
0
Number of Embeds
1,958
Actions
Shares
0
Downloads
9
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

クリエイティブキャンプ2013:スマホでFacebookアプリの第一歩

  1. 1. サッポロクリエイティブキャンプ2013 いこうよ!「クリエイティブキャンプ」 ∼スマホでFacebookアプリの第一歩∼ 2013年10月19日 ICC「Cross x Garden」 講師:白石哲也(虫カゴデザインスタジオ株式会社) 13年10月21日月曜日
  2. 2. 自己紹介 虫カゴデザインスタジオ株式会社 白石 哲也(しらいし てつや) 東京造形大学卒業後、マクロメディア(現アドビ システムズ)に入社。Quality Assurance やテクニカルサポートマネージャーとしてFlash、DreamweaverなどのWeb製品を担当。 独立後、虫カゴデザインスタジオ株式会社を設立し、現在では、Adobe AIRやPhoneGap、 Titaniumを利用したiOS向けのアプリ開発に従事。 twitter : @mushikago facebook : http://facebook.com/mushikago      : http://facebook.com/mushikago.inc web : http://mushikago.com/ blog : http://b.mushikago.com (MUSHIKAGO APPS MEMO) 13年10月21日月曜日
  3. 3. 概要 ■概要: Facebookアプリの第一歩として、講師が開発したアプ リを例に、iOS用のアプリからFacebookへ画像を投稿 するまでの流れを紹介します。開発環境として、Adobe AIR、PhoneGap、Titaniumの3種を想定しています。 ■開発ツール: • Adobe Flash Professional CC (Adobe AIR) • PhoneGap Build • Titanium Mobile 13年10月21日月曜日
  4. 4. 予定 10/19 15:00 - 18:00 ➡ Facebookへの投稿について ➡ Facebook開発者登録の流れ ➡ 画像投稿の流れ(Titanium + GitHub 紹介) ➡ 開発ツール紹介 (奮闘中) ・PhoneGap Build + GitHub 紹介 ・PhoneGap + FacebookConnect ・Flash Pro + Gaming SDKs ・Flash Pro + AirFacebook.ane 13年10月21日月曜日
  5. 5. Facebookへの投稿について 13年10月21日月曜日
  6. 6. Facebookへ画像を投稿する 2つの方法 OSまかせ 13年10月21日月曜日 自分のアプリ
  7. 7. iOSとFacebook iOS6.0でOS自体にFacebookが統合され、カメラロールなど から直接Facebookへアップロードできるようになった。 iOSより 画面はiOS7.0 13年10月21日月曜日
  8. 8. Social.framework XcodeでSocial.frameworkを使うと、自作アプリからも このOS標準の機能を簡単に利用できる。 Xcode + Social.framework 13年10月21日月曜日
  9. 9. 自分のFacebookアプリから Facebook開発者登録を行って、自分のFacebookアプリを 使って投稿する。(iOS6.0以前はこの方法しかなかった) https://developers.facebook.com 13年10月21日月曜日
  10. 10. Graph API OneTwoPunch Graph APIを使うと、画像投稿だけではなく、Facebook上の さまざまなデータにアクセスするアプリが作れます。 MUSHIKAGO OneTwoPunchより 13年10月21日月曜日
  11. 11. FACEBOOK DEVELOPER Facebook開発者登録の流れ 13年10月21日月曜日
  12. 12. Facebook : 開発者登録をしてApp IDを取得するまで http://mushikago.com/i/?p=3176 13年10月21日月曜日
  13. 13. 画像投稿の流れ (Titanium Mobile + GitHub) 13年10月21日月曜日
  14. 14. Titanium Mobileでの例 Titanium MobileにはFacebookモジュールがついているので、 それを利用してみる。 + Titanium Mobile 13年10月21日月曜日 GitHub
  15. 15. Titanium StudioとGitHubをセットアップする http://mushikago.com/i/?p=3270 13年10月21日月曜日
  16. 16. Titanium : GitHub上のプロジェクトをForkして開く http://mushikago.com/i/?p=3331 13年10月21日月曜日
  17. 17. 画像投稿の流れ:example https://github.com/mushikago/ImgToFB/ blob/master/Resources/ui/common/ FirstView.js short URL http://bit.ly/imgtofb 13年10月21日月曜日
  18. 18. 解説 Facebookモジュールの組み込み モジュールを使用する準備:tiapp.xml <property name="ti.facebook.appid">152874854922555</property> と FBのAppID <modules> <module platform="iphone">facebook</module> </modules> を追加。 13年10月21日月曜日
  19. 19. 解説 ログインと認証(アプリの使用許可) ログイン成功 認証画面 ログインしているか 13年10月21日月曜日 共有範囲選択(省略可)
  20. 20. 解説 投稿範囲の選択と投稿 privacy _postObj 'ALL_FRIENDS' 'EVERYONE' 'SELF' ○.requestWithGraphPath("me/photos", _postObj, "POST", function(e){...}) function(e) 13年10月21日月曜日 e.success
  21. 21. もう一度 short URL http://bit.ly/imgtofb 実際の動作 http://vimeo.com/mushikago/imgtofb 13年10月21日月曜日
  22. 22. 開発ツール紹介 (奮闘中) 13年10月21日月曜日
  23. 23. PhoneGap Build : Githubを使って最初のアプリをビルド http://mushikago.com/i/?p=3368 13年10月21日月曜日
  24. 24. 奮闘中 • PhoneGap Build : FacebookConnect • Flash Pro + Gaming SDK (Social.ane)   • Flash Pro + AirFacebook.ane  • Flash Pro + GraphAPI_Mobile_1_8_1.swc 13年10月21日月曜日
  25. 25. 【DEMO】 Flash Pro CC / PhoneGap Build 13年10月21日月曜日
  26. 26. つづきは MUSHIKAGO APPS MEMO で。 http://b.mushikago.com/ 虫カゴデザインスタジオ株式会社 白石 哲也(しらいし てつや) twitter : @mushikago facebook : http://facebook.com/mushikago      : http://facebook.com/mushikago.inc web : http://mushikago.com/ 13年10月21日月曜日

×