Como converter um Saas web em um APP mobile?

Para usuarios avançados é super normal acessar um Saas web no celular digitando o endereço no navegador, mas para a grande maioria dos usuários isso nao é nada fácil.

Mesmo oferecendo treinamento e o atalho no celular para abrir o Saas web, ainda existe muita resistência. Para android fica um pouco mais prático, pois é possível adicionar um icone de atalho para abrir o Saas, mas no IOS essa tarefa não é tão fácil.

Existem alguns serviços disponíveis na internet que oferecem a criação de um APP na Apple Store e Play Story que acessará o seu Saas. Porém existe um custo mensal alto, limitações e outros pontos negativos como a divulgação do nome dessa ferramenta junto com o seu APP. Por isso acredito que o ideal seria conseguir uma solução própria.

Segue uma lista de serviços que oferecem essa solução:

No momento estou estudando soluções de como resolver o caso utilizando o Android Studio. Mas ainda sem solução para o IOS.

Meu objetivo com essa publicação é criar um espaço com informações relevantes para ajudar outros desenvolvedores e empresários que precisam desta solução.

Irei atualizar nos comentários minha evolução na busca dessa solução e os caminhosque utilizei. Serão informações que acredito que poderão contribuir.

Obrigado por ter lido até aqui.

dealmeida há 30 dias

boa noite, sr.

o sr terá de utilizar o capacitor. provavelmente, converta.app e webtoapp.design vendem um PWA em um invólucro empacotado pelo capacitor.

sim. os comandos são bem simples. reserve os arquivos estáticos do site (dá para conseguir isso manualmente para qualquer site, ou mapeando a tree por fetch. o teu navegador deixa isso salvo e te apresenta nas ferramentas de desenvolvedor), registra um service worker à página, e vc poderá criar um PWA, e daí vc consegue empacotar isso pelo capacitor. além disso, conseguirá alcançar as APIs nativas. não, não precisa de ionic. além disso, será um app distribuível pela google play store e pela apple store. se vai ser aceito ou não pela apple, é outros quinhentos. se ionic conseguiu no ios com capacitor, por que vc não conseguiria com PWA misturado com capacitor? safari que se acostume.

capacitor cria um projeto no Android Studio para ti.

vc pode criar um PWA para qualquer site, basta registrar o service worker (que não é obrigatório para o capacitor, pois ele só precisa de arquivos estáticos).

ou seja, essas soluções criam um PWA para vc E/OU empacotam os arquivos estáticos do teu site através do capacitor, ou até mesmo o antigo cordova (que nunca tentei). se houver outra forma que desconheço, então apresente-nos.

eu já falei várias vezes aqui no tab sobre o uso de PWAs.

capacitor cria o pacote .APK ou .AAB para vc no Android Studio, com web view para o chromium (ou nativo do android, a depender do service worker registrado se PWA ou dependentemente do dispositivo hospedeiro).

o bom de utilizar PWA é que é bem mais simples e dinâmico.

considere-se uma plataforma que atende várias barbearias. a depender da URL https://tuagenda.com/[NOMEDABARBEARIA] vc poderia criar um PWA personalizado. basta registrar dinamicamente o service worker na própria página, conforme a rota. dá para fazer isso no sveltekit, fazendo o service worker acessar o localStorage (ou indexedDB) preenchido pelo client side ao executar a função especial load do layout da rota. assim, os clientes da barbearia Cabeludos poderia ter uma logo específica, um nome de app específico, e paleta de cores específica. caso queira algo mais além, colocando na google play, colocando o capacitor para rodar, vc pode criar um script que automatiza o processo de criar projeto do capacitor, gerar projeto do android studio, produzir pacote para APK ou AAB, e depois colocar numa fila para tenrar subir na google play. como apple store é outros quinhentos, boa tentativa amanhã de manhã às 2h00 (caso vá madrugar)

porém, o caminho talvez seja o capacitor.

não terceirize tuas decisões e tuas liberdades para essas ferramentas. elas não são para o público mais técnico, e sim para o teu cliente. tenha mais liberdade e procure adicionar vc mesmo um PWA e depois configurar o capacitor. ou não. pague por uma solução talvez mediana e inferior àquilo que vc teria tido acesso.

vamos ver quem vai produzir isso primeiro.

atualize-nos! primeira vez que vejo alguém fazer uma pergunta direta cuja resposta já falei dezenas de vezes aqui nesta plataforma. acho que devemos implementar um sistema de pesquisa no tab mais eficiente.

Multi há 30 dias

Muito obrigado pela interação. Não tenho o conhecimento dos termos e tecnologias que você mencionou, mas seu texto foi muito claro. Vou pesquisar sobre cada termo que não conheço e tentar achar uma solução que funcione bem. Concordo plenamente com você sobre não terceirizar as decisões e liberdades para as ferramentas. Acho que esse caso é ainda mais restritivo. No caso da minha demanda, no primeiro momento seria necessário que o APP armazenasse apenas o URL do Saas web e armazenasse localmente os dados de login do usuário. Dessa forma o usuário terá uma facilidade muito grande para abrir o Saas e acessar o dashboard/home para visualizar as informações. Em um segundo momento, seria bom evoluir o app para enviar notificações ao APP. Com certeza vou atualizar esse post sobre todos os avanços que conseguir. Acho que irá ajudar bastante. Também acho que o sistema de pesquisa no tabnews poderia ser melhor. Por ficar oculto no menu flutuante acho que ele oferece pouca usabilidade. Mas essa ferramenta é fantástica. Impressiona muito a velocidade com que chegam as respostas e principalmente a qualidade dos conteúdos. Muito obrigado mesmo por ter participado. Gratidão.

tiagoo há 30 dias

Você pode usar o PWA Builder - um projeto da Microsoft para adaptar páginas web à tecnologia PWA e exportar para as lojas de aplicativos.

Nos dispositivos Android o seu app deve funcionar bem. A principal barreira será o IOS, já que a Apple não vai aceitar o seu app se ele não funcionar tal qual um app de verdade - o que acho válido, já que força os desenvolvedores a criarem experiências de uso melhores para os usuários.

Apps PWA funcionam bem no Android porque o app usa o Chrome que tem um bom suporte a essa tecnologia. No caso do IOS, o Safari limita muitas das funcionalidades destas aplicações.

Multi há 30 dias

Olá Tiago! No meu caso o nosso Saas já está bem otimizado também para o Safari, então não seria um problema. E para facilitar, o APP deverá apenas abrir o URL do SaaS com os dados de login do usuário, que ficariam armazenados após seu primeiro acesso pelo APP. Acho que esse recurso, apesar de muito simples, já é de grande valor para os usuários que possuem resistência em acessar o SaaS no navegador do celular. Já notei também, que é uma forma de agregar mais valor ao SaaS, de oferecer o APP nas lojas de aplicativos. Mesmo que seja simplesmente para abrir um URL. Ainda não estudei sobre o PWA Builder da Microsoft, mas irei pesquisar mais. Por enquanto estou pesquisando e testando o Android Studio, utilizando o componente WebView. Objetivo simples de abrir o sistema web através do aplicativo móvel. Vou postar as atualizações nos próximos dias. Obrigado pela interação.

Loumad há 30 dias

Dê uma olhada em Webview com Flutter, super simples, rapido pra implementar e funciona bem tanto pro android quanto iOS. Inclusive, já apliquei essa solução em alguns projetos com sucesso.

Multi há 30 dias

Como mencionei serviços externos e o seu custo adicional, acho que vale ressaltar que para publicar um APP por conta própria existe um custo na Play Store de US$25 para criação da conta de desenvolvedor, e direito a publicações ilimitadas.

Já na Apple Store, existe um custo de U$99/ ano para manter a conta de desenvolvedor ativa.