Criando aplicativos sem precisar programar

Alguns desenvolvedores podem ter um certo receio quando o assunto é criar aplicativos sem que haja a necessidade de escrever código, talvez por falta de ferramentas que façam o trabalho corretamente ou até mesmo por deixar de ter o controle sobre aquilo que está sendo produzido.

Confesso que pensava assim também, até que conheci o Windows App Studio, uma ferramenta online disponibilizada pela Microsoft para criar aplicativos Windows 10, a qual usei para fazer o aplicativo para Windows 10 do blog talkitbr (disponível em breve). Sem exagerar, levei cerca de 5 minutos para ter um aplicativo que lê um feed rss, lista os itens com um belíssimo layout, fornece uma tela de leitura para os posts e permite o compartilhamento em redes sociais e aplicativos. E o melhor, ainda pude baixar o código fonte em C#, que por sinal, é muito bem estruturado, com uma manutenibilidade simples e pronto para evolução.

E não é somente leitura de feed rss que o Windows App Studio fornece, ele é capaz de incluir dentro do aplicativo os seguintes conteúdos:

  • Rss
  • HTML
  • YouTube
  • Flickr
  • Bing
  • Facebook
  • Instagram
  • Twitter
  • Xbox Music
  • Touch Develop Script

Vamos então colocar a mão na massa (ou quase) e fazer um app para Windows 10 que funcionará em celulares, tablets e desktops.

Construindo um app

Para fazer o app que vamos mostrar, você vai precisar de:

  • Link de um rss

Isso mesmo, você só precisa de um link. Para o nosso exemplo, vamos usar o feed do talkitbr (https://talkitbr.com/feed).

Com o link em mãos vamos acessar o site do Windows App Studio (http://appstudio.windows.com/) e acionar o botão Comece agora!

AppStudio_Site

Escolha o sistema operacional Windows 10 e um template Empty App W10.

AppStudio_ChooseProject

Dê um nome para o seu aplicativo e escolha em qual dispositivo vai ser exibida a pré-visualização do app e acione o botão Start with this one!

Já temos um app! Por enquanto sem nenhum conteúdo. Então vamos criar uma seção de rss.

Entre com o nome da seção e a url do rss.

AppStudio_Add_rss

Já temos a nossa seção criada e uma previa de como vai ficar no dispositivo no canto direito. Note que já é possível navegar pelo aplicativo no preview. Acione o botão de edição na seção Posts.

Agora vamos editar o layout do aplicativo. Perceba que o aplicativo já está pronto, agora é só escolher a melhor interface. Escolha entre os layouts disponíveis e vá atualizando o dispositivo lateral para ver como está ficando. Escolha um modelo que mais lhe agrade.
AppStudio_edit_rss

No Detail Page definimos como será o layout da página de leitura dos posts. Note que essa página é opcional.

Pelos Bindings, fazemos o mapeamento entre os campos da tela com os campos do rss, que você pode ver na aba Data.

AppStudio_edit_rss_data

Salve o seu app e vá para a aba Themes. Escolha entre alguns temas prontos ou customize um do seu jeito.

AppStudio_edit_theme

Na aba Tiles adicionamos nossos Tiles e Splash.

Está disponível três tipos de tiles:

  • Flip template – O tile gira da frente para trás, oferecendo a inserção de dados adicionais.
  • Cycle template – Até nove imagens se alternam entre si.
  • Iconic template – Adiciona um ícone pequeno no centro do tile e incorpora dados adicionais, se necessário.

AppStudio_Tiles

Ainda precisamos alterar o logotipo do aplicativo. Clique na imagem do logo no canto superior esquerdo da tela, ao lado do nome do app.

AppStudio_logo

Por fim, na aba Settings vamos ajustar algumas configurações do app como idioma e descrição. Podemos ainda fazer a associação com a loja (pode ser feita a reserva do nome do aplicativo, por exemplo).

No final da página estão duas configurações extras importantes. Uma é para habilitar a página Sobre, com as informações do app para usuário, e quando selecionada habilita o botão de compartilhamento dentro do app, ou seja, o aplicativo já vai contemplar o compartilhamento em rede social. E a outra – mas não menos importante -, a habilitação do Ads, que permite adicionar propaganda dentro do aplicativo, sem precisar importar SDK algum.

AppStudio_Settings

O aplicativo está pronto. Caso queira adicionar mais seções dentro do aplicativo, volte para a aba Content e adicione mais Rss, YouTube ou qualquer outra disponível. Para gerar o aplicativo é só acionar o botão Finish que fica ao lado do botão de salvar.

O Windows App Studio exibe como está o app na família Windows 10 (Phone, Tablet e Desktop). Feito seus testes finais acione o botão Generate.

AppStudio_app_generate

Faça seus comentários finais, escolha sua versão de build e gere o app!

AppStudio_app_generate_2

Pronto! Temos o pacote para ser instalado/disponibilizado na loja e o código fonte.

Se você não é desenvolvedor e/ou não tem Visual Studio, é possível instalar o app pelo pacote.

AppStudio_app_ready

E foi assim que criamos o app do talkitbr. Se tiverem alguma dúvida mandem nos comentários.

Até logo!

Anúncios

5 comentários

  1. A maior dificuldade de criar um aplicativo nem sempre é o conhecimento de programação, mas a falta de informação para colocar no aplicativo. O que o usuário vai ler? O que eu quero fazer?

    Curtido por 2 pessoas

    • Olá Erval, infelizmente não é possível compilar para iOS e Android, o App Studio hoje só gera um aplicativo Universal Windows Platform (Windows 10) e Windows 8.1.

      Curtir

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s