16.11.2015 111.09.2012 1

USER INTERFACE-TRENDS FÜR GESCHÄFTSANWENDUNGEN

Lösungsansätze und Plattformen

16.11.2015 211.09.2012 2

MOBILE APPLICATION DEVELOPMENT

16.11.2015 311.09.2012 3

16.11.2015 411.09.2012 4

NATIVE VS. HTML 5

16.11.2015 511.09.2012 5

NATIVE VS. HTML 5

NATIVE

Performance Security User Interface Device-Funktionalitäten Offline nutzbar

HTML 5

Breites Zielpublikumansprechen

Cross-Plattform Potential von HTML 5 nutzen

Simples Management/ Updates von Apps

16.11.2015 611.09.2012 6

HYBRIDS: BEST OF TWO WORLDS ?

NATIVE

HTML 5

NATIVEHTML 5

HTML Inhalte CSS JavaScript

Portable HTML5 Soviel native

wie nötig

Voller Zugriff Keine

Portabilität

16.11.2015 711.09.2012 7

CAPABILITY VS. PORTABILITY

http://wiki.developerforce.com

16.11.2015 811.09.2012 8

PHONEGAP

Full-Screen UI (Native Wrapper) JavaScript API ermöglicht Zugriffe auf Native-

Funktionalitäten

16.11.2015 911.09.2012 9

PHONEGAP

Entwicklung mit HTML5, CSS3 & JavaScript Endprodukt = Binary application archive Verteilung durch Plattform Stores

16.11.2015 1011.09.2012 10

CROSS PLATTFORM APPS WITH HTML 5

16.11.2015 1111.09.2012 11

HTML5 – WAS IST DAS?

Rich Web-Experience basierend auf Web-Standards Keine Plugins

16.11.2015 1211.09.2012 12

HTML5

Neue Version von HTML– Alles aus HTML 4, plus– Einfacherer Doctype– Sematische Tags

<header>, <footer>, <nav>, <details>, <figure>, etc… – Multimedia <video> und <audio> – WebForms

SVG Support

16.11.2015 1311.09.2012 13

CSS3

Alles aus CSS2, plus: – Rounded corners– Drop shadows– RGBA & HSLA colors– CSS Media Queries – Pseudo-class selectors– Web fonts– Rich formatting & multi-column layouts

16.11.2015 1411.09.2012 14

NEUE API

Canvas Drag & Drop History Inline Editing Messaging Offline Apps

Geolocation Local Storage Selectors Server Events WebSockets Workers

16.11.2015 1511.09.2012 15

APPLICATION ARCHITECTURE

16.11.2015 1611.09.2012 16

SINGLE-PAGE APPLICATIONS

«Rich, responsive applications combining the best of web and desktop, built with HTML5 and JavaScript»

Client und Application Server

Communication (HTTP Requests for HTML content, RESTfulXML services, JSON services or SOAP, or WebSockets (if supported) (similar to desktop browser based AJAX-Applications)

16.11.2015 1711.09.2012 17

Client

Single Page Application

Server

USER INTERFACE TECHNOLOGIEN

Visible UIHTML & CSS

Application LayerJavaScript

Data Access LayerJavaScript

Local StorageHTML 5

NavAPIs

WebForms

ASP.

NET

SITE

SSE

RVIC

ES

MVC

WebAPI

SignalR

Dev Tools

Visual Studio 2012

HTML/CSS/JS

JSON/XML

16.11.2015 1811.09.2012 18

16.11.2015 1911.09.2012 19

16.11.2015 2011.09.2012 20

16.11.2015 2111.09.2012 21

UNTERSCHIEDLICHE DISPLAYS

Device/Browser fragmentation Screen sizes Etc.

16.11.2015 2211.09.2012 22

UNTERSCHIEDLICHE DISPLAYS

16.11.2015 2311.09.2012 23

16.11.2015 2411.09.2012 24

MOBILE WEB WITH ASP.NET MVC 4

Adaptive Rendering– Einsatz von CSS Media Queries in Standard Templates

Display Modes– Selectively adapt views based on devices

Mobile Optimized Templates– jQuery Mobile

16.11.2015 2511.09.2012 25

WINDOWS 8

16.11.2015 2611.09.2012 26

Cloud-connected

Built on a solid foundation

Get more at the Windows Store

At home and at work

All the apps you want

Reimagined browsing with IE10

Windows reimagined

Great experience across hardware

WINDOWS 8

16.11.2015 2711.09.2012 27

KEY INVESTMENTS

New Windows Runtime (WinRT) New Windows 8 User Experience New App Execution Environment Windows Store

16.11.2015 2811.09.2012 28

WINDOWS 8 PLATFORM

Sty

16.11.2015 2911.09.2012 29

VERGLEICH DESKTOP / METRO

Metro Apps Desktop Software

Haupt-Eingabemedium Touch Maus/Tastatur

UI-Style Metro Windows

Runtime WinRT (Win32) .NET/SL/Win32

Verteilung Windows Store Download Webseite

Installation .appx Package MSI

Systemzugriff Nur über WinRT Voller Zugriff