Philipp Bärfuss, Head of Product Development at Magnolia, presents the tools and technologies available in Magnolia 5 for building an integrated content management hub encompassing all digital channels.

1. Magnolia is a registered trademark owned by Magnolia International Ltd.Version 1.0
Philipp Bärfuss, Head of Product Development 11.07.2013 at Webinar
Magnolia 5 - Zoology
Why Magnolia 5 Rocks for IT
1
http://www.flickr.com/photos/chanycrystal/

2. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
The Zookeeper
2
Philipp Bärfuss
36 years, Swiss
8 years at Magnolia
Head of Product Development

3. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Demo: 3 Minutes of Magnolia 5
3

4. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Assistant: The Geek
4
Now it gets geeky
Coding examples
Very technical
Don’t panic! We get back to
normal

5. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Assistant: The Fairy
Future
Ideas
Features
Wishes
Things you could do
5

6. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
The Zoology - Aspects of M5
6
Ants
ElephantFlamingo

7. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
The Elephant
good memory
strong
working animal
7

8. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Text
The Ants
Collective intelligence
Complexity with simplicity
Basic signal -> big impact
8

9. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
The Flamingo
elegant and beautiful
perfect tools and technics
strong flyer
reliable
found around the world
9

10. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
The Zoology - Aspects of M5
10
Collaboration
WCMUX

11. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
The Zoology - Aspects of M5
10
Collaboration
WCMUX
Publishing
Templates
Content
Apps
DAM

12. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
The Zoology - Aspects of M5
10
Collaboration
WCMUX
Publishing
Templates
Content
Apps
WorkflowThe Pulse
DAM

13. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
The Zoology - Aspects of M5
10
Collaboration
WCMUX
Apps
Forms
Publishing
Templates
Content
Apps
WorkflowThe Pulse
DAM
Favorites

14. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Online Digital Channel Management
11
Collaboration
WCMUX

15. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Online Digital Channel Management
11
Collaboration
WCMUX
Digital Channels (IN)

16. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Online Digital Channel Management
11
Collaboration
WCMUX
Digital Channels (OUT)
Digital Channels (IN)

17. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Online Digital Channel Management
11
Collaboration
WCMUX
eCommerce CRM
Digital Channels (OUT)
Digital Channels (IN)

18. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Digital Channel Management
12
In
• Authors
• Flickr
• Mobile
• ...
Out
• Devices: Mobile, Print, ..
• Medium: eMail, Web, PDF
• Twitter, Facebook, ...
Integration
• Analytics, CRM, Shop

19. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
CMS
13
WCM
Publishing
Templates
Content
Apps
DAM

20. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Content Apps
14

21. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Content App - Browser
15

22. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Content App - Detail / Editor
16

23. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Just configure it
17
node types
• icons
tree, list, columns
forms
• to edit the content
actions

24. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Extend Contacts App
add a field to the contacts form
add a column to the tree
18

25. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Digital Asset Management
19

26. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
DAM - API
20
Providers
• to access other sources
Renditions
• thumbnails, sizes, formats
Metadata
• Dublin Core

27. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Image Cropping
21
independent media file editor

28. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Integration - Blossom (Spring)
22

29. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
CMS
Content Pools
• Article, News, Events
DAM
• Video
• Originals
• Flickr, ...
Integrations
• eCommerce
• Database
Publishing
• Twitter, Facebook
Personalization
• Persona
• A/B Testing
23

30. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Text
Collaboration & Processes
24
Collaboration
WorkflowThe Pulse

31. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Text
The Pulse - Collaboration
25
The Pulse

32. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Text
The Pulse - Collaboration
25
The Pulse
App

33. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Text
The Pulse - Collaboration
25
The Pulse
Workflow
App

34. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Text
The Pulse - Collaboration
25
The Pulse
Workflow
Import
App

35. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Text
The Pulse - Collaboration
25
The Pulse
Workflow
eMail
Import
App

36. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Text
The Pulse - Collaboration
25
The Pulse
Workflow
eMail
Import
App
App

37. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Text
Demo - Send a Message
26

38. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Text
Message View
27
define screen per message
• what info to show
define actions
• proceed workflow
• jump into an app

39. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Collaboration Example
Pages
• click on “Request Translation”
Pulse
• translator group gets a message
28

40. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Text
Workflow Engine - JBPM
29
Well known
Visual Tools available
• Eclipse workflow editor
Execute Commands
• activation, versioning, ...
Define Message Screen for Human Tasks

41. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Collaboration & Processes
Build your processes
• Notifications
• Watch List
Task oriented apps
• Task oriented apps
(review, ..)
Notification channels
• eMail
• RSS
• SMS
Group work items
• Assignee
• Status
Workflow designer
• for basic steps
30

42. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
UX Framework
31
UX
Apps
Forms
Favorites

43. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
AdminCentral
Vaadin (GWT)
Vaadin
UI Model
Web Services
(CMIS)
Content
Model
CMIS
App
REST/AtomHTTP
JCR
JCR
App
Rendering Engine
Web Browser
Web pages,
Images, ..
Templates
Security
Node
Types
Mixins......
AJAX/JSON
32
Overview

44. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Technology Stack
33

45. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.34
Vaadin

46. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.35
Vaadin
• Rich widget framework
• Out-of-the-box theming
• Java developer friendly
• Close to Swing
• GWT based (Java -> Javascript)
• Can integrate any GWT-components
• Rare GWT-compiles (compared to plain GWT)
• Testing with pure JUnit
• Apache License
• Well documented

47. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
API - Layers
36
Magnolia Core
Widgets (Form,Workbench)
UI Framework (Impl)
AdminCentral
Vaadin
UI API (App, Context, Location)

48. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Packages - AdminCentral
37
UI Framework - Apps, Locations, Messages,Actions

49. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Packages - AdminCentral
37
AdminCentral
& Shell Apps
UI Framework - Apps, Locations, Messages,Actions

50. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Packages - AdminCentral
37
AdminCentral
& Shell Apps
App App
UI Framework - Apps, Locations, Messages,Actions

51. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Packages - AdminCentral
37
Content App
AdminCentral
& Shell Apps
App App
UI Framework - Apps, Locations, Messages,Actions

52. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Packages - AdminCentral
37
Content App
AdminCentral
& Shell Apps
App App
App App
UI Framework - Apps, Locations, Messages,Actions

53. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Apps
is a AdminCentral extension
task oriented
• authoring
• reviewing
use Vaadin for the views
• easy Swing like coding/debugging
use Magnolia/Java for the presenters
sub apps
• shown in tabs
38

54. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
App API - UML
39

55. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Timezone App
40
Extend the base app
Use Vaadin to build the UI
Open a sub app tab

56. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Favorites
41

57. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Location, Location, Location
42
URL Anchor
• #app:<appName>:<subAppId>:<parameter>
In App navigation
• main, app, subapp
Bookmarks
• save URL, send them to other users, ...
History
• back and forward buttons

58. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Collaboration Example
Task
• translator jumps to the page to translate
43

59. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Definition to UI
44
FormDefinition Factory

60. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Notifications
45
App Context
• Alerts
• Confirmation
Messages to the Pulse
• Info
• Warning
• Error

61. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
IoC
46
All UI components can be replaced
• Apps, Sub-apps
• View and Presenters
Get the Objects you nee
• Definitions
• App Context
Apps are configurable
• extend apps, sub-apps
• add actions

62. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Actions and Commands
47

63. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Actions
48
The UI event handling
Open Dialog
Call Command
Show message to user
Change location

64. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Commands
49
Backend executable
No UI
Invoked by
• UI
• WebServices
• Workflow

65. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Action Bar
50
Configured
• Customize the App
• Add Actions by Module
Independent
• Content Apps
• Page Editor
• Messages
Preview
Sensitive
• Content type

66. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Collaboration Example
Add an Action
• new action in the Pages app
• Code sample
51

67. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Form, Fields and Tabs
52
Configured
• no coding needed
Independent
• used in Apps
• used in Dialogs
Data binding
• Items not Nodes

68. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Form in an App
53

69. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Form in a Dialog
54

70. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Validation, Errors and Warnings
55

71. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
UX
Internationalization
• RTL
Mobile
• Smartphone UI
Configuration
• Form Editor
Dialogs
• Wizards
Widgets
• Graphs
Rich Text Editors
• Plugins
56

72. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Magnolia is more than a Zoo
57

73. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Magnolia is more than a Zoo
WCM Features
• Pages, Dam, Content Apps
• Spring (Blossom)
57

74. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Magnolia is more than a Zoo
WCM Features
• Pages, Dam, Content Apps
• Spring (Blossom)
Collaboration Features
• The Pulse, Workflow
57

75. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Magnolia is more than a Zoo
WCM Features
• Pages, Dam, Content Apps
• Spring (Blossom)
Collaboration Features
• The Pulse, Workflow
UI Framework
• Apps, Favorites, Locations
• Forms, Actions, Widgets
• Vaadin based
57

76. Version 1.0 Magnolia is a registered trademark owned by Magnolia International Ltd.
Timeline
58
5.25.1EE5.0
Platform Smooth UX
CompletenessBasis
Features
15. NovConferenceAug

77. Magnolia is a registered trademark owned by Magnolia International Ltd.Version 1.0
Conference
MConf13-WEBINAR-20
20% discount / sign up now: www.magnolia-cms.com/conference
59

78. Magnolia is a registered trademark owned by Magnolia International Ltd.Version 1.0
Questions & some Answers
60