Christine Gerpheide Iraklis Karvasonis – May 2010

1. Christine Gerpheide Iraklis Karvasonis – May 2010 Achieving Advanced Web Presence with TYPO3 05.22.10

2. Agenda • Introduction • Who we are • Why TYPO3 • The CML Distribution • Case Studies • Museum of Science and Industry Chicago • Wyeth Insight Reports Series • customedialabs • eCampaign • CML 10th Anniversary • Conclusion

3. Who are we?

4. Who are we? • customedialabs Interactive Media Agency (CML) • Full service interactive agency • Specializing in advanced web presence • US and Greece • Servicing global enterprise level clients • 10 years using TYPO3 for websites and microsites (remember TYPO3 v3.5?)

5. Our objective • How to use TYPO3 to achieve enterprise level web sites • Our audience today: Business people, marketers, and developers • …but feel free to ask technical questions 

6. What is AWP?

7. AWP • Advanced Web Presence • Optimizing your virtual visibility and effectiveness on the web • SEO • Analytics and Metrics • Rich media • Interactivity • Scalability • Site design and content

8. Why TYPO3

9. Why TYPO3? • TYPO3 is one of the most extensible and customizable open-source CMSs available • Comprehensive extension development framework • Straightforward integration with various architectures • Sophisticated BE record management • Enterprise features • Workspaces and versioning • Multilingual support • Caching framework • FE Editing • Strong pipeline

10. Why TYPO3? • Our distribution • CML Skin • CML Utilities package • DAM, email functions • Template rendering helpers • Page browsing • Custom analytics tracking • Logging • Ajax (extbase)

11. Why TYPO3?

12. Case Studies: Museum of Science and Industry Chicago

13. MSI: Background • Provides interactive, online museum experience • View exhibits, make reservations, plan itineraries, purchase tickets, purchase membership, online scrapbooking… • Many parties involved • Museum departments (reservations, membership, ticketing…) • 3rd party developing web services • Infrastructure • Failover servers, rsync replication • Galaxy, Raiser’s Edge, Windows SBS • SOAP XML requests • MVC with service architecture (for extensibility)

14. MSI: Record management • Custom extensions for MSI: • MSI Exhibits, Activities, Calendar, Map, Media Viewer, Polls, Plan Your Visit, Topic Based Search • Constants extension • Store values used throughout MSI extensions (hours, age ranges, etc) • Rich media content management • Carousels, slideshows Flash modules easily updated in TYPO3 producing XML output • DAM methods provided by CML Utils

15. MSI: My Scipass Album • Online scrapbooking • Authenticated website users access media assets (images, videos, text) created during a museum visit • Social network sharing • All assets are imported into online albums through web services • BE management of assets by museum editors • => TYPO3 used to integrate with museum infrastructure and extend scrapbooking functionality

16. MSI: My Scipass Album

17. MSI: Plan your visit • Users create an itinerary with a rich, ajax-driven user interface • Events, exhibits, museum hours, interest topics managed in BE • All itinerary data stored with web services • Recommendation engine run with web services

18. MSI: Plan your visit

19. MSI: User-targeted messaging • Customized messages shown to each user when logging in • Message templates defined in BE (site editor selects 1 of 7 message types with required parameters) • => Dynamic messaging, but easily editable by regular site editors

20. MSI: User-targeted messaging Date ranges Account interests User info Asset updates Scipass Album content

21. MSI: Summary • Multiple backends simultaneously (TYPO3, web services) • Integration between different extensions (old and new) • Rich user interfaces • Enterprise BE record management

22. Case Studies: Wyeth Insight Reports Series Website

23. Wyeth Insight Reports Series • Registered users can browse reports • Rich flash interface • Manage and download report assets and manage account • Actions through MVC extension • Assets defined in an XML Singleton object • => freedom of architecture

24. Case Studies: customedialabs

25. customedialabs: Background • Full Flash website • Content management • Content edited in TYPO3 • TYPO3 outputs content in XML • Flash read content from XML • Extensions used: • News with RSS Feeds • mailformplus • ePortfolio • Near future • Mobile site

26. Case Studies: eCampaign

27. eCampaign: Marketing System • Email and SMS marketing system (similar to direct_mail, but in FE) • Creating and sending campaigns • Managing subscriber lists • Managing analytics profiles • Viewing reports

28. eCampaign: Marketing System

29. eCampaign: Marketing System • Interfaces with both EM and SMS gateways, and analytics tools • Currently mailchimp and google analytics • EM gateway given URL to page • Created using TYPO3’s new framework, Extbase/ExtMVC

30. eCampaign: Marketing System BE Implementation • Agnostic architecture thanks to Services • Uses gateways and TYPO3 DB as backend • Highly extensible, modular • EM • SMS • Analatyics integration • Workspaces • Advanced reports

31. eCampaign: Marketing System Technical Details • Core edits to allow FE editing only on campaign pages • Templavoila table to signal an email template and client • Adding analytics events • Hook to alter link selector popup • Hook in content processing to convert all links www.myLandingPage.com/cid/54/event/logo • ..And cache remotely

32. eCampaign: Marketing System Templates defined as “email templates” FE Editing (hook to add GA events)

33. eCampaign: Metrics Framework • Communicates with Marketing System to create cached pages with Analatyics tracking for your campaign • Converts “cid” and “event” values to analytics code www.myLandingPage.com/cid/54/event/logo

34. Case Studies: CML 10th Anniversary

35. CML 10th Anniversary • Multi-platform site (Rich web app and mobile) • Powered by multiple custom TYPO3 extensions (extbase) • Extensions output XML and HTML5 • => easily accommodates different media/templates with same content

36. In conclusion…

37. Conclusion • TYPO3 can be used to realize advanced web presence in the face of any business and technical needs • Integration with existing infrastructure • Advanced platform and design requirements (Flash, HTML5) • Extendable architecture (elegant extension framework) • Enterprise user and workflow management

38. Contact Us W: www.customedialabs.com E: info@customedialabs.com Twitter: customedialabs 05.22.10

39. eCampaign: Marketing System • Email and SMS marketing system (similar to direct_mail, but in FE) • Creating and sending campaigns • Managing subscriber lists • Managing analytics profiles • Viewing reports • Created using TYPO3’s new framework, Extbase/ExtMVC

40. eCampaign: Marketing System • Agnostic architecture to accommodate multiple gateways as well as multiple analytics tools, depending on Client • Currently using Mailchimp and Google Analytics • Interchangeable backends • Extensible (agile) • Utilizes modified versions of TYPO3’s FE Editing, user accounts, templates