responsive-blog

Design responsivo, Desenvolvimento Nativo e App Híbrido, quando usar?

Na era do mobile tem muita gente falando sobre design responsivo, aplicativo híbrido, desenvolvimento nativo e assuntos relacionados. Neste post vou explicar um pouco como isso tudo funciona e prós e contras de cada escolha.

Vamos começar entendendo como tecnicamente as coisas são feitas para cada tipo:

Desenvolvimento nativo

É quando o aplicativo é desenvolvido usando os recursos da plataforma. No caso de iOS (iPhone, iPad) usa-se a linguagem de programação Objective-C , o framework de desenvolvimento Cocoa Touch e a ferramenta Xcode. Para Android usa-se a linguagem Java com o Android SDK na ferramenta Eclipse + ADT e no Windows Phone a linguagem C#, Windows Phone SDK no Visual Studio.

Optar por desenvolvimento nativo é mais caro, pois é necessário desenvolver um novo código para cada plaforma. Mas também o resultado final é melhor, pois o aplicativo funcionará mais fluído e melhor integrado com os recursos de cada plataforma.

A maioria dos aplicativos que desenvolvemos na Jera são nativos.

Design Resposivo

É uma técnica de desenvolvimento para que aplicativos Web se adaptem a várias resoluções de telas. Se você acessar o site da Jera de um smartphone, tablet e PC você vai perceber como o conteúdo se adapta a cada resolução.

Isso é possível desenvolvendo o código do site ou do aplicativo Web usando técnicas que combinam HTML5, CSS e JavaScript de forma que mudanças na resolução da tela forçam o conteúdo a se adaptar.

Eu recomendo que qualquer desenvolvimento para Web faça uso desta técnica para permitir que o acesso por meio de dispositivos móveis possa ser mais confortável. Só pra dar uma ideia, 50% de todos os acessos ao site da Jera vêm de dispositivos móveis rodando iOS, Android ou Windows Phone.

Não ter um website responsivo hoje é sinônimo de perder clientes.

Aplicativo Híbrido

Aplicativo híbrido é um misto de desenvolvimento nativo e design responsivo. Normalmente é desenvolvido usando HTML5CSS e JavaScript e exibido em um Webview, que é um Navegador Web embutido dentro do aplicativo.

Tem algumas vantagens como menor custo de desenvolvimento e desvantagens como limitações para funcionamento off-line e performance.

Existem também alguns frameworks que facilitam esse tipo de desenolvimento como PhoneGap e Titanium. Nós já fizemos alguns apps e protótipos usando essas tecnologias, mas não vimos grandes vantagens em termos de custo e complexidade técnica.

.:.

Em suma, cada situação tem sua aplicação e suas limitações, por isso fiz uma tabela para deixar mais fácil esse entendimento:

Estratégia Prós e contras Quando usar
Desenvolvimento Nativo
  • Melhor uso dos recursos da plataforma
  • Melhor perfomance e funcionamento off-line
  • Maior custo de desenvolvimento e manutenção
App com uso intenso de GPS, recursos off-line (sincronização), câmera, notificação push e acelerômetro
Design Responsivo
  • Mesmo código entre plataformas diferentes
  • Maior liberdade de design, menor imposição dos padrões de design
  • Menor custo e complexidade, limitações para funciomento off-line e uso de recursos da plataforma
Website com funcionamento mobile, administração do app ou website, páginas de compartilhamento em redes sociais
Aplicativo Híbrido
  • Compartilhamento de boa parte do código entre plataformas
  • Possibilidade do uso de recursos da plataforma com código nativo
  • Menor custo, porém pode acrescentar complexidade, limitações de design e performance
Redução do custo para desenvolvimento nativo usando alguns recursos (push e câmera por ex.), aproveitamento de código já existente

É isso, se tiver alguma dúvida ou quiser discutir algum ponto, fique à vontade para deixar seu comentário!

Publicado por

Saulo Arruda

É co-fundador e CEO da Jera. Suas áreas de interesse são desenvolvimento mobile, métodos ágeis, lean startup, métricas e gestão. Nas horas vagas gosta de pedalar, cozinhar, ver filmes de animação com as filhas e tocar um bom rock'n roll na sua guitarra.

  • Ramiro

    Boa tarde, gostaria da ajuda de vcs para esclarecer uma duvida que eu tenho sobre um assunto relacionado ao post… A duvida é a seguinte, em um aplicativo híbrido eu devo usar design responsivo para me adaptar aos diferentes tipos de resoluções? Desde já, muito obrigado.

    • Agora entendi melhor. No caso do uso de PhoneGap o próprio framework já te direciona para desenvolver de forma “mobile”, não sendo necessário fazer responsivo nesse caso. Porém, dependendo das integrações com recursos específicos do celular, esse código pode não funcionar corretamente em navegadores como o Chrome ou Safari. Abraços!

      • Ramiro

        Isso, essa era minha dúvida!! Eu tive problemas aqui em alguns testes, mas acho q foi pq eu editei algumas propriedades que não devia nos componentes criados pelo framework rsrs e acabei pensando, que talvez fosse preciso usar design responsivo no desenvolvimento híbrido. Muito obrigado pelo esclarecimento, pois somente em pesquisas não consegui tirar essa dúvida específica. E a propósito, parabéns pelo artigo, muito bem escrito e pela prontidão em ajudar. Valeuu, sucessos!

  • O Ramiro, não é obrigatório, mas facilita as coisas. Só que existem casos em que transformar um site em responsivo dá mais trabalho que fazer uma nova versão mobile, então é uma questão de custo-benefício. Se não fui claro, fique à vontade para continuar a discussão. Abraços!

  • Ramiro

    Primeiramente muito obrigado pela atenção e agilidade no retorno! Eu acho que entendi a situação que tu exemplificou, e talvez minha dúvida seja um pouco mais específica, no caso, eu falo na construção de um app híbrido desde o inicio com o intuito de ser um aplicativo e não uma versão mobile de site. Usando html5,css,javascript e um framework(phonegap ou similar). Em um caso desses é aconselhável aplicar o Design Responsivo? ou o framework ajuda nisso e cria os componentes visuais de alguma maneira em que eles se ajustem aos diferentes tipos de resoluções? Desculpe se minha pergunta foi repetitiva, mas é que não havia ficado tão claro pra mim. Muito obrigado.

  • Pingback: Como lançar o seu primeiro aplicativo no mercado?()