I Love Techno - the site

1,259 views
1,195 views

Published on

How we built ILoveTechno.
Coders: Amphion, Krimson, Pronovix

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,259
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
12
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

I Love Techno - the site

  1. 1. Saturday, December 12, 2009
  2. 2. Saturday, December 12, 2009
  3. 3. Saturday, December 12, 2009
  4. 4. • Amphion - Flash development - Antwerp • frontend, content management, client contact, design • Krimson - Drupal specialist - Antwerp • project management, architecture supervision, theming, server related • Pronovix - Drupal specialist - Belgium/Hungary • special Drupal projects, backend / service architecture, technical help Saturday, December 12, 2009
  5. 5. About us • Peter Arato • Jo Wouters (user/428960) (user/8777) • Hungary • Belgium • Pronovix • Krimson | Drupal Architects • Drupal, Flash, Tech • Project management, Consultancy, Training, Development Saturday, December 12, 2009
  6. 6. About ILoveTechno • http://www.ilovetechno.be/ • 1995 .. 2009 ... • Techno festival • Informational site • Aggregator site Saturday, December 12, 2009
  7. 7. Saturday, December 12, 2009
  8. 8. Saturday, December 12, 2009
  9. 9. Saturday, December 12, 2009
  10. 10. Saturday, December 12, 2009
  11. 11. Co-operation • Communication • Motivation • Well shared tasks • Iterative development (prototyping) Saturday, December 12, 2009
  12. 12. Requirements Saturday, December 12, 2009
  13. 13. Music player Saturday, December 12, 2009
  14. 14. Saturday, December 12, 2009
  15. 15. Flash objects Saturday, December 12, 2009
  16. 16. Saturday, December 12, 2009
  17. 17. Lineup editor Saturday, December 12, 2009
  18. 18. Saturday, December 12, 2009
  19. 19. Different page elements Saturday, December 12, 2009
  20. 20. Saturday, December 12, 2009
  21. 21. Aggregation Saturday, December 12, 2009
  22. 22. Saturday, December 12, 2009
  23. 23. ... bunch of general Drupal stuff Saturday, December 12, 2009
  24. 24. Features • Druplash • Deeplinking • Dynamic content loading • Graceful degradation • XML-RPC content pulling • ... other interesting stuff Saturday, December 12, 2009
  25. 25. Druplash • Flash (frontend) • Drupal (backend + content + layout) • Communication (client, server) • Different implementations • SWFAddress (SWFObject), Services, AMFPHP Saturday, December 12, 2009
  26. 26. Deeplinking • Persistent URL • History • SWFAddress Saturday, December 12, 2009
  27. 27. ActionScript Saturday, December 12, 2009
  28. 28. JavaScript Saturday, December 12, 2009
  29. 29. 1st page load • Loading original content (example.com/news) • Redirect to $basePath (example.com/#/news) • Loading content of the given URL (Ajax) • Replace content with Flash • Notify Flash about the state (news) • Flash changes it’s state Saturday, December 12, 2009
  30. 30. Navigation • Send request for a page (about_us) • Flash notifies SWFAddress (Flash > JS) • SWFAddress state changed (example.com/#/about_us) • Ajax request to the server (Ajax) • Content elements received (JSON) • Put content to the right place Saturday, December 12, 2009
  31. 31. Dynamic elements • Ajax request • Content • CSS • JavaScript (evaluation) • AjaxLoad Saturday, December 12, 2009
  32. 32. Saturday, December 12, 2009
  33. 33. PHP Saturday, December 12, 2009
  34. 34. JavaScript Saturday, December 12, 2009
  35. 35. Graceful degradation • Browsers without FlashPlayer / JS • Deprecated FlashPlayer version • SWFAddress (SWFObject) Saturday, December 12, 2009
  36. 36. Saturday, December 12, 2009
  37. 37. Communication Saturday, December 12, 2009
  38. 38. Flash <> Client return call Flash HTML call return Saturday, December 12, 2009
  39. 39. ActionScript JavaScript Saturday, December 12, 2009
  40. 40. Flash <> Server 01000100010 00100101010 11010100 $nid = 1; $a = [... 11010111010 AMFPHP gateway Client SERVER 01000100010 00100101010 11010100 $node = {“title”: ... 11010111010 Saturday, December 12, 2009
  41. 41. ActionScript Saturday, December 12, 2009
  42. 42. Numbers • Event sold out: 35.000 tickets! • 42.000 unique visitors in 2 days • 65.000 visits in 2 days • > 420.000 unique visitors • > 580.000 visits • > 8.000.000 page views Saturday, December 12, 2009

×