 |
-
Facebook App.開發心得分享
技術快報 
Posted on 九月 24th, 2009 
18 comments 
前陣子完成了兩個Facebook App.有關的專案：波蜜Eye現Live秀、波蜜Eye現Live秀電眼能量補給品以及漢堡王真情不怕火烤，友情大PK。因為那時忙到出國前幾個小時，接著兩個禮拜都在國外，回來後立刻被追殺要分享，加上Blog缺水好久了，那就來個開發心得吧。不過因為是對一般人的分享，這邊得要先略過技術與程式碼的部分了。
首先複習一下，Facebook App.的三種類型的應用：在Facebook上的、外部網站的、以及桌面的App.。第一種Facebook上的App.，就是會套上Facebook的chrome，也就是上下的外框，然後網址是”http://apps.facebook.com/appname/”，appname就是每個App.特有的名稱。這頁叫作畫布canvas。中間則是用iFrame或FBML顯示App.的內容，而App.的內容就是要自己找server放啦！也就是hosting在自己家，資料庫等等也都是用自己的，所以在開發上其實跟一般網站沒多大差別。這種好處是可以在Facebook網站上就可以連結到，也可以有加入書籤等等功能。寬度760。實際製作750會比較好。我們做的波蜜Eye現Live秀電眼能量補給品就是這一類的應用。
第二種是外部網站，就是用自己的URL，需要Facebook的功能或資料時再用Facebook Connect（也就是聯外通）來跟Facebook溝通。波蜜Eye現Live秀以及漢堡王真情不怕火烤，友情大PK就是這樣。
第三個桌面的應用，是用Adobe AIR來製作。AIR我們在康乃馨御守棉有使用到，而這樣的桌面應用程式也可以跟Facebook連結。
接下來聊聊我們目前可以利用Facebook做到哪些事情。首先，登入與連結，這當然是最基本的，但其實不是那麼簡單。在此感謝並推薦米蘭Jason的Blog，對登入這一塊寫得很清楚。
登入與連結後當然是要取得使用者與朋友的資訊，至於哪些資訊呢？要我一一列出來實在太多了，大家可以到自己的Facebook上看看自己的個人檔案，光分類就有好幾個。真要我列出來，我只好貼說明文件給大家了。要特別說明的是：Email抓不出來。只能透過Facebook去幫你發信。我想這是Facebook對使用者的保護，大家應該都不希望自己的Email從Facebook上流出去吧。個人資訊除了顯示使用者，或者製作朋友選擇器，玩的最極致的大概是這類的朋友分析網站。有了使用者與朋友的資料，要玩甚麼，其實就跟一般活動差不多了，因為基本上就算是套上Facebook的外框，實際的檔案資料庫等，都還是在我們自己server上跑。
再來就是擴散。先講單純一點的通知。所謂通知就是在Facebook頁面的右下角，可以用簡短的訊息來通知使用者，可以加上連結將收到通知的使用者導回App.或活動網站。可以分App.發送的或使用者發送的，差別在使用者發送的前面一定是發送者暱稱開頭。這可用在使用者在App.對朋友做了甚麼事情的時候發送出去。不過就我觀察，好像很多人從來不去看這些通知…。
另外就是發布一則動態消息。動態消息其實還有分即時動態跟塗鴉牆，即時動態就是在個人首頁就可以顯示出來的，而塗鴉牆則是點了使用者的塗鴉牆後才會顯示出來的。Facebook提供了幾種方法來發布這些動態消息，各有優劣與限制。目前試過最好用，可以跟朋友做到雙向塗鴉牆，會顯示在首頁即時動態，還可以放上Flash或影片，文字與連結也足夠使用的方式，詳細規格請見附圖。要使用這個功能使用者必須同意授予延伸權限，就是會多個同意的小視窗須要確認就是了。
延伸連結現在只能有一個了，而且如果發布在朋友的塗鴉牆上不會顯示，發布在自己牆上才會正常顯示。以上三步，再結合我們以前開發Flash專案的經驗，就可以玩出很多東西了。不過還是要繼續來談談，Facebook還提供了哪些功能，我們還沒用到，可以繼續去嘗試的。
首先，就是發送email的功能。前面講過沒辦法抓使用者的email，但可以透過App.去發送。一次100個為限。目前已測試成功。
發送邀請，就是Facebook右上角的”你有一個xxx的邀請”，這部分目前沒看到API有提供方法去發送，只看到FBML，也就是Facebook製定的元件來發送邀請。限制就是這東西會變成獨立頁面，且設計上就要依照邀請的元件來排了。
可以用div疊在原本頁面上，就可以不用切換頁面了。不過邀請的人數上限設定一天最多35人，而這個上限修改後似乎要一段時間才會改變，但也沒看到官方有啥說明。相簿功能，可以增加相簿，上傳照片，加上標籤等等。這些功能可以讓”tag朋友”的流程變得比較簡單，波蜜Eye現live秀本來想加上這功能，不過因為製作時間緊迫就先跳過了。這個功能測試成功了。
粉絲專頁，目前我們試用了兩個現有的App.來增加粉絲專頁的內容。第一個是我的貼紙My Stickers，可以上傳一張圖，然後貼到個人檔案裡面。
另一個是Static FBML，可以在粉絲專頁上面新增一個tag，裡面可以放一般的html內容，甚至是Flash。這兩個應該是好用又簡單的工具，若要自製其他功能來經營粉絲頁的話就要多花點工夫了。
活動，不知道有多少人會去使用這個tag？總之Facebook也提供了一些方法讓你透過App.去新增一個活動。
社團，就是大家應該都有加入Webgene這個社團，Facebook API可以去抓使用者的社團資訊以及參與社團的使用者清單。不過對一般行銷活動好像沒太大用處。
加入書籤，可以將app.加入user的Facebook左下角書籤中。這個功能測試成功了。
以上是Facebook目前開放出來的API大概的功能簡介，不過Facebook其實一直持續的在新增功能，所以以後也許還有其他功能也不一定。另外，除了一般的活動，社群網站如果再進一步結合多人線上的機制，那效果應該蠻大的。講到這，我們的網基in幫幫計畫已經停滯多時，我是一直放在心上啦，不過現階段似乎很難再繼續開始研究這一塊，也許要等到多年以後了吧。
開發與研究這些東西的過程中，也有幾個心得與問題跟大家分享一下。第一：如果以單純掛在Facebook上的App.來講，跟一般活動最大的不同是：在社群網站上，使用者更在意的是跟他或他朋友有關的內容，這跟一般活動網站，在沒有登入機制下，必須去瀏覽所有”參加作品”，然後再從中”搜尋”自己或朋友的作品的流程是不一樣的。當然如果是外部網站，同時要兼顧沒有Facebook的使用者，那這一點就不成立。第二：透過Facebook去傳遞，理論上活動成效與瀏覽數相對比一般活動高，這會更凸顯檔案大小與頻寬等問題。設計師應該更注意檔案大小的控制與壓縮，設計上能以向量取代點陣的話更好。第三：為什麼是Flash？因為一旦在某個平台上面可以執行Flash，我們就可以很輕易的把我們之前製作Flash活動的經驗帶到這個平台上，而Facebook剛好可以。第四：Flash與Facebook連結而衍生出來的一個問題：為了能正常顯示Facebook的一些彈跳出來的視窗，只好設定Flash的wmode=transparent，而無可避免的遇到Flash在Firefox底下無法輸入中文的問題。嗯…非Flash程式人員只要簡單記得Facebook的彈跳視窗會與Flash中文輸入產生一連串奇怪的衝突就好。這是多年來Flash或Firefox(我不知道應該把責任歸咎到誰身上，反正不是我)的一個bug，目前的解決方法是在需要輸入中文的輸入框後面在加上個button，點了之後再利用彈跳視窗輸入文字，確定後再貼到Flash裡面。這的確會造成使用者的不便，也可能造成活動的流失率增加，不過這是我目前可以提出最簡單的解法了。
終於來到的最後一行。
18 responses to “Facebook App.開發心得分享”
-
我們家玩漢堡王玩很瘋說@@
利害!!!!!!!! -
mouse 九月 30th, 2009 at 01:24
看來, 未來這些開發不單是技術課題, 更重要的是心理課題了.
-
Jashua 十月 2nd, 2009 at 16:53
不知道主機的loading會不會吃的很兇～我的遊戲公司小老闆一直很好奇說～
-
我想請問：
1.如果不加入某入為朋友，有沒有方法自外部看到或測到該使用者已經在FACEBOOK上線？
2.如果想試著去開發 FACEBOOK 的 APP，請問由那邊找資料比較快呢？
因為是新手，請多包涵～
-
evelyn 十月 29th, 2009 at 08:45
請問你有接網站ㄉcaseㄇ？
-
您好
請問facebook有辦法製做到分享訊息能將此訊息傳送到討論區，或者是MSN上面嗎
-
switchbook 三月 10th, 2010 at 14:27
請問你有接case?特別是Facebook,Twitter,…社群類的?
-
syivia 四月 19th, 2010 at 18:04
哈囉
看到你對facebook的專業
我想跟你請問一個關於fb粉絲團的問題
我現在有設立一個粉絲團
裡面的頁籤我有用到fbml
我發布了內容以後
為什麼他的內容並沒有出現在粉絲團首頁的塗鴉牆
並須是點到頁籤內才可以知道有新訊息
我研究很久了
希望你可以幫我解答一下~謝謝!! -
gray_liao 四月 19th, 2010 at 18:54
To:syivia
頁籤的內容本來就不會出現在首頁的塗鴉牆,塗鴉牆本身就是第一個頁籤,而且沒辦法被移動.塗鴉牆的內容是一些POST.關於頁籤的用法可以參考我們的另外一篇文章:http://blog.webgene.com.tw/?p=2295 -
syivia 四月 20th, 2010 at 10:56
哈囉~gray..
謝謝你的回覆
所以你的意思是說..
我發布的FBML內容是無法像發布網誌一樣
在塗鴉牆上會同時發布(單行記事)的最新動態嗎??
再次麻煩你幫我解答
謝謝!! -
gray_liao 四月 20th, 2010 at 11:16
To:syivia
那可能要先了解一下你所謂的發布FBML是用甚麼方法發布的了。 -
syivia 四月 20th, 2010 at 13:40
哈囉~gray..
真的很感謝你的回答
我的FBML是用HTML語法寫的
寫完了以後
我就是直接儲存
但是文章就只出現在我我設定的頁籤裡面不好意思~一直麻煩你~謝謝!!
-
antonis 七月 1st, 2010 at 11:55
請問上傳圖片到fackbook相簿
使用javascript有可能作到嗎
(php我不熟),或者有其他建議?
我是作web開發的 感謝~ -
gray_liao 七月 1st, 2010 at 14:01
To:antonis
只要能把圖片資料丟給api就可以，我們通常是用flash去呼叫facebook api，javascript不敢說一定沒有，但沒用過就是了 -
我也做了一個facebook app叫CutePhoto
facebook app的散播力真的很強 -
xiong 八月 2nd, 2010 at 09:23
请问一下新版的javascript sdk 里面怎么发布动态消息啊，我用Live stearm 发的时候怎么不能换行？
-
simon 八月 18th, 2010 at 00:04
您好，想請教一下，app放到page後，當用戶access tab時，只會發送page id到app，那麼，如何才能獲取這個page的owner ID呢？我的app需要根據不同的owner顯示對應的內容。謝謝
誠信求教，煩請mail我： simonhongcn@gmail.com -
gray_liao 八月 18th, 2010 at 10:09
To simon:
這問題可以看看這一篇
http://grayliao.blogspot.com/2010/08/facebooktabfbjsuid.html
Leave a reply
-
 |
基因酷為網路基因資訊(股)公司所有 © 2010 WebGene. All Rights Reserved.Powered by WordPress 台北市100忠孝東路一段85號6樓 T : 886-2-23955378 F : 886-2-2392-8469 |