PplWare Mobile

Desenvolvimento de Aplicações Móveis com HTML5


Pedro Pinto

Pedro Pinto é Administrador do site. É licenciado em Engenharia Informática pelo Instituto Politécnico da Guarda (IPG) e obteve o grau de Mestre em Computação Móvel pela mesma Instituição. É administrador de sistemas no Centro de Informática do IPG, docente na área da tecnologia e responsável pela Academia Cisco do IPG.

Destaques PPLWARE

  1. Boa noite Pedro,

    O trabalho apresentado foi excelente

    Parabéns

    Já começei a desenvolver para Android e tenho bastante interesse no uso de HTML 5, CSS3 e JavaScript para o desenvolvimento de aplicações para sistemas operativos móveis como o Android e em breve o Firefox OS.
    Estou a acompanhar esse assunto com bastante interesse

    Cumprimentos
    César Oliveira
    http://www.profissionalweb.net

  2. Já agora duas questão:

    Porque no HTML do 1º exemplo não usou as tags form visto que se tratava dum formulário

    Segunda questão: Porque em vez de usar o evento onClick() no HTML para chamar a função JavaScript não usou a forma mais adequada com uma função onLoad no JavaScript que chamaria essa função JavaScript para processar o formulário

    Ficam essas duas questões

    Cumprimentos
    César Oliveira
    http://www.profissionalweb.net

    • João Dias says:

      Também reparei nisso.
      Talvez tenha sido por causa do tutorial, para ser mais rápido.

    • Nuno Nunes says:

      Boa noite

      Os exemplos apresentados estavam feitos na internet e como a apresentação era de tempo limitado usei esses exemplos. Mas as sugestões que deu são boas e para levar em consideração em futuras aplicações.
      Obrigado

  3. David says:

    Ola , parabens pela iniciativa!

  4. JP (djlinux) says:

    Que inspiração Pedro Pinto, muito bom. Obrigado por este excelente artigo, muito bem explicado.

    Já agora deixo aqui o meu contributo : goo.gl/cSBJQ

  5. Miguel says:

    Gostei da parte de terem falado sobre o PhoneGap, visto que é muiti plataforma, embora o artigo seja maioritariamente virado para Android.

    Uma grande Vantagem do HTML5 no mundo mobile é ser multiplataforma e o PhoneGap facilita as coisas, já agora deixo a sugestão de que o PhoneGap também é suportado na nova plataforma Blackberry, mas além disso podem desenvolver com com o Webworks (https://developer.blackberry.com/html5/).

  6. Paulo says:

    Mobello Studio é uma IDE para o Eclipse para desenvolver Web Apps e Web Pages. Facilita muito o trabalho aos developers. Utiliza o HTML 5 e CSS3 e outras mais.

    O link: http://mobello.github.com/studio/

  7. Shop says:

    Obrigado Pedro, muito bom.

  8. Raclima23 says:

    excelente artigo ao Nuno e ao Pedro venham mais tutoriais como este

  9. Armando says:

    Caros amigos, caso tenham interesse a MKF pode ajudá-los a melhorar ou a aprender qualquer linguagem de programação entre elas claro o HTML5 e JAVA para Android. estamos a v/disposição.

  10. Nuno says:

    Qual a versão do Eclipse que usam neste exemplo?

  11. Dan says:

    Um artigo interessante no entanto não são mencionadas as múltiplas limitações na utilização do HTML5 para a criação de aplicações moveis, tais como o limite de 50Mb para AppCache e BD, como o safari mobile limita ainda mais e necessita de autorizar mais do que 16Mb, etc etc etc… Infelizmente a Apple impõe uma série de restrições para que não possam competir com aplicações nativas e escapar ao pagamento de 30% a Apple 😉

    Existem ainda diferenças no suporte de certas APIs, etc… nem tudo é um mar de rosas e apesar do Phonegap ser interessante tb não permite eliminar todos estes problemas, especialmente porque deixas de ter a capacidade de desenvolver uma aplicação realmente HTML5 que corre em qualquer browser e passas a ter uma webview com um wrapper nativo e uma biblioteca JS que chama métodos nativos.

  12. DM says:

    Parabéns pelo artigo!

  13. João Dias says:

    Bom artigo.

    O meu workflow de desenvolvimento é diferente. Para desenvolver uma web app nunca vou directo ao Eclipse ou ao XCode.

    Faço-o através de um normal IDE (uso o Aptana Studio 3) e depois vou testando no simulador do iOS e em simuladores para Android. Não tenho a certeza, mas eu prefiro escrever primeiro para a web e testar, fazer debug, limar arestas primeiro, do que escrever apenas para Android.

    Isto porque na Web é possível usar ferramentas como o Web Inspect no Chrome/Safari e o Firebug para Firefox. Só depois de ter a aplicação a funcionar bem num browser para desktop (com as devidas adaptações para dispositivos móveis) é que faço a transformação com o Cordova, e nunca ao contrário. Já agora, a versão online do Adobe Cordova permite exportar a mesma aplicação para diferentes dispositivos. Mas isso nem sempre é recomendado.

    Uma dica muito importante: Já que estamos a lidar com dispositivos que já suportam aceleração por hardware, deixem o jQuery de lado e usem apenas CSS3 nas animações, gradientes e transições sempre que possível, porque o trabalho feito pelo GPU nesse campo é muito melhor que o que é feito no CPU (Javascript, jQuery, etc).

    “Uma das vantagens que se verifica é que, em termos de design ser mais fácil “desenhar” a nossa aplicação e através do JavaScript poderemos ter outras funcionalidades.”

    Eu não sei se concordo neste ponto. A facilidade de desenho é bastante subjectiva. Isto porque, e vou falar no meu caso, que é o meu trabalho, eu desenho aplicações. Ora, tendo a minha aplicação desenhada, tenho o trabalho de:

    a) Para aplicações nativas (iOS e Android)
    Exportar os assets todos, organizar e indicar ao developer onde estão e onde ficam os elementos.

    b) Aplicação Web
    Tenho que desenvolver o próprio CSS ou então estar constantemente a fornecer ao developer as propriedades de cada layer que exporto do Photoshop (ex: sombras, padrões, brilhos, bordas, cantos redondos, etc).

    Ou seja, acaba por ir dar tudo ao mesmo, no fim de contas. Para além de que, embora, em teoria seja mais fácil adaptar com media queries (CSS3) o layout de uma web app para iPhone e as três principais densidades do Android (MDPI, HDPI e XHDPI), isso leva a que tenhamos pouco controlo sobre os pixeis, o que é muito importante quando queremos ter uma aplicação web com toda a performance e usabilidade que uma nativa.

    Portanto, como designer, teria à mesma que desenvolver o layout para iOS (Normal/Retina) e Android(MDPI, HDPI e XHDPI).

    Já agora, a melhor aplicação web que conheço é esta:
    http://pattern.dk/sun/

    • João Dias says:

      Vão aqui duas frameworks excelentes para a criação de revistas e publicações em HTML5 para iPad:

      Baker Framework:
      http://bakerframework.com/

      Laker Compendium (baseada no Baker):
      http://www.lakercompendium.com/

    • T. Castro says:

      João, possivelmente o comentário mais informativo que já li no PPLware. Sugeria que enviasses um pequeno artigo, de tua autoria, ao pplware sobre boas práticas de Desenvolvimento Web, eu certamente que ia ler e colocar nos favoritos. O facto de te preocupares com CPU ou GPU processing demonstra a tua preocupação no processamento e usabilidade do que desenvolves. Os meus parabéns a ambos (autor do artigo e ao João Dias)

      • Dan says:

        A aceleração do CSS3 por GPU/CPU depende de browser e plataforma, assim como o tipo de animação que se está a realizar.

        Logo como tudo em HTML5 existe fragmentação de features.

    • Dan says:

      Boas João,

      Hum não me parece ser uma aplicação web… pois pede para correr em iOS, qual é o objectivo de ter uma aplicação web se depois só corre em iOS?

  14. Nuno Nunes says:

    Obrigado a todos 🙂

  15. Parabens, pelo artigo hein.
    Eu confesso que, aprendi a usar java e prefiro assim, mas nos dessa area temos que ter conhecimento das tendencias do mercado.

  16. T. Castro says:

    Nuno Nunes, um Tutorial fantástico, resumido, e extremamente prático para quem iniciar o desenvolvimento para Web (tipo eu, por exemplo). Juntas o teu trabalho, com o conhecimento prático do João (eficiencia e usabilidade), e tinham possivelmente um dos melhores artigos publicados para quem quer arrancar.

Deixe uma resposta

O seu endereço de email não será publicado.

You may use these HTML tags and attributes: <a href="" title="" rel=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

*

Aviso: Todo e qualquer texto publicado na internet através deste sistema não reflete, necessariamente, a opinião deste site ou do(s) seu(s) autor(es). Os comentários publicados através deste sistema são de exclusiva e integral responsabilidade e autoria dos leitores que dele fizerem uso. A administração deste site reserva-se, desde já, no direito de excluir comentários e textos que julgar ofensivos, difamatórios, caluniosos, preconceituosos ou de alguma forma prejudiciais a terceiros. Textos de caráter promocional ou inseridos no sistema sem a devida identificação do seu autor (nome completo e endereço válido de email) também poderão ser excluídos.