SlideShare a Scribd company logo
Jan Pilarzeck, trio-group
Using Drupal as a Content Hub to create an interactive,
visual product exploration application.
Of course, decoupled with vueJS ;-)
330.10.2019
DrupalCon 2019, Amsterdam
Jan Pilarzeck
Managing Partner at trio-group
Entrepreneur, Tech Consultant, Architect, Speaker
Married, 2 kids
Heidelberg / Mannheim
#Espresso #MTB #Italy
j.pilarzeck@trio-group.de
+49 621 / 33840 999
www.linkedin.com/in/jan-pilarzeck
www.xing.com/profile/Jan_Pilarzeck
Drupal is eating Typo3 and Sitecore for breakfast.
Sharing a successful pitch slide.
Selected CMS market share, Top 10k Websites worldwide
Source: builtwith.com
DrupalCon 2019, Amsterdam
Typo3 Sitecore Drupal
WIIFY?
A story about using decoupled
Drupal without all the pain…and
making a client happy.
Client’s challenges, our task
10/30/2019 6
• Hidden & complex products
• Contents in different sources: Drupal, SAP
Hybris/PIM
• Multiple marketing channels: web, trade
fairs, sales reps
Our claim
Create a world out of glass.
Available everywhere.
Ready for every day's changes.
10/30/2019 7
Interactive market graphics
10/30/2019 8
930.10.2019
DrupalCon 2019, Amsterdam
1030.10.2019
DrupalCon 2019, Amsterdam
1130.10.2019
DrupalCon 2019, Amsterdam
1230.10.2019
DrupalCon 2019, Amsterdam
Single source of truth: Drupal content hub
1330.10.2019
DrupalCon 2019, Amsterdam
Products from
SAP Hybris / PIM
Trade fairs & events
Offline
Sales app
Tablets & Desktop
DrupalCon 2019, Amsterdam
Corporate
Website
Content Hub
SAP Hybris
Commerce
Portal
Translation
management
Market
Graphics App
…what are those „market graphics“?
1630.10.2019
• Drupal 8 corporate website used as content hub and backend
• Market graphics is a separated decoupled web app
• vueJS as frontend JS framework
• No separate backend, just API-calls to Drupal
• Just a single file, served by a static assets server
DrupalCon 2019, Amsterdam
Offline usage
1730.10.2019
• Used for desktops and tablets
• Electron is used to create desktop versions
• Application is auto-detecting its context
• NodeJS-Crawler fetches data from Drupal and
stores them in local storage
DrupalCon 2019, Amsterdam
Editor backend
1830.10.2019
• Separate content type, aggregating all existing contents
• Translations managed by TMGMT, connected with Across, half-
automated
DrupalCon 2019, Amsterdam
Sections & individual content
1930.10.2019
• Paragraphs / nested
• Individual content is plain text
DrupalCon 2019, Amsterdam
Touchpoint management
2030.10.2019
• Drag&Drop
• Nested touchpoints!
DrupalCon 2019, Amsterdam
SAP Hybris products & content nodes
2130.10.2019
• SAP Hybris products are native Drupal contents
• autocomplete entity references for products and
drupal
• One-click-done
DrupalCon 2019, Amsterdam
Outcome for our client
2230.10.2019
Autonomy & cost savings
• No need for developer to create new scenes,
100% management in Drupal
• they just need a new 3D-rendering to update
their website, booth and sales team
Speed
• Faster time-to-market
• Website, sales app and trade fairs updated with
one click
Convenience
• One single easy-to-use interface
• Automated & integrated translation
management
DrupalCon 2019, Amsterdam
…decoupled
without pain?
30.10.2019 23
Join us for
contribution opportunities
Thursday, October 31, 2019
9:00-18:00
Room: Europe Foyer 2
Mentored
Contribution
First Time
Contributor Workshop
General
Contribution
#DrupalContributions
9:00-14:00
Room: Diamond Lounge
9:00-18:00
Room: Europe Foyer 2
What did you think?
Locate this session at the DrupalCon Amsterdam website:
https://drupal.kuoni-congress.info/2019/program/
Take the Survey!
https://www.surveymonkey.com/r/DrupalConAmsterdam

More Related Content

Similar to Using Drupal as a Content Hub to create an interactive, visual product exploration application.

SUTOL 2015 - Challenge accepted: IBM Cloud onboarding & Upgrades to IBM Notes...
SUTOL 2015 - Challenge accepted: IBM Cloud onboarding & Upgrades to IBM Notes...SUTOL 2015 - Challenge accepted: IBM Cloud onboarding & Upgrades to IBM Notes...
SUTOL 2015 - Challenge accepted: IBM Cloud onboarding & Upgrades to IBM Notes...
Christoph Adler
 
April Partner Bootcamp 2022
April Partner Bootcamp 2022April Partner Bootcamp 2022
April Partner Bootcamp 2022
Acquia
 
SA102 - Challenge accepted - IBM Cloud onboarding (MWLUG 2016)
SA102 - Challenge accepted - IBM Cloud onboarding (MWLUG 2016)SA102 - Challenge accepted - IBM Cloud onboarding (MWLUG 2016)
SA102 - Challenge accepted - IBM Cloud onboarding (MWLUG 2016)
Daniel Reimann
 
Introduction To Drupal And The Future of Drupal
Introduction To Drupal And The Future of DrupalIntroduction To Drupal And The Future of Drupal
Introduction To Drupal And The Future of Drupal
Anthony Ogbonna
 
Audi‘s Hadoop Journey into the Hybrid Cloud
Audi‘s Hadoop Journey into the Hybrid CloudAudi‘s Hadoop Journey into the Hybrid Cloud
Audi‘s Hadoop Journey into the Hybrid Cloud
DataWorks Summit
 
Adobe DPS, what's next? How to migrate from an existing digital publishing pl...
Adobe DPS, what's next? How to migrate from an existing digital publishing pl...Adobe DPS, what's next? How to migrate from an existing digital publishing pl...
Adobe DPS, what's next? How to migrate from an existing digital publishing pl...
Rakuten Aquafadas
 
Drupal%2 c mobility and m2serve
Drupal%2 c mobility and m2serveDrupal%2 c mobility and m2serve
Drupal%2 c mobility and m2serve
littleMAS
 
IBM s'associe au SmartHome Challenge
IBM s'associe au SmartHome ChallengeIBM s'associe au SmartHome Challenge
IBM s'associe au SmartHome Challenge
IBM France
 
Using Cloud Hyperscale Vendors Cognitive Artificial Intelligence NoOps MLaaS
Using Cloud Hyperscale Vendors Cognitive Artificial Intelligence NoOps MLaaSUsing Cloud Hyperscale Vendors Cognitive Artificial Intelligence NoOps MLaaS
Using Cloud Hyperscale Vendors Cognitive Artificial Intelligence NoOps MLaaS
Björn Rodén
 
Inteligencia artificial, open source e IBM Call for Code
Inteligencia artificial, open source e IBM Call for CodeInteligencia artificial, open source e IBM Call for Code
Inteligencia artificial, open source e IBM Call for Code
Luciano Resende
 
RapidScale CloudOffice
RapidScale CloudOfficeRapidScale CloudOffice
RapidScale CloudOffice
RapidScale
 
Capitalizing on cloud 4.3.18
Capitalizing on cloud 4.3.18Capitalizing on cloud 4.3.18
Capitalizing on cloud 4.3.18
Yves Bienenfeld
 
04 blue mixintro
04 blue mixintro04 blue mixintro
Superfast Business: Getting the most out of iPads
Superfast Business: Getting the most out of iPadsSuperfast Business: Getting the most out of iPads
Superfast Business: Getting the most out of iPads
Superfast Business
 
JHipster & blueprint 02-07-2019 - casablanca jug
JHipster & blueprint 02-07-2019 - casablanca jugJHipster & blueprint 02-07-2019 - casablanca jug
JHipster & blueprint 02-07-2019 - casablanca jug
Anthony Viard
 
Fifth Edition Architecture Week @Gothenburg 141009
Fifth Edition Architecture Week @Gothenburg 141009Fifth Edition Architecture Week @Gothenburg 141009
Fifth Edition Architecture Week @Gothenburg 141009
Capgemini
 
Html5 viewer HTML5 office kukudocs
Html5 viewer HTML5 office kukudocsHtml5 viewer HTML5 office kukudocs
Html5 viewer HTML5 office kukudocs
kukudocs
 
IV Evento GeneXus Italia - Il Cloud IBM: motore di crescita per il business
IV Evento GeneXus Italia - Il Cloud IBM: motore di crescita per il businessIV Evento GeneXus Italia - Il Cloud IBM: motore di crescita per il business
IV Evento GeneXus Italia - Il Cloud IBM: motore di crescita per il business
Rad Solutions
 
Prodyna exhibiting in London Tech Job Fair Spring 2019
Prodyna exhibiting in London Tech Job Fair Spring 2019Prodyna exhibiting in London Tech Job Fair Spring 2019
Prodyna exhibiting in London Tech Job Fair Spring 2019
TechMeetups
 
Creating Microservices Application with IBM Cloud Private (ICP) - introductio...
Creating Microservices Application with IBM Cloud Private (ICP) - introductio...Creating Microservices Application with IBM Cloud Private (ICP) - introductio...
Creating Microservices Application with IBM Cloud Private (ICP) - introductio...
PT Datacomm Diangraha
 

Similar to Using Drupal as a Content Hub to create an interactive, visual product exploration application. (20)

SUTOL 2015 - Challenge accepted: IBM Cloud onboarding & Upgrades to IBM Notes...
SUTOL 2015 - Challenge accepted: IBM Cloud onboarding & Upgrades to IBM Notes...SUTOL 2015 - Challenge accepted: IBM Cloud onboarding & Upgrades to IBM Notes...
SUTOL 2015 - Challenge accepted: IBM Cloud onboarding & Upgrades to IBM Notes...
 
April Partner Bootcamp 2022
April Partner Bootcamp 2022April Partner Bootcamp 2022
April Partner Bootcamp 2022
 
SA102 - Challenge accepted - IBM Cloud onboarding (MWLUG 2016)
SA102 - Challenge accepted - IBM Cloud onboarding (MWLUG 2016)SA102 - Challenge accepted - IBM Cloud onboarding (MWLUG 2016)
SA102 - Challenge accepted - IBM Cloud onboarding (MWLUG 2016)
 
Introduction To Drupal And The Future of Drupal
Introduction To Drupal And The Future of DrupalIntroduction To Drupal And The Future of Drupal
Introduction To Drupal And The Future of Drupal
 
Audi‘s Hadoop Journey into the Hybrid Cloud
Audi‘s Hadoop Journey into the Hybrid CloudAudi‘s Hadoop Journey into the Hybrid Cloud
Audi‘s Hadoop Journey into the Hybrid Cloud
 
Adobe DPS, what's next? How to migrate from an existing digital publishing pl...
Adobe DPS, what's next? How to migrate from an existing digital publishing pl...Adobe DPS, what's next? How to migrate from an existing digital publishing pl...
Adobe DPS, what's next? How to migrate from an existing digital publishing pl...
 
Drupal%2 c mobility and m2serve
Drupal%2 c mobility and m2serveDrupal%2 c mobility and m2serve
Drupal%2 c mobility and m2serve
 
IBM s'associe au SmartHome Challenge
IBM s'associe au SmartHome ChallengeIBM s'associe au SmartHome Challenge
IBM s'associe au SmartHome Challenge
 
Using Cloud Hyperscale Vendors Cognitive Artificial Intelligence NoOps MLaaS
Using Cloud Hyperscale Vendors Cognitive Artificial Intelligence NoOps MLaaSUsing Cloud Hyperscale Vendors Cognitive Artificial Intelligence NoOps MLaaS
Using Cloud Hyperscale Vendors Cognitive Artificial Intelligence NoOps MLaaS
 
Inteligencia artificial, open source e IBM Call for Code
Inteligencia artificial, open source e IBM Call for CodeInteligencia artificial, open source e IBM Call for Code
Inteligencia artificial, open source e IBM Call for Code
 
RapidScale CloudOffice
RapidScale CloudOfficeRapidScale CloudOffice
RapidScale CloudOffice
 
Capitalizing on cloud 4.3.18
Capitalizing on cloud 4.3.18Capitalizing on cloud 4.3.18
Capitalizing on cloud 4.3.18
 
04 blue mixintro
04 blue mixintro04 blue mixintro
04 blue mixintro
 
Superfast Business: Getting the most out of iPads
Superfast Business: Getting the most out of iPadsSuperfast Business: Getting the most out of iPads
Superfast Business: Getting the most out of iPads
 
JHipster & blueprint 02-07-2019 - casablanca jug
JHipster & blueprint 02-07-2019 - casablanca jugJHipster & blueprint 02-07-2019 - casablanca jug
JHipster & blueprint 02-07-2019 - casablanca jug
 
Fifth Edition Architecture Week @Gothenburg 141009
Fifth Edition Architecture Week @Gothenburg 141009Fifth Edition Architecture Week @Gothenburg 141009
Fifth Edition Architecture Week @Gothenburg 141009
 
Html5 viewer HTML5 office kukudocs
Html5 viewer HTML5 office kukudocsHtml5 viewer HTML5 office kukudocs
Html5 viewer HTML5 office kukudocs
 
IV Evento GeneXus Italia - Il Cloud IBM: motore di crescita per il business
IV Evento GeneXus Italia - Il Cloud IBM: motore di crescita per il businessIV Evento GeneXus Italia - Il Cloud IBM: motore di crescita per il business
IV Evento GeneXus Italia - Il Cloud IBM: motore di crescita per il business
 
Prodyna exhibiting in London Tech Job Fair Spring 2019
Prodyna exhibiting in London Tech Job Fair Spring 2019Prodyna exhibiting in London Tech Job Fair Spring 2019
Prodyna exhibiting in London Tech Job Fair Spring 2019
 
Creating Microservices Application with IBM Cloud Private (ICP) - introductio...
Creating Microservices Application with IBM Cloud Private (ICP) - introductio...Creating Microservices Application with IBM Cloud Private (ICP) - introductio...
Creating Microservices Application with IBM Cloud Private (ICP) - introductio...
 

Recently uploaded

2024 case study-SHEIN Analysis-Final.pdf
2024 case study-SHEIN Analysis-Final.pdf2024 case study-SHEIN Analysis-Final.pdf
2024 case study-SHEIN Analysis-Final.pdf
Sun.Lee
 
一比一原版哥伦比亚大学毕业证(Columbia毕业证书)学历如何办理
一比一原版哥伦比亚大学毕业证(Columbia毕业证书)学历如何办理一比一原版哥伦比亚大学毕业证(Columbia毕业证书)学历如何办理
一比一原版哥伦比亚大学毕业证(Columbia毕业证书)学历如何办理
omywaf
 
一比一原版(TMU毕业证)多伦多都会大学毕业证如何办理
一比一原版(TMU毕业证)多伦多都会大学毕业证如何办理一比一原版(TMU毕业证)多伦多都会大学毕业证如何办理
一比一原版(TMU毕业证)多伦多都会大学毕业证如何办理
oeveu
 
What Software is Used in Marketing in 2024.
What Software is Used in Marketing in 2024.What Software is Used in Marketing in 2024.
What Software is Used in Marketing in 2024.
Ishaaq6
 
From Subreddits To Search: Maximizing Your Brand's Impact On Reddit
From Subreddits To Search: Maximizing Your Brand's Impact On RedditFrom Subreddits To Search: Maximizing Your Brand's Impact On Reddit
From Subreddits To Search: Maximizing Your Brand's Impact On Reddit
Search Engine Journal
 
THE STORY COMMUNICATION Credential 2024.pptx
THE STORY COMMUNICATION Credential 2024.pptxTHE STORY COMMUNICATION Credential 2024.pptx
THE STORY COMMUNICATION Credential 2024.pptx
huyenngo62
 
How to Start Affiliate Marketing with ChatGPT- A Step-by-Step Guide (1).pdf
How to Start Affiliate Marketing with ChatGPT- A Step-by-Step Guide (1).pdfHow to Start Affiliate Marketing with ChatGPT- A Step-by-Step Guide (1).pdf
How to Start Affiliate Marketing with ChatGPT- A Step-by-Step Guide (1).pdf
SimpleMoneyMaker
 
Lyrics Video Document for artist Kevin Aguirre
Lyrics Video Document for artist Kevin AguirreLyrics Video Document for artist Kevin Aguirre
Lyrics Video Document for artist Kevin Aguirre
rawlensproductionsco
 
在线办理(worc毕业证书)伍斯特大学毕业证成绩单一模一样
在线办理(worc毕业证书)伍斯特大学毕业证成绩单一模一样在线办理(worc毕业证书)伍斯特大学毕业证成绩单一模一样
在线办理(worc毕业证书)伍斯特大学毕业证成绩单一模一样
5ys5mvlp
 
SEO and Google Ads Fundamentals Gokce Yesilbas
SEO and Google Ads Fundamentals Gokce YesilbasSEO and Google Ads Fundamentals Gokce Yesilbas
SEO and Google Ads Fundamentals Gokce Yesilbas
gokceyesilbas
 
Viapulsa - Content Strategist Assignment
Viapulsa - Content Strategist AssignmentViapulsa - Content Strategist Assignment
Viapulsa - Content Strategist Assignment
Amal Agung Cahyadi
 
DTA Promotion - Marketing Specialist Assignment
DTA Promotion - Marketing Specialist AssignmentDTA Promotion - Marketing Specialist Assignment
DTA Promotion - Marketing Specialist Assignment
Amal Agung Cahyadi
 
INTRODUCTION TO SEARCH ENGINE OPTIMIZATION (SEO).pptx
INTRODUCTION TO SEARCH ENGINE OPTIMIZATION (SEO).pptxINTRODUCTION TO SEARCH ENGINE OPTIMIZATION (SEO).pptx
INTRODUCTION TO SEARCH ENGINE OPTIMIZATION (SEO).pptx
Giorgio Chiesa
 
Embark on style journeys Indian clothing store denver guide.pptx
Embark on style journeys Indian clothing store denver guide.pptxEmbark on style journeys Indian clothing store denver guide.pptx
Embark on style journeys Indian clothing store denver guide.pptx
Omnama Fashions
 
2025 Adventur ehomes Product Guide released Jun 1 2024
2025 Adventur ehomes Product Guide released Jun 1 20242025 Adventur ehomes Product Guide released Jun 1 2024
2025 Adventur ehomes Product Guide released Jun 1 2024
JimWilliams206540
 
Social Samosa's #30Under30 Guidebook.pdf
Social Samosa's #30Under30 Guidebook.pdfSocial Samosa's #30Under30 Guidebook.pdf
Social Samosa's #30Under30 Guidebook.pdf
Social Samosa
 
Title: Making Money the Easy Way: A Quick Guide to Generating Income
Title: Making Money the Easy Way: A Quick Guide to Generating IncomeTitle: Making Money the Easy Way: A Quick Guide to Generating Income
Title: Making Money the Easy Way: A Quick Guide to Generating Income
WilliamZinsmeister
 
Learn more about affiliate marketing as a beginner
Learn more about affiliate marketing as a beginnerLearn more about affiliate marketing as a beginner
Learn more about affiliate marketing as a beginner
MichaelGiles34
 
3 Best “Add to Calendar” Link Generator Tools (2024)
3 Best  “Add to Calendar”  Link Generator Tools (2024)3 Best  “Add to Calendar”  Link Generator Tools (2024)
3 Best “Add to Calendar” Link Generator Tools (2024)
Y
 
How to Maximize Sales Using Social Commerce
How to Maximize Sales Using Social CommerceHow to Maximize Sales Using Social Commerce
How to Maximize Sales Using Social Commerce
Vbout.com
 

Recently uploaded (20)

2024 case study-SHEIN Analysis-Final.pdf
2024 case study-SHEIN Analysis-Final.pdf2024 case study-SHEIN Analysis-Final.pdf
2024 case study-SHEIN Analysis-Final.pdf
 
一比一原版哥伦比亚大学毕业证(Columbia毕业证书)学历如何办理
一比一原版哥伦比亚大学毕业证(Columbia毕业证书)学历如何办理一比一原版哥伦比亚大学毕业证(Columbia毕业证书)学历如何办理
一比一原版哥伦比亚大学毕业证(Columbia毕业证书)学历如何办理
 
一比一原版(TMU毕业证)多伦多都会大学毕业证如何办理
一比一原版(TMU毕业证)多伦多都会大学毕业证如何办理一比一原版(TMU毕业证)多伦多都会大学毕业证如何办理
一比一原版(TMU毕业证)多伦多都会大学毕业证如何办理
 
What Software is Used in Marketing in 2024.
What Software is Used in Marketing in 2024.What Software is Used in Marketing in 2024.
What Software is Used in Marketing in 2024.
 
From Subreddits To Search: Maximizing Your Brand's Impact On Reddit
From Subreddits To Search: Maximizing Your Brand's Impact On RedditFrom Subreddits To Search: Maximizing Your Brand's Impact On Reddit
From Subreddits To Search: Maximizing Your Brand's Impact On Reddit
 
THE STORY COMMUNICATION Credential 2024.pptx
THE STORY COMMUNICATION Credential 2024.pptxTHE STORY COMMUNICATION Credential 2024.pptx
THE STORY COMMUNICATION Credential 2024.pptx
 
How to Start Affiliate Marketing with ChatGPT- A Step-by-Step Guide (1).pdf
How to Start Affiliate Marketing with ChatGPT- A Step-by-Step Guide (1).pdfHow to Start Affiliate Marketing with ChatGPT- A Step-by-Step Guide (1).pdf
How to Start Affiliate Marketing with ChatGPT- A Step-by-Step Guide (1).pdf
 
Lyrics Video Document for artist Kevin Aguirre
Lyrics Video Document for artist Kevin AguirreLyrics Video Document for artist Kevin Aguirre
Lyrics Video Document for artist Kevin Aguirre
 
在线办理(worc毕业证书)伍斯特大学毕业证成绩单一模一样
在线办理(worc毕业证书)伍斯特大学毕业证成绩单一模一样在线办理(worc毕业证书)伍斯特大学毕业证成绩单一模一样
在线办理(worc毕业证书)伍斯特大学毕业证成绩单一模一样
 
SEO and Google Ads Fundamentals Gokce Yesilbas
SEO and Google Ads Fundamentals Gokce YesilbasSEO and Google Ads Fundamentals Gokce Yesilbas
SEO and Google Ads Fundamentals Gokce Yesilbas
 
Viapulsa - Content Strategist Assignment
Viapulsa - Content Strategist AssignmentViapulsa - Content Strategist Assignment
Viapulsa - Content Strategist Assignment
 
DTA Promotion - Marketing Specialist Assignment
DTA Promotion - Marketing Specialist AssignmentDTA Promotion - Marketing Specialist Assignment
DTA Promotion - Marketing Specialist Assignment
 
INTRODUCTION TO SEARCH ENGINE OPTIMIZATION (SEO).pptx
INTRODUCTION TO SEARCH ENGINE OPTIMIZATION (SEO).pptxINTRODUCTION TO SEARCH ENGINE OPTIMIZATION (SEO).pptx
INTRODUCTION TO SEARCH ENGINE OPTIMIZATION (SEO).pptx
 
Embark on style journeys Indian clothing store denver guide.pptx
Embark on style journeys Indian clothing store denver guide.pptxEmbark on style journeys Indian clothing store denver guide.pptx
Embark on style journeys Indian clothing store denver guide.pptx
 
2025 Adventur ehomes Product Guide released Jun 1 2024
2025 Adventur ehomes Product Guide released Jun 1 20242025 Adventur ehomes Product Guide released Jun 1 2024
2025 Adventur ehomes Product Guide released Jun 1 2024
 
Social Samosa's #30Under30 Guidebook.pdf
Social Samosa's #30Under30 Guidebook.pdfSocial Samosa's #30Under30 Guidebook.pdf
Social Samosa's #30Under30 Guidebook.pdf
 
Title: Making Money the Easy Way: A Quick Guide to Generating Income
Title: Making Money the Easy Way: A Quick Guide to Generating IncomeTitle: Making Money the Easy Way: A Quick Guide to Generating Income
Title: Making Money the Easy Way: A Quick Guide to Generating Income
 
Learn more about affiliate marketing as a beginner
Learn more about affiliate marketing as a beginnerLearn more about affiliate marketing as a beginner
Learn more about affiliate marketing as a beginner
 
3 Best “Add to Calendar” Link Generator Tools (2024)
3 Best  “Add to Calendar”  Link Generator Tools (2024)3 Best  “Add to Calendar”  Link Generator Tools (2024)
3 Best “Add to Calendar” Link Generator Tools (2024)
 
How to Maximize Sales Using Social Commerce
How to Maximize Sales Using Social CommerceHow to Maximize Sales Using Social Commerce
How to Maximize Sales Using Social Commerce
 

Using Drupal as a Content Hub to create an interactive, visual product exploration application.

  • 1.
  • 2. Jan Pilarzeck, trio-group Using Drupal as a Content Hub to create an interactive, visual product exploration application. Of course, decoupled with vueJS ;-)
  • 3. 330.10.2019 DrupalCon 2019, Amsterdam Jan Pilarzeck Managing Partner at trio-group Entrepreneur, Tech Consultant, Architect, Speaker Married, 2 kids Heidelberg / Mannheim #Espresso #MTB #Italy j.pilarzeck@trio-group.de +49 621 / 33840 999 www.linkedin.com/in/jan-pilarzeck www.xing.com/profile/Jan_Pilarzeck
  • 4. Drupal is eating Typo3 and Sitecore for breakfast. Sharing a successful pitch slide. Selected CMS market share, Top 10k Websites worldwide Source: builtwith.com DrupalCon 2019, Amsterdam Typo3 Sitecore Drupal
  • 5. WIIFY? A story about using decoupled Drupal without all the pain…and making a client happy.
  • 6. Client’s challenges, our task 10/30/2019 6 • Hidden & complex products • Contents in different sources: Drupal, SAP Hybris/PIM • Multiple marketing channels: web, trade fairs, sales reps
  • 7. Our claim Create a world out of glass. Available everywhere. Ready for every day's changes. 10/30/2019 7
  • 13. Single source of truth: Drupal content hub 1330.10.2019 DrupalCon 2019, Amsterdam Products from SAP Hybris / PIM
  • 14. Trade fairs & events Offline Sales app Tablets & Desktop DrupalCon 2019, Amsterdam Corporate Website Content Hub SAP Hybris Commerce Portal Translation management Market Graphics App
  • 15. …what are those „market graphics“? 1630.10.2019 • Drupal 8 corporate website used as content hub and backend • Market graphics is a separated decoupled web app • vueJS as frontend JS framework • No separate backend, just API-calls to Drupal • Just a single file, served by a static assets server DrupalCon 2019, Amsterdam
  • 16. Offline usage 1730.10.2019 • Used for desktops and tablets • Electron is used to create desktop versions • Application is auto-detecting its context • NodeJS-Crawler fetches data from Drupal and stores them in local storage DrupalCon 2019, Amsterdam
  • 17. Editor backend 1830.10.2019 • Separate content type, aggregating all existing contents • Translations managed by TMGMT, connected with Across, half- automated DrupalCon 2019, Amsterdam
  • 18. Sections & individual content 1930.10.2019 • Paragraphs / nested • Individual content is plain text DrupalCon 2019, Amsterdam
  • 19. Touchpoint management 2030.10.2019 • Drag&Drop • Nested touchpoints! DrupalCon 2019, Amsterdam
  • 20. SAP Hybris products & content nodes 2130.10.2019 • SAP Hybris products are native Drupal contents • autocomplete entity references for products and drupal • One-click-done DrupalCon 2019, Amsterdam
  • 21. Outcome for our client 2230.10.2019 Autonomy & cost savings • No need for developer to create new scenes, 100% management in Drupal • they just need a new 3D-rendering to update their website, booth and sales team Speed • Faster time-to-market • Website, sales app and trade fairs updated with one click Convenience • One single easy-to-use interface • Automated & integrated translation management DrupalCon 2019, Amsterdam
  • 23. Join us for contribution opportunities Thursday, October 31, 2019 9:00-18:00 Room: Europe Foyer 2 Mentored Contribution First Time Contributor Workshop General Contribution #DrupalContributions 9:00-14:00 Room: Diamond Lounge 9:00-18:00 Room: Europe Foyer 2
  • 24. What did you think? Locate this session at the DrupalCon Amsterdam website: https://drupal.kuoni-congress.info/2019/program/ Take the Survey! https://www.surveymonkey.com/r/DrupalConAmsterdam