顯示具有 Facebook 標籤的文章。 顯示所有文章
顯示具有 Facebook 標籤的文章。 顯示所有文章

2010年1月6日 星期三

Adaptive Path: 未來網路介面





Adaptive Path 最近跟 Mozilla 合作一個 叫做 Aurora 的新 Project,這個 Project 主要是想要建立一個全新的 Web UI 互動環境,融合了 Social Network, Information Visualization 以及 Portability。後面有四個 Demo 的情境 video,介面很酷,不過容我說一句話,這個介面太過複雜了,其中有一個 Demo 還是給老人家用,我很懷疑他們的 designer 團隊到底有沒有做好 User Study…
附帶一提, Adaptive Path的執行長是 Jesse James Garrett,他是喊出 AJAX 的人,所以應該也是個傳奇人物吧

Aurora (Part 1) from Adaptive Path on Vimeo.

Aurora (Part 2) from Adaptive Path on Vimeo.

Aurora (Part 3) from Adaptive Path on Vimeo.

Aurora (Part 4) from Adaptive Path on Vimeo.
via: TechCrunch

Skyrails: 視覺化 Social Network


New Screenshots 

over 9000 nodes, has groups, has bookmarking system, has protein structure displayed, has automatic grouping, .. and the language has transformed yet again. Manual will be out sometimes in the distant future as well.



http://www.flickr.com/photos/14933315@N ... 707590708/

FYI I'm working with biologists from UNSW for this thing. This particular tool will be released in a few months, after everything is ironed out.

Cheers

Palantir : 視覺化Facebook上的活動與人群的連結

由 Mr. Wednesday 的社交網站搜集與研究上面所轉錄:
The Living Sea divx
Facebook數名工程師進行了一個Project叫做Palantir,將Facebook上的活動與人群間的連結在地球上視覺化顯示出來。

(Image Source: TechCrunch)
完整的影片可以看這裡

2010年1月3日 星期日

用Flash開發Facebook App.

轉載自
http://blog.webgene.com.tw/?p=969&cpage=1#comment-210

首先介紹,Facebook Developers,Facebook開放出來讓我們開發App.的平台,沒開這個一切免談啊~~大概看一下,就點一下綠色的那個”Start Now”下去,然後好像要允許存取吧,接著來到Started頁面,這頁主要教你怎樣在Facebook開一個新的App.,右手邊有個PHP Client Libraries可以下載,裡面當然是給PHP用的Libraries。大概看過後可以點中間的”Go to the Facebook Developer App”,就可以到你的開發者頁面了。允許存取好像在這一步?我有點忘了…好,總之到了這一頁,右上有個”+Set Up New Application”,點下去就可以開一個新的App.啦。到這裡要先打住,不過這頁面先留著,等等還要回來用到它。
目前有三個Libraries可以用來開發Facebook App.:PHP、Javascript、還有就是AS3啦。這篇要介紹的重點當然是AS3,不過另外兩個也很重要,如果開發純html的App.就要用Javascript跟PHP啦,即使是AS3開發,可能還是會遇到需要server端跟Facebook溝通的情形,所以PHP Libraries可能也少不了。
AS3的Libraries叫做ActionScript 3.0 Client Library for Facebook Platform API。應該是Adobe今年三月open出來的東西。檔案下載在Google Code線上文件在這。在開始使用之前,先看看上面有關architecture的文章。第一頁講的是用這個Libraries可以開發三種類型的App.:在Facebook上的、外部網站的、以及桌面的App.。第一種Facebook上的App.,就是會套上Facebook的chrome,也就是上下的外框,然後網址是”http://apps.facebook.com/appname/”,appname就是每個App.特有的名稱。這頁叫作畫布canvas,等等設定時會再提到。中間則是用iFrame或FBML顯示App.的內容,而App.的內容就是要自己找server放啦!也就是hosting在自己家,資料庫等等也都是用自己的,所以在開發上其實跟一般網站沒多大差別。這種好處是可以在Facebook網站上就可以連結到,也可以有加入書籤等等功能。寬度760。第二種是外部網站,就是用自己的URL,需要Facebook的功能或資料時再用Facebook APIFacebook Connect來跟Facebook溝通。用Facebook API登入的話必須要另開一個登入視窗,才能再回到原本的App.網站,用Facebook Connect比較能達到seamless的登入。第三個桌面的應用,當然是用AIR啦!講到這,如果各大農場可以開發個AIR,讓各位農民可以在桌面上得知農作物的生長情形,提醒收成時間等,應該會大受歡迎吧!不過這要開發的廠商才能做,因為前面講過,遊戲的資料庫在他們家啊~看完這篇可別叫我做一個出來。接下來幾頁則是介紹有無Flash,iFrame或FBML,以及desktop的架構。裡面圖文並茂,就請有興趣的自己看吧,這很重要喔!!懂這些架構等於就會一半了。註:FBML是一種延伸的html標籤語法,標籤裡面都是fb:開頭,不在這篇要說的範圍裡,所以有興趣的請先自行研究吧。
好,看了這麼多文件之後,如果你還在的話,來實做一個App.吧。這裡我們要做一個在Facebook上面,有Flash,使用iFrame的App.,前面文章skip過的人可以回去找一下這類型的架構。看了這麼多文字介紹,來看個影片教學吧。啥?老外講的話有聽沒懂?好吧,簡單再介紹一下,前半段就是介紹我們一開始在Facebook Developers開一個新的App.的步驟。頁面應該還保留著吧?”基本資料”頁籤裡面有API金鑰跟秘密兩個又臭又長的密碼,這兩個資料在連線的時候要用到。”畫布”頁籤裡面的”畫布頁面網址”有留一個欄位要填,就是前面有介紹的appname,網址後面那個目錄名稱,自己取,英文小寫跟破折號跟底線,不能有數字喔。取完整串就是你的App.的網址。接著有個”Canvas Callback URL”就是我們實際放App.的地方,所以放個html跟swf到自家的server上,然後把網址貼到這裡面吧。最後,”進階”頁籤裡面有個”Application Type”,一開始開發Flash時可以先選”Desktop”,方便測試,要上線測試時再回來改成”網站”就好了。影片後半段講程式的部分,我想看程式應該看的懂了,只不過他是用Flex開發,用Flash的話,基本上就是自己手動作元件,程式只要改顯示資料在自己的元件上就好了,其他Function照打出來就可以了。我照做之後再研究了一下FacebookUser類別,把生日跟性別也抓出來,然後前面講的那些設定好之後,做了一個測試App.出來。顯然這影片介紹的登入方法不夠seamless,還要再找找其他方法。還有就是FacebookUser裡面似乎沒看到email的屬性,這對網路行銷可是很重要的東西啊,還有他的friends屬性會回傳一個Array,不知是不是朋友的列表,我呼叫它似乎找不到這個屬性。總之,細部的應用還要再研究一番,不過看起來應該是可以來開發一些東西了。
檔案下載