Facebook Apps:
 Thinking about UI
   in a social way




                Wayne Graham, UVa
Arin Sime , OpenSource Connecti...
About Us

•   Wayne Graham                        • Arin Sime
                                           •   Software cons...
http://www.redstamp.com/products/1931-Who-Cares-Sticky-Notes-Anne-Taintor
Is this a good idea
• 300+ million users
• Advertise events
• Connect with
  students and
  prospective
  students
• Limit...
Web APIs
                                                                                • Extend existing
               ...
Facebook API
 Workflow
Official Libraries
• Java
• PHP 5
• JavaScript
• iPhone (Objective C)
• ActionScript 3
• Force.com
Unsupported Libraries
Android       •
              •
                  Lisp
                  Perl
                      ...
Components
• API (REST calls)
• FQL (Facebook Query Language)
• FBML/XFBML (extension of X/HTML tags)
• FBJS (scrubbed JS)
API Components
• Authorization
• Data Store
• Permissions
• Photo/Video Uploads
• Notification
First Steps
• Add Developer App (                     http://www.facebook.com/developers )
• Wiki (              )
       ...
Yo Dude, I’m real happy for you.
Imma gonna let you finish
but MySpace is one of the best
APIs of all time!!!
From one extreme...




              http://apps.facebook.com/thesocialcircles/
... to the other extreme




                  http://apps.facebook.com/thesocialcircles/
Putting it all together
Facebook
    app
 lifecycle
1. Get the Add
                 Ge
                   d
                    tt
                 Ad he
Ge
              tt
           Ad he
             d
                   Se
                     tup
2. Setup
Ge
                    tt
                 Ad he
                   d
                         Se
                        ...
Ge
              tt
           Ad he
             d
                   Se
                     tup

                      ...
Ge
             tt
          Ad he
            d
                  Se
                    tup

                          I...
Ge
                   tt
                Ad he
                  d
                        Se
                          tu...
Ge              And if you get it right...
   tt
Ad he
  d
        Se
          tup

                   Inc
              ...
Ge              And if you get it right...
   tt
Ad he
  d
        Se
          tup

                   Inc
              ...
Ge              And if you get it right...
   tt
Ad he
  d
        Se
          tup

                   Inc
              ...
Facebook Athenaeum
• Get Facebook users to library resources
• Provide a social “hook”
• Open Source
Business
Hook
Questions?




                                                                    Wayne Graham, UVa
http://www.facebook.c...
Oh yeah, code...
Oh yeah, code...

               response =
    fbsession.users_getInfo(:uids =>
[fbsession.session_user_id], :fields =>
  ...
Oh yeah, code...
Ed Ui - The Facebook API:  Thinking about UI in a social way
Upcoming SlideShare
Loading in...5
×

Ed Ui - The Facebook API: Thinking about UI in a social way

1,179

Published on

Presented at EdUI 2009 at the University of Virginia, this presentation talks about UI and application design from the perspective of a Facebook application. First, UVa's Wayne Graham describes how Facebook applications works. Then Arin Sime, a Senior Consultant with OpenSource Connections, talks about best practices for developing facebook applications that will actually be used.

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

No Downloads
Views
Total Views
1,179
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
32
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Ed Ui - The Facebook API: Thinking about UI in a social way

  1. 1. Facebook Apps: Thinking about UI in a social way Wayne Graham, UVa Arin Sime , OpenSource Connections
  2. 2. About Us • Wayne Graham • Arin Sime • Software consultant with • MA in History OpenSource Connections • 10 years in higher ed/digital • UVa grad student at McIntire humanities • Community Development • Adjunct instructor at VCU • Geek • Working on challenge based fundraising tools for Facebook • Facebook API Developer’s Guide
  3. 3. http://www.redstamp.com/products/1931-Who-Cares-Sticky-Notes-Anne-Taintor
  4. 4. Is this a good idea • 300+ million users • Advertise events • Connect with students and prospective students • Limits...
  5. 5. Web APIs • Extend existing applications • Web services... • Mashups http://www.internetannoyanceday.com/wp-content/uploads/2009/04/programmer.jpg
  6. 6. Facebook API Workflow
  7. 7. Official Libraries • Java • PHP 5 • JavaScript • iPhone (Objective C) • ActionScript 3 • Force.com
  8. 8. Unsupported Libraries Android • • Lisp Perl I can haz •ASP.net • Python • Ruby •Cocoa • Smalltalk •ColdFusion • Tcl • VB.NET •C++ • • Windows Mobile zembly my language •C# plzkthx
  9. 9. Components • API (REST calls) • FQL (Facebook Query Language) • FBML/XFBML (extension of X/HTML tags) • FBJS (scrubbed JS)
  10. 10. API Components • Authorization • Data Store • Permissions • Photo/Video Uploads • Notification
  11. 11. First Steps • Add Developer App ( http://www.facebook.com/developers ) • Wiki ( ) http://wiki.developers.facebook.com • Developer Forum ( ) http://forum.developers.facebook.com/ • Get a sample app • Write Unit Tests!!!
  12. 12. Yo Dude, I’m real happy for you. Imma gonna let you finish but MySpace is one of the best APIs of all time!!!
  13. 13. From one extreme... http://apps.facebook.com/thesocialcircles/
  14. 14. ... to the other extreme http://apps.facebook.com/thesocialcircles/
  15. 15. Putting it all together
  16. 16. Facebook app lifecycle
  17. 17. 1. Get the Add Ge d tt Ad he
  18. 18. Ge tt Ad he d Se tup 2. Setup
  19. 19. Ge tt Ad he d Se tup Inc en tiv ize 3. Incentivize
  20. 20. Ge tt Ad he d Se tup Inc en tiv ize are 4. Share Sh
  21. 21. Ge tt Ad he d Se tup Inc en tiv ize are 5. Feed Sh Fe ed
  22. 22. Ge tt Ad he d Se tup Inc en tiv ize ba me ! ck Co 6. Come back! are Sh Fe ed
  23. 23. Ge And if you get it right... tt Ad he d Se tup Inc en tiv ize ba me ! ck Co are Sh Fe ed
  24. 24. Ge And if you get it right... tt Ad he d Se tup Inc en tiv ize ba me ! ck Co are Sh Fe ed
  25. 25. Ge And if you get it right... tt Ad he d Se tup Inc en tiv ize ba me ! ck Co are Sh Fe ed
  26. 26. Facebook Athenaeum • Get Facebook users to library resources • Provide a social “hook” • Open Source
  27. 27. Business
  28. 28. Hook
  29. 29. Questions? Wayne Graham, UVa http://www.facebook.com/design Arin Sime , OpenSource Connections http://www.ustream.tv/channel/facebook-tech-talks
  30. 30. Oh yeah, code...
  31. 31. Oh yeah, code... response = fbsession.users_getInfo(:uids => [fbsession.session_user_id], :fields => ["first_name", "last_name", "name", "uid"])
  32. 32. Oh yeah, code...
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×