Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
„Take the RISC!“
Von Java Swing über JavaFX
nach HTML.
UI Strategien für operativ genutzte
Geschäftsanwendungen.
CaptainCasaEnterpriseClientRISC
Björn Müller
• 1991-2001: SAP
– Anwendungsentwicklung
– Basis-Java-Architekturentwicklung
...
CaptainCasaEnterpriseClientRISC
CaptainCasa
• 2007 Gründung CaptainCasa
– Corporate Community
– GmbH
• 2008 Java Swing bas...
CaptainCasaEnterpriseClientRISC
CaptainCasa
CaptainCasaEnterpriseClientRISC
Motivation
CaptainCasaEnterpriseClientRISC
Developers: Eat you own Dog Food!
CaptainCasaEnterpriseClientRISC
Developers: Eat you own Dog Food!
EclipseReisekosten-
abrechnung
Projekt-
rückmeldung
Powe...
CaptainCasaEnterpriseClientRISC
Developers: Eat you own Dog Food!
Eclipse
Reisekosten-
abrechnung
Projekt-
rückmeldung
Pow...
CaptainCasaEnterpriseClientRISC
Developers: Eat you own Dog Food!
Eclipse
Reisekosten-
abrechnung
Projekt-
rückmeldung
Pow...
CaptainCasaEnterpriseClientRISC
Developers: Eat you own Dog Food!
CaptainCasaEnterpriseClientRISC
Developers: Eat you own Dog Food!
Bank
Anwendung
Reisekosten-
abrechnung
Recherche
Busines...
CaptainCasaEnterpriseClientRISC
Developers: Eat you own Dog Food!
Bank
Anwendung
Reisekosten-
abrechnung
Recherche
Busines...
CaptainCasaEnterpriseClientRISC
Developers: Eat you own Dog Food!
Reisekosten-
abrechnung
Recherche
Zeit
erfassung
spiegel...
CaptainCasaEnterpriseClientRISC
Motivation
extern intern
extern intern
CaptainCasaEnterpriseClientRISC
Motivation
HTML
Durchdringung
Cloud
extern intern
extern intern
CaptainCasaEnterpriseClientRISC
Motivation
HTML
Durchdringung
Cloud
extern intern
extern intern
CaptainCasaEnterpriseClientRISC
Motivation
HTML
Durchdringung
Cloud
extern intern
extern intern
UNBEHAGEN:
Browser/Devicek...
CaptainCasaEnterpriseClientRISC
Motivation
HTML
Durchdringung
Cloud
extern intern
extern intern
UNBEHAGEN:
Browser/Devicek...
CaptainCasaEnterpriseClientRISC
Wichtige Folie!
WebUIHypes
Bus.Application
Lifecycle
CaptainCasaEnterpriseClientRISC
Back to the
80s/90s
CaptainCasaEnterpriseClientRISC
Back to the 80s/90s
#
Instructions
CaptainCasaEnterpriseClientRISC
Back to the 80s/90s
#
Instructions
Change of Paradigm
Algorithmic
in front
of processor
# ...
CaptainCasaEnterpriseClientRISC
Back to the 80s/90s
#
Instructions
Complex Instruction Set
Computers
CISC
Change of Paradi...
CaptainCasaEnterpriseClientRISC
Back to the 80s/90s
#
Instructions
Complex Instruction Set
Computers
CISC
Change of Paradi...
CaptainCasaEnterpriseClientRISC
Browser History
CaptainCasaEnterpriseClientRISC
Browser History
#Elements
#Attributes
#CSS
CaptainCasaEnterpriseClientRISC
Browser History
#Elements
#Attributes
#CSS
CaptainCasaEnterpriseClientRISC
Browser History
#Elements
#Attributes
#CSS
Suffering
„Zero Installation!“
„...endless Main...
CaptainCasaEnterpriseClientRISC
Traditional Framework Approach
Framework
#Elements
#Attributes
#CSS
Your Frontend App
CaptainCasaEnterpriseClientRISC
Traditional Framework Approach
Framework
#Elements
#Attributes
#CSS
Your Frontend App
Stil...
CaptainCasaEnterpriseClientRISC
Traditional Framework Approach
Framework
#Elements
#Attributes
#CSS
Your Frontend App
Stil...
CaptainCasaEnterpriseClientRISC
Traditional Framework Approach
Framework
#Elements
#Attributes
#CSS
Your Frontend App
Stil...
CaptainCasaEnterpriseClientRISC
What's about...
CaptainCasaEnterpriseClientRISC
What's about...
...a Change of Paradigm?
CaptainCasaEnterpriseClientRISC
Which are the basic elements that „any“
user interface can be built with?
CaptainCasaEnterpriseClientRISC
What are the basic elements which
of even complex user interfaces?
1. Rectangles
- with/wi...
CaptainCasaEnterpriseClientRISC
Micro Kernel
RISC Browser Architecture
„2“ El.
Rectangles
Text Input
CaptainCasaEnterpriseClientRISC
Micro Kernel
RISC Browser Architecture
„2“ El.
UI Elements
Based
On
Nucleus Elements
Recta...
CaptainCasaEnterpriseClientRISC
Micro Kernel
RISC Browser Architecture
„2“ El.
UI Elements
Based
On
Nucleus Elements
Recta...
CaptainCasaEnterpriseClientRISC
Framework
Micro Kernel
RISC Browser Architecture
#Elements
#Attributes
#CSS
„2“ El.
UI Ele...
CaptainCasaEnterpriseClientRISC
Framework
Micro Kernel
RISC Browser Architecture
#Elements
#Attributes
#CSS
„2“ El.
UI Ele...
CaptainCasaEnterpriseClientRISC
RISC Browser Architecture
Micro Kernel
#...
UI Elements
Based
On
Nucleus Elements
ADVANTAG...
CaptainCasaEnterpriseClientRISC
RISC Browser Architecture
Micro Kernel
#...
UI Elements
Based
On
Nucleus Elements
ADVANTAG...
CaptainCasaEnterpriseClientRISC
RISC Browser Architecture
Micro Kernel
#...
UI Elements
Based
On
Nucleus Elements
CHALLENG...
CaptainCasaEnterpriseClientRISC
Big(ger) Picture
CaptainCasaEnterpriseClientRISC
Browser
JS Component
Library
Big(ger) Picture
Nucleus Library
#...
UI Elements
Based
On
Nu...
CaptainCasaEnterpriseClientRISC
CaptainCasaEnterpriseClientRISC
CaptainCasaEnterpriseClientRISC
Browser
JS Component
Library
Big(ger) Picture
Nucleus Library
#...
UI Elements
Based
On
Nu...
CaptainCasaEnterpriseClientRISC
Browser
JS Component
Library
Big(ger) Picture
Nucleus Library
#...
UI Elements
Based
On
Nu...
CaptainCasaEnterpriseClientRISC
Browser
JS Component
Library
Example: CaptainCasa Enterprise
Client
Nucleus Library
#...
U...
CaptainCasaEnterpriseClientRISC
Ist „Server-UI“ old school?
Client UI
Server UI
Mainframe
Fat Client
Web-HTML
JavaScript
CaptainCasaEnterpriseClientRISC
Ist „Server-UI“ old school?
• Server-centric UI
– Server state!
– Große Nähe zur Logik
– E...
CaptainCasaEnterpriseClientRISC
Summary
CaptainCasaEnterpriseClientRISC
Summary
• The RISC Browser Architecture is a paradigm shift
for using HTML.
• Compatibilit...
CaptainCasaEnterpriseClientRISC
Summary
• The RISC Browser Architecture is a paradigm shift
for using HTML.
• Compatibilit...
CaptainCasaEnterpriseClientRISC
Summary
HTML
Durchdringung
Cloud
extern intern
extern intern
CaptainCasaEnterpriseClientRISC
HTML
Durchdringung
extern intern
extern intern
Summary
RISC HTML
CaptainCasaEnterpriseClientRISC
CaptainCasa Services
• „Druckbetankung“
– Kosten: 2.500 EUR pauschal
3-4 Screen
Scenario P...
CaptainCasaEnterpriseClientRISC
CaptainCasa Services
• Projektbegleitung
– CaptainCasa
– Architektur“setup“
– Erweiterunge...
CaptainCasaEnterpriseClientRISC
Last but not least
• http://www.CaptainCasa.com
– Download (Free Usage)
– Demos
– Doku
Upcoming SlideShare
Loading in …5
×

Björn Müller (CaptainCasa GmbH);Von Java Swing über JavaFX nach HTML

125 views

Published on

Vortrag auf dem Experetnkreis Java, 16.02.2017, GEDOPLAN GmbH Bielefeld

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Björn Müller (CaptainCasa GmbH);Von Java Swing über JavaFX nach HTML

  1. 1. „Take the RISC!“ Von Java Swing über JavaFX nach HTML. UI Strategien für operativ genutzte Geschäftsanwendungen.
  2. 2. CaptainCasaEnterpriseClientRISC Björn Müller • 1991-2001: SAP – Anwendungsentwicklung – Basis-Java-Architekturentwicklung – J2EE Server Entwicklung • Seit 2001: – Entwicklung von Frontendframeworks für umfangreiche, operativ genutzte, serverbasierte Unternehmensanwendungen – 2001-2007: Casabac Technologies GmbH – „AJAX“ Pionier – 2005 Übernahme durch Software AG – 2007–heute: CaptainCasa GmbH + Community – Java Swing, Java FX, RISC-HTML, (SAP UI5)
  3. 3. CaptainCasaEnterpriseClientRISC CaptainCasa • 2007 Gründung CaptainCasa – Corporate Community – GmbH • 2008 Java Swing basierter Client • 2014 JavaFX basierter Client • 2016 Entwicklung der RISC-HTML Methode • 2016 HTML basierter Client
  4. 4. CaptainCasaEnterpriseClientRISC CaptainCasa
  5. 5. CaptainCasaEnterpriseClientRISC Motivation
  6. 6. CaptainCasaEnterpriseClientRISC Developers: Eat you own Dog Food!
  7. 7. CaptainCasaEnterpriseClientRISC Developers: Eat you own Dog Food! EclipseReisekosten- abrechnung Projekt- rückmeldung Powerpoint Mail Stack Overflow spiegel.de
  8. 8. CaptainCasaEnterpriseClientRISC Developers: Eat you own Dog Food! Eclipse Reisekosten- abrechnung Projekt- rückmeldung Powerpoint Mail Stack Overflow spiegel.de WEB Native
  9. 9. CaptainCasaEnterpriseClientRISC Developers: Eat you own Dog Food! Eclipse Reisekosten- abrechnung Projekt- rückmeldung Powerpoint Mail Stack Overflow spiegel.de WEB Native Sim plicity first! Efficiency first!
  10. 10. CaptainCasaEnterpriseClientRISC Developers: Eat you own Dog Food!
  11. 11. CaptainCasaEnterpriseClientRISC Developers: Eat you own Dog Food! Bank Anwendung Reisekosten- abrechnung Recherche Business Intelligence Mail Zeit erfassung spiegel.de
  12. 12. CaptainCasaEnterpriseClientRISC Developers: Eat you own Dog Food! Bank Anwendung Reisekosten- abrechnung Recherche Business Intelligence MailZeit erfassung spiegel.de WEB Native
  13. 13. CaptainCasaEnterpriseClientRISC Developers: Eat you own Dog Food! Reisekosten- abrechnung Recherche Zeit erfassung spiegel.de WEB Native Sim plicity first! Bank Anwendung Business Intelligence Mail Efficiency first!
  14. 14. CaptainCasaEnterpriseClientRISC Motivation extern intern extern intern
  15. 15. CaptainCasaEnterpriseClientRISC Motivation HTML Durchdringung Cloud extern intern extern intern
  16. 16. CaptainCasaEnterpriseClientRISC Motivation HTML Durchdringung Cloud extern intern extern intern
  17. 17. CaptainCasaEnterpriseClientRISC Motivation HTML Durchdringung Cloud extern intern extern intern UNBEHAGEN: Browser/Devicekompatibilität Performance Layouting Restrictions Langfristige Stabilität / Investitionssicherheit Entwicklungskosten Wartungskosten KONTROLLVERLUST
  18. 18. CaptainCasaEnterpriseClientRISC Motivation HTML Durchdringung Cloud extern intern extern intern UNBEHAGEN: Browser/Devicekompatibilität Performance Layouting Restrictions Langfristige Stabilität / Investitionssicherheit Entwicklungskosten Wartungskosten KONTROLLVERLUST
  19. 19. CaptainCasaEnterpriseClientRISC Wichtige Folie! WebUIHypes Bus.Application Lifecycle
  20. 20. CaptainCasaEnterpriseClientRISC Back to the 80s/90s
  21. 21. CaptainCasaEnterpriseClientRISC Back to the 80s/90s # Instructions
  22. 22. CaptainCasaEnterpriseClientRISC Back to the 80s/90s # Instructions Change of Paradigm Algorithmic in front of processor # Inst.
  23. 23. CaptainCasaEnterpriseClientRISC Back to the 80s/90s # Instructions Complex Instruction Set Computers CISC Change of Paradigm Algorithmic in front of processor # Inst. Reduced Instruction Set Computers RISC
  24. 24. CaptainCasaEnterpriseClientRISC Back to the 80s/90s # Instructions Complex Instruction Set Computers CISC Change of Paradigm Algorithmic in front of processor # Inst. Reduced Instruction Set Computers RISC Algorithmic Execution
  25. 25. CaptainCasaEnterpriseClientRISC Browser History
  26. 26. CaptainCasaEnterpriseClientRISC Browser History #Elements #Attributes #CSS
  27. 27. CaptainCasaEnterpriseClientRISC Browser History #Elements #Attributes #CSS
  28. 28. CaptainCasaEnterpriseClientRISC Browser History #Elements #Attributes #CSS Suffering „Zero Installation!“ „...endless Maintenance“
  29. 29. CaptainCasaEnterpriseClientRISC Traditional Framework Approach Framework #Elements #Attributes #CSS Your Frontend App
  30. 30. CaptainCasaEnterpriseClientRISC Traditional Framework Approach Framework #Elements #Attributes #CSS Your Frontend App Still: Suffering
  31. 31. CaptainCasaEnterpriseClientRISC Traditional Framework Approach Framework #Elements #Attributes #CSS Your Frontend App Still: SufferingKomplexitätgesamt = KomplexitätHTML5 + KomplexitätFramework
  32. 32. CaptainCasaEnterpriseClientRISC Traditional Framework Approach Framework #Elements #Attributes #CSS Your Frontend App Still: SufferingKomplexitätgesamt = KomplexitätHTML5 + KomplexitätFramework Komplexitätgesamt = KomplexitätHTML5 * KomplexitätFramework
  33. 33. CaptainCasaEnterpriseClientRISC What's about...
  34. 34. CaptainCasaEnterpriseClientRISC What's about... ...a Change of Paradigm?
  35. 35. CaptainCasaEnterpriseClientRISC Which are the basic elements that „any“ user interface can be built with?
  36. 36. CaptainCasaEnterpriseClientRISC What are the basic elements which of even complex user interfaces? 1. Rectangles - with/without text - with/without background styling 2. Textinput - single line - multi line (3. Graphics) ...and the possibility to A. position them absolutely (x,y,width,height(,z)) B. compose them
  37. 37. CaptainCasaEnterpriseClientRISC Micro Kernel RISC Browser Architecture „2“ El. Rectangles Text Input
  38. 38. CaptainCasaEnterpriseClientRISC Micro Kernel RISC Browser Architecture „2“ El. UI Elements Based On Nucleus Elements Rectangles Text Input Reduced Instruction Set Client RISC
  39. 39. CaptainCasaEnterpriseClientRISC Micro Kernel RISC Browser Architecture „2“ El. UI Elements Based On Nucleus Elements Rectangles Text Input Reduced Instruction Set Client RISC Button ComboBox Grid Dialog
  40. 40. CaptainCasaEnterpriseClientRISC Framework Micro Kernel RISC Browser Architecture #Elements #Attributes #CSS „2“ El. UI Elements Based On Nucleus Elements Complex Instruction Set Client CISC Reduced Instruction Set Client RISC Change of Paradigm
  41. 41. CaptainCasaEnterpriseClientRISC Framework Micro Kernel RISC Browser Architecture #Elements #Attributes #CSS „2“ El. UI Elements Based On Nucleus Elements Complex Instruction Set Client CISC Reduced Instruction Set Client RISC Rendering „Algorithmic“ Rendering „Execution“
  42. 42. CaptainCasaEnterpriseClientRISC RISC Browser Architecture Micro Kernel #... UI Elements Based On Nucleus Elements ADVANTAGES • Browser Incompatibility is no issue. – The nucleus' size is 1000 lines of Javascript, currently! • Performance on current browsers is excellent. • Layouting is not bound to HTML limits.
  43. 43. CaptainCasaEnterpriseClientRISC RISC Browser Architecture Micro Kernel #... UI Elements Based On Nucleus Elements ADVANTAGES • Decoupling from HTML • Regain of Control
  44. 44. CaptainCasaEnterpriseClientRISC RISC Browser Architecture Micro Kernel #... UI Elements Based On Nucleus Elements CHALLENGES • Adaptations required – Accessibility support – Testing frameworks
  45. 45. CaptainCasaEnterpriseClientRISC Big(ger) Picture
  46. 46. CaptainCasaEnterpriseClientRISC Browser JS Component Library Big(ger) Picture Nucleus Library #... UI Elements Based On Nucleus Elements
  47. 47. CaptainCasaEnterpriseClientRISC
  48. 48. CaptainCasaEnterpriseClientRISC
  49. 49. CaptainCasaEnterpriseClientRISC Browser JS Component Library Big(ger) Picture Nucleus Library #... UI Elements Based On Nucleus Elements Frontend Logic Backend Logic Binding Concept Binding Concept
  50. 50. CaptainCasaEnterpriseClientRISC Browser JS Component Library Big(ger) Picture Nucleus Library #... UI Elements Based On Nucleus Elements Frontend Logic Backend Logic Binding Concept Binding Concept Outside frameworks must not influence UI Component Library - and vice versa
  51. 51. CaptainCasaEnterpriseClientRISC Browser JS Component Library Example: CaptainCasa Enterprise Client Nucleus Library #... UI Elements Based On Nucleus Elements Backend Logic Dialog Processing Frontend Rendering Engine Layout XML Data Events Rendering Events Filter & Queue
  52. 52. CaptainCasaEnterpriseClientRISC Ist „Server-UI“ old school? Client UI Server UI Mainframe Fat Client Web-HTML JavaScript
  53. 53. CaptainCasaEnterpriseClientRISC Ist „Server-UI“ old school? • Server-centric UI – Server state! – Große Nähe zur Logik – Effiziente Entwicklung auch komplexer Szenarien – Function / Data driven – ==> Sachbearbeiter • Client-centric UI – Server stateless – Kernlogik nur remote erreichbar – Aufwendige Entwicklung – Design driven – ==> Endkonsumenten
  54. 54. CaptainCasaEnterpriseClientRISC Summary
  55. 55. CaptainCasaEnterpriseClientRISC Summary • The RISC Browser Architecture is a paradigm shift for using HTML. • Compatibility by design – and not: Compatibility by test / resources • Regain of Control! – Robustness – Performance – Layouting
  56. 56. CaptainCasaEnterpriseClientRISC Summary • The RISC Browser Architecture is a paradigm shift for using HTML. • Compatibility by design – and not: Compatibility by test / resources • Regain of Control! – Robustness – Performance – Layouting
  57. 57. CaptainCasaEnterpriseClientRISC Summary HTML Durchdringung Cloud extern intern extern intern
  58. 58. CaptainCasaEnterpriseClientRISC HTML Durchdringung extern intern extern intern Summary RISC HTML
  59. 59. CaptainCasaEnterpriseClientRISC CaptainCasa Services • „Druckbetankung“ – Kosten: 2.500 EUR pauschal 3-4 Screen Scenario Presentable Prototype Tag 1 Tag 2
  60. 60. CaptainCasaEnterpriseClientRISC CaptainCasa Services • Projektbegleitung – CaptainCasa – Architektur“setup“ – Erweiterungen – Krisen – Community Partner – Anwendungsentwicklung – Projektbetreuung
  61. 61. CaptainCasaEnterpriseClientRISC Last but not least • http://www.CaptainCasa.com – Download (Free Usage) – Demos – Doku

×