creando-rich-internet-applications.pdf

Loading ...
Global Do...
News & Politics
Creando Rich Internet 
Applications 
en la nueva Web 2.0
Juan Cabrera
Director Cubika
jcabrera@cubika.com
Acerca de Cubika
•
Cubika es una de las principales empresas argentinas dedicada al
desarrollo de soluciones de software basadas en nuevas 
tecnologías para el sector corporativo.
•
Primera compañía argentina que se especializó en el desarrollo de 
aplicaciones e-business sobre tecnologías Java (J2EE) y Servicios 
Web así como en integración de aplicaciones y Arquitecturas 
Orientadas a Servicios (SOA).
•
Alcanza actualmente un plantel profesional de 150 personas y 
crece a una tasa promedio del 100% anual.
Agenda
La siguiente gran cosa (NBT): Web 2.0
Rich Internet Applicaitons (RIAs).
Escenarios para las RIAs
Qué es Flex?.
Demostraciones
Conclusiones
Preguntas y Respuestas
La siguiente gran cosa : Web 2.0
Web 2.0
Posicionamiento
Estratégico
La web como plataforma de 
aplicaciones
Posicionamiento
de los usuarios
Control de sus propia
información
Características
Destacadas
• Servicios, no software 
empaquetado
• Arquitectura de participación
• Escalabilidad efectiva en costos
• Inteligencia colectiva
Fuente:  Web 2.0, Tim O’Reilly
Web 2.0 Cont.
• Blogging
• BitTorrent
• Google AdSense
• Web services
• Participacion
• Wikis
• Personal sites
• Akamai
• DoubleClick
• Screen scrap
• Publicacion
• Administradores de 
Contenido
Web 1.0
Web 2.0
Web 2.0 - La Internet Rica
% de usuarios
de Internet
100%
0%
1970
1980
1990
2001
Transf. de 
archivos
Term.
remotos
(telnet)
E-mail
Web
Internet 
Rica
“ Las Rich Interactive 
Applications (RIA*) están
en el centro de una
tendencia que harán la 
experiencia del usuario
con el software algo cada
vez más importante.”
Ovum
Cuál es el tendencia?
“Hacia el  2010, al menos el 60 % de los 
nuevos proyectos de desarrollo incluirán
tecnología RIA.”
Gartner
Rich Internet Applications
The Evolution of Rich Internet Applications
CLIENT/SERVER
MAINFRAME
WEB APPLICATIONS
REACHLocal
Global
RICH
Text UI
Integrated media GUI
1992
1998
2004
Deficiencias HTML
• Metáfora de “página”
• Sólo 6 controles de UI
•
Inconsistencias cross-
browser
•
Impresión Press n’ pray
• Request-only data
• Sin operación offline
• Bitmaps desde el 
servidor
•
Infierno de plugins A/V
fii
i
•
f
 
i
•
l
 
l
 
I
•
I
i
i
-
•
I
i
 
’
•
-
l 
•
i
 
i
ffli
•
i
 
l 
i
•
Ifi
 l
i
/
Los tesoros perdidos de C/S
• Metáfora de  “pantalla”
•
Librerias de componentes
extensibles
• Online/offline + sync
•
Impresión WYSIWYG
•
Visualizacion de datos
•
Conectividad a datos en tiempo real
•
Bitmap/vector graphics
•
A/V Integrado
 
i
 /
•
f
  
ll
•
i
i
 
il
•
li
/ffli
 
 
•
I
i
I
•
i
li
i
 
•
ii
 
 i
l
•
i
/
 
i
•
/
 I
RICH INTERNET
APPLICATIONS
Web 2.0
Tendencias en aplicaciones Internet Corporativas
TENDENCIA
IMPACTO EN LA 
ARQUITECTURA
J2EE y .NET 
dominantes
Emerge una arquitectura
orientada a servicios
Estable, capas de 
acceso de datos y 
lógica de 
negocios
flexibles.
HTML limitado
para aplicaciones
Complicada, capa
de presentación
no intuitiva
IMPACTO EN EL 
NEGOCIO
Desafios
crónicos de 
usabilidad
ROI
no realizado
Que son las RIAs?
Rich
• Provee al usuario de una mejor experiencia, experiencia
cinemática o UI del tipo DMMT.
• Feedback y validacion en contexto.
Internet
• Mejor utilizacion de red.
• Los datos están en un servidor central o varios.
• Múltiples usuarios acceden a los datos y colaboran.
• La plataforma de acceso es un browser.
Application
• Permite al usuario realizar varias tareas o ejecutar un 
proceso de negocio.
• No es un juego el usuario tiene que hacerlo rápida y 
eficientemente.
Entendiendo las RIAs
Las RIAs incluyen las siguientes características
• Cada interacción del usuario no necesita de una
interacción con el servidor
• Los datos pueden ser obtenidos desde el servidor
sin necesidad de actualizar toda la pantalla.
Los mejores aspectos de la web están presentes en 
las RIAs
• Facilidad de deployment 
• Facilidad de administración
• Facilidad de desarrollo
Tendencias en aplicaciones Internet Corporativas
TENDENCIA
IMPACTO EN LA 
ARQUITECTURA
J2EE y .NET 
dominantes
Emerge una arquitectura
orientada a servicios
Estable, capas de 
acceso de datos y 
lógica de 
negocios
flexibles.
HTML limitado
para aplicaciones
Complicada, capa
de presentación
no intuitiva
IMPACTO EN EL 
NEGOCIO
Desafios
crónicos de 
usabilidad
ROI
no realizado
Plataformas RIAs
AWT/Swing y SWT
• Java WebStart
• Eclipse RCP
• Spring Rich Client
AJAX = Asynchronous JavaScript and XML
• Es una técnica que combina:
• HTML y CSS
• DOM y Javascript
• XMLHttpRequest
Adobe Flex
RIAs con AJAX – Arquitectura
Escenarios para las RIA
Soluciones
Configuradores de Producto
Self-service web sites
Online Banking
Retail / e-Commerce
Beneficios
Reduccion de tasas de 
abandono
Upsell / Cross Sell
Reduccion de costo de 
Customer Service 
Clientes
Harley Davidson, Intelligent 
Finance (HBOS), Vodaphone, 
City of Canton, 
RIA para soluciones de venta guiada
RIA para Integración de Procesos
ERP
CRM
Order
Entry
Web Services  / SOA
• Low Training 
Costs
• Fewer Errors
• Higher 
Utilization
• Higher 
productivity
Soluciones
Mortgage Application
Procesos d reclamos
Call Center Automation
Tax Processing
Beneficios
Más informacion
en menos tiempo
Mayor entendimiento
Colaboración más eficiente
Decisiones más rápidas
Clientes
Dorado, Zones, Optimal 
Payments
Soluciones
Trader Desktop
Dashboard Ejecutivo
Network Monitoring
Beneficios
Más información en menos
tiempo.
Entendimiento profundo
Colaboración eficiente
Decisiones más rápidas
Clientes
SAP, ESRI, Yahoo Maps, 
Brocade, University of North 
Carolina
RIA para Visualización Datos
Qué es Flex ?
El Cliente Flash - Números
98%
de PCs tienen
Flash Player instalado
60
Segundos descarga
~500M
PCs
60
Evolución Tecnología de Flash
Audio
Video
Applications
Motion Graphics
Flash Player 9 – Enterprise Class Run Time
Flash Player 9.0
Nueva Virtual Machine
ActionScript 3
• Grandes mejoras de 
performance
• Upgrades de un click 
• API para integrar con AJAX y 
aplicaciones nativas
• ECMAScript for XML (E4X)
ActionScript 1/2
ActionScript 3
Flash Player 8
Flash 8.0 alcanzó 76% de penetración en 5 meses
Flash Player 5 Flash Player 6 Flash Player 7 Flash Player 8 Flash Player 8 (projected)
0.0%
10.0%
20.0%
30.0%
40.0%
50.0%
60.0%
70.0%
80.0%
90.0%
100.0%
Jun-00Sep-00Dec-00Mar-01Jun-01Sep-01Dec-01Mar-02Jun-02Sep-02Dec-02Mar-03Jun-03Sep-03Dec-03Mar-04Jun-04Sep-04Dec-04Mar-05Jun-05Sep-05Dec-05Mar-06Jun-06Sep-06Dec-06Flash Player 5 Flash Player 6 Flash Player 7 Flash Player 8
Source: NPD, December 2006
Flash Player Penetration
FLASH
80% en ~12 meses
OTROS
Internet Explorer 6: 77% en 51 meses2
Windows XP: 65%  despues de 45 meses3
Java v1.4.x: 33% despues de 49 meses4
La plataforma Flash 
está en todas partes
Sistemas operativos
Navegadores
Plataformas
Otros dispositivos
Dispositivos móviles
Estructura de Flex 2.0
Design View
Flex Builder with
Charting
Code Hinting
Debugging
Component Skinning
Flex Framework MXML Compiler, Flex Libraries, Components, 
Containers, Layout Managers, Behaviors, and Effects
Flex Utilities
Compilation, Debugging, Automated Testing
Flex Data Services 2.0
Real Time Message Services
Data Management Service
Remote Procedure Calls  (RPC Service)
Flex Utilities
Compilation, Debugging, Automated Testing
Programming 
Language
ActionScript 3, MXML
Flex SDK
RIA 
c.2006-2007
RIA
c.202-2006
DHTML
c.1997
Historia y futuro de RIA
REACHCross 
Device
RICHNESS AND CAPABILITY
Cross-
Windows
Cross 
OS
No Page
Refresh
Rich UI
Controls
A/V
Integration
Contextual
Collaboration
Publish &
Subscribe
Cross 
Browser
Offline
Operation
*Non-ubiquitous, heavy footprint runtime dependency that may also involve complex backend system/app upgrades.
Hi-Fi
Print
.NET*
J2SE*
Windows
Presentation
Foundation*
AJAX
Frameworks
Flex 1.5
Flex 2
Flex 3
WPF/E
AJAX
Plain
Interactive
Graphics
Demos
Conclusiones
“Vivimos en tiempos interesantes”
Proverbio Chino
La infraestructura para Web 2.0 está aquí.
Es una evolución sobre conceptos existentes y se 
complementa con otras tendencias como SOA
Varias alternativas, mucha innovacion, mucho buzz, pero el 
camino está trazado.
Se pueden realizar beneficios de negocio en el uso de las
aplicaciones ricas basadas en la web . 
Recursos
Flex Developer
• http://www.flex.org
• http://www.adobe.com/go/flex
Adobe Labs
• http://labs.adobe.com/
AJAX 
• http://www.ajaxian.com/resources/
• http://www.ajaxhispano.com
• http://labs.adobe.com/technologies/spry/