How to Create Hbbtv Apps Without Programming One Line of Code

How to create HbbTV Apps without programming one line of code

HbbTV Symposium 2017

Simona Tonoli | Mediaset Miggi Zwicklbauer | Fraunhofer FOKUS 18.10.2017 AGENDA

1. What is MPAT ? 2. What benefits for a Broadcaster: Mediaset experience 3. Mediaset current Pilot Apps & Outcome

1. How to create HbbTV Apps 2. The MPAT - Editor 3. Outcome

2 What is MPAT (Multi-Platform Application Toolkit)

MPAT is an open-source authoring tool for the easy creation of HbbTV interactive apps

Key valuable features for a media company: • It’s an evolution of WordPress and supports multiple customizations • It is already provided with a set of plug-ins, components and customizable themes • It includes all necessary features to create innovative multiscreen experiences on HbbTV or any HTML5 device • It’s ready to be integrated with most CMS used in the broadcasting sector

The project MPAT is funded by the European Union Horizon 2020 Programme under grand agreement 687921 Duration: December 2015 – December 2017

3 5 irresistible benefits on the broadcaster side… X XX ..apps can be changed No more months of and published through the 3 canvass and click of a mouse after a bugfixing... visualizing a preview … but a userfriendly cms 1 No more code.. with drag&drop features X But a massive serial 4 Not a few apps … production… easily X updatable … a few editorial can do No more huge teams of 2 developers… the job X …the tool AS IS is partially 5 Not huge investment financed and already includes most important 4 features MPAT basic Navigation Models MPAT currently supports three navigation models and RTI was able to pilot all of them

Classical Navigation Event-based Navigation Slideflow Navigation The Slideflow navigation model allows the The classical navigation model matches the Event-based navigation allows the presentation content creator to design full-screen application most common model currently used for of HbbTV content to be driven by the broadcast pages, and specify the order in which they are navigation on HbbTV portal pages programme presented

Brand Minisite Ad insertion Content Promotion

5 MPAT basic Navigation Models MPAT currently supports three navigation models and RTI was able to pilot all of them

Classical Navigation Event-based Navigation The classical navigation model matches the Event-based navigation allows the presentation Launchbar Navigation most common model currently used for of HbbTV content to be driven by the broadcast navigation on HbbTV portal pages programme

Brand Minisite Breaking News

6 Apps currently included in MPAT Pilot FIAT 500

• FIRST example of Hbbtv app to go live public in Italy • It was presented at HD Forum Italia Conference – october 2016 • FIAT 500 app was live on air on Canale La5 • Initial trigger was set to channel switch

7 Event-based Apps currently included in MPAT Live Pilot TGCOM24

Since April 2017 TG COM app is able to offer the same news published on the news web portal and updtated real time, Viewers can read the full-text news derived from the portal web feeds. No extra news workflow validation is needed

Website 8 Apps currently included in MPAT Live Pilot TGCOM24 – Breaking News

News alert with landing on dedicated minisite and call to action to get connected to live News Channel 51

Event-based 9 Apps currently included in MPAT Live Pilot TGCOM24 – Breaking News

Event-based 10 Apps currently included in MPAT Live Pilot METEO.IT

Since April 2017 l’app app is able to offer the same news published on the news web portal and updated real- time

Website 11 Apps currently included in MPAT Live Pilot SPORT MEDIASET

Since April 2017 l’app app is able to offer the same news published on the news web portal and updated real- time

Website 12 Apps currently included in MPAT local playout Pilot Launchbar

13 Apps currently included in MPAT local playout Pilot INFINITY

INFINITY apps offers promotional content and access to trailers with a carousel of most cool titles available

Slideflow 14 Apps currently included in MPAT local playout Pilot FIAT SPIDER

Website 15 Apps currently included in MPAT local playout Pilot WILD

App WILD created entirely by “test users” during phase I of the project to demo how userfriendly is the tool

16 Apps currently included in MPAT local playout Pilot NON E’ LA RAI

App WILD created entirely by “test users” during phase I of the project to demo how userfriendly is the tool

17 How to Create HbbTV Apps Traditional way to develop HbbTV Apps

Change request Bug report

Idea Concept Design Developing Testing

Change request Change request

19 Traditional way to develop HbbTV Apps

©shareicon.net – Timer & Money 20 Traditional way to develop HbbTV Apps

Change request Bug report

Idea Concept Design Developing Testing

Change request Change request

21 Testing HbbTV Apps be like ...

Change request Bug report

Idea Concept Design Developing Testing

Change request Change request

23 How you can save time and money by the development of HbbTV Apps?

Use the Multi-Platform Application Toolkit!

• fast and easy creation of HbbTV applications • HbbTV 1.0 & HbbTV 1.5 • Coming soon: HbbTV 2.0 • Create Apps without any technological knowledge • Runs in every modern browser • Tested and approved on several SmartTVs • OPEN SOURCE – https://github.com/MPAT-eu

25 Multi-Platform Application Toolkit

• Run HbbTV Apps together with your existing (WordPress hosted) websites • Use same content, media library, user accounts, site features, etc… • MPAT includes (HbbTV specific) a template, components, and plugins such as – Images, Videos, Broadcast, Galleries, Text – Menus, Launcher & Navigation Models – Social Media – companion screen support – 360° video playback

26 Traditional way to develop HbbTV Apps With MPAT you don’t need to develop or test anymore...

Change request Bug report

Idea Concept Design Developing Testing

Change request Change request

27 Multi-Platform Application Toolkit

… just create your content with the editor ● Build Page Layouts ● Generate Pages ● Fill them with MPAT components

Idea Concept Design Create App App

Change request

28 The MPAT - Editor 1. Choose a Navigation Model

30 2. Create a Page Layout

31 3. Fill the Layout with MPAT Components

32 4. ENJOY

36 MPAT Workshop MPAT - Workshop

@IRT (Munich, GERMANY) 5th December 2017 more information at

mpat.eu

38 Thank you!

Simona Tonoli Miggi Zwicklbauer +39 (0)02 / 25148510 +49 (0)30 / 3463 - 7316

[email protected] [email protected]