RICH INTERNET APPLICATIONS

Transcrição

1 Uma visão geral RICH INTERNET APPLICATIONS

2 Agenda 1. A história do Sr. Fonseca 2. Rich Internet Applications 3. Showcase 4. Tecnologias Adobe Flex 5. Próximos passos

3 O apresentador Engenheiro de Software especializado na arquitectura e desenvolvimento de Rich Internet Applications corporativas; CTO na Webfuel; Adobe Certified Expert em Flex 3 e Air; Adobe Community Expert; Formador com certificação profissional; Co-fundador da Comunidade Portuguesa de Rich Internet Applications (RiaPT);

4 Contacto

5

6

7

8 1. A história do Sr. Fonseca * * Qualquer semelhança com a realidade (não) é pura coincidência

9 O Sr. Fonseca Em 1995 o Sr. Fonseca decidiu abrir um negócio de distribuição de material informático

10 O negócio do Sr. Fonseca Inicialmente os clientes (revendedores) telefonavam a solicitar encomendas

11 O negócio do Sr. Fonseca Em 1997 o Sr. Fonseca tinha tantos clientes (não se falava de crise financeira) que o sistema de encomendas por telefone não dava conta do recado

12 A ideia do Sr. Fonseca Em 1998 o Sr. Fonseca decide desenvolver uma aplicação desktop B2B para permitir aos revendedores encomendar o material pretendido. A ideia dele consistia em permitir que os clientes pudessem arrastar os componentes pretendidos para um carrinho de compras virtual que calcularia o total, e faria o processamento da encomenda.

13 A aplicação desktop A aplicação foi instalada em todos os clientes. Comparativamente ao sistema anterior, a aplicação desktop foi um passo de gigante. Fazer uma encomenda era agora fácil, rápido e automático. Mas...

14

15 A aplicação desktop - frustrações 1. Time to Market alto - Foram precisos 6 meses para a aplicação estar instalada correctamente em cerca de computadores (65% dos previstos); 2. Incompatibilidades de SO - Nos 35% de computadores restantes a aplicação não corria incompatibilidades com as versões de sistemas operativo e bibliotecas necessárias; 3. Custos acrescidos com suporte técnico - Foi necessário criar uma equipa técnica para poder andar pelo país a dar manutenção aos clientes ; 4. Dificuldades de adopção - Sempre que um cliente adicionava um novo computador à sua infra-estrutura, era preciso instalar e configurar a aplicação; 5. O Inferno da manutenção - Sempre que saia uma nova versão da aplicação, era preciso actualizar todos os computadores. Ao fim de alguns meses, já circulavam pelos clientes 7 versões diferentes, o que tornava caótica a tarefa de dar manutenção 6. Dificuldades de acesso - Os clientes queixavam-se que queriam aceder à aplicação a partir de qualquer local e computador, mas só o conseguiam fazer nos computadores com a aplicação instalada.

16 Ubiquidade! ubiquidade (u-i) s. f. O facto de estar presente em toda a parte ao mesmo tempo. Fonte: priberam.pt

17 O segundo passo... Em 2001 o Sr. Fonseca decidiu migrar a aplicação desktop para uma aplicação web. O Sr. Fonseca queria a aplicação imediatamente disponível a qualquer cliente, a partir de qualquer local e computador ubiquidade!

18 A aplicação web A aplicação passou a correr numa única máquina um web-server -, e os problemas ficaram (quase) todos resolvidos: Um URL e um web browser eram suficientes para qualquer cliente aceder à aplicação a partir de qualquer computador. O inferno da manutenção termina! Mas os clientes queixam-se de que preferiam a versão anterior (desktop)!!

19 A aplicação web - frustrações 1. Incompatibilidades entre browsers - Em browsers diferentes a aplicação tinha comportamentos diferentes; 2. Baixa produtividade - Anteriormente uma encomenda era feita em poucos segundos. Agora: 1. Adicionar um produto ao carrinho de compras implicava 3 ou 4 segundos de espera por cada produto; 2. A navegação entre páginas de produtos implicava 3 ou 4 segundos de espera entre página, o que era problemático em milhares de produtos; 3. No total, em média era preciso 5x mais tempo para fazer uma encomenda do que anteriormente. 3. Interactividade: A aplicação anteriormente era mais intuitiva e interactiva. Por exemplo, as filtragens eram imediatas: activar uma checkbox era suficiente para filtrar imediatamente a listagem de produtos; Agora era preciso carregar em submeter, e esperar mais alguns segundos para ver o resultado dessa alteração no filtro.

20 User Experience This is an umbrella term used to describe all the factors that contribute to a site user s overall perception of a system. Is it easy to use, attractive and appropriate? Does it meet user needs? Fonte:

21 Em resumo... Fonte: Forrester Research & Backbase

22 2. Rich Internet Applications

23 Rich Internet Applications - Definição Wikipedia: Rich Internet applications (RIAs) are web applications that have some of the characteristics of desktop applications, typically delivered by way of a proprietary web browser plug-ins or independently via sandboxes or virtual machines.

24 Rich Internet Applications Aplicações desktop Aplicações web RIAs Tecnologias de comunicação

25 Rich Internet Applications - Definição A minha definição: Aplicações acessíveis a partir de (quase) qualquer local, computador ou até mesmo dispositivo, dotadas de um user interface rico e altamente interactivo focado na produtividade do utilizador Ubiquidade + User Experience

26 Rich Internet Applications - características Não precisam de ser instaladas; Podem ser acedidas a partir de qualquer computador ligado à internet, ou mesmo possivelmente de outros dispositivos (telemóveis, PDAs, TVboxes, etc); Compatíveis com os principais sistemas operativos (Windows, Linux, e Mac OS); Actualizações transparentes para o utilizador; User Experience e Interface gráfico ricos em multimédia e interactividade; [...]

27 3. Showcase

28 Alguns exemplos

29 Processamento de texto - Buzzword

30 Apresentações multimédia - SlideRocket

31 Edição de imagem Adobe Photoshop Express

32 Mais RIAs

33 4. Tecnologias: Adobe Flex

34 Tecnologias

35 ADOBE FLEX 3 Framework open-source altamente produtiva para o desenvolvimento de aplicações que correm de igual forma nos principais browsers (e no desktop através do Adobe Air)

36 Adobe Flex Composto por: Adobe Flex SDK (Open Source) Adobe Flex Builder 3 (standard e professional) Flex SDK Flex Builder IDE MXML ActionScript Flex Class Library Debuggers

37 Adobe Flex SDK O Adobe Flex SDK é Open Source: Composto por: Linguagens : Actionscript 3 MXML Compiladores Debuggers Extensa biblioteca de componentes e ferramentas Pode ser usado com outros IDEs além do Flex Builder (ex.: FlashDevelop: - open-source)

38 Adobe Flex Builder 3 Características: IDE baseado em Eclipse Possui uma panóplia de funcionalidades que aceleram largamente o desenvolvimento Design view e Code View Disponível em duas versões: standard e profissional Gratuíto para estudantes e desempregados

39 Como funciona Flex Builder IDE Browser Flex SDK MXML ActionScript Flash Player Flex Class Library SOAP HTTP/S AMF/S RTMP/S Compile Web Server XML/HTTP REST SOAP Web Services LC Data Services J2EE Application Server Existing Applications & Infrastructure

40 O nosso workflow Prototipagem: Balsamiq, Adobe Photoshop e Adobe Fireworks Desenvolvimento de frontend: Adobe Flex Framework MATE (IoC) Design Patterns, MVC Comunicação entre cliente e servidor: Arquitectura SOA, através de RPC em Flash Remoting ou Web Services Desenvolvimento de backend: JAVA, Spring, e BlazeDS ou WebORB Unit Testing, Maven, Hudson, [...] Colaboração: SVN + Trac + Mylyn SCRUM

41 Próximos passos: Flex Profissional gratuíto para estudantes: Download do Flex Builder Trial: Download do Flex SDK: Download do FlashDevelop (IDE open-source): Acompanhar as novidades (em Português): Colocar questões, conhecer mais RIA developers: A maior comunidade de Flex do mundo (em Inglês):

42 Questões?