Connect with us

Draftbit Revisão: Como Eu Criei um Rastreador de Hábitos Rápido e Fácil

Ferramentas de IA 101

Draftbit Revisão: Como Eu Criei um Rastreador de Hábitos Rápido e Fácil

mm

Unite.AI is committed to rigorous editorial standards. We may receive compensation when you click on links to products we review. Please view our affiliate disclosure.

A daily habit tracker displayed on a screen.

Você já teve uma grande ideia de aplicativo, mas se sentiu preso porque construí-lo parecia muito complicado ou lento?

Recentemente, eu usei o Draftbit para criar um rastreador de hábitos diários completamente funcional. O que mais me impressionou foi como rapidamente eu passei da ideia para um protótipo funcionando, ainda tendo controle total sobre o código.

Nesta revisão do Draftbit, discutirei os prós e contras, o que é, para quem é melhor e suas principais características. Em seguida, mostrarei como usei para gerar e personalizar um rastreador de hábitos diários.

Concluirei o artigo comparando o Draftbit com minhas principais alternativas (Base44 e Softr). Ao final, você saberá se o Draftbit é adequado para você!

Veredito

Draftbit é uma plataforma de baixo código que constrói rapidamente aplicativos nativos para iOS e Android, exporta código React Native e usa componentes personalizáveis com IA e ajuda de especialistas opcional. É rápido e flexível para equipes e desenvolvedores. No entanto, iniciantes podem achar difícil, pois as características complexas podem ser desafiadoras.

Prós e Contras

  • Construtor de arrastar e soltar para aplicativos iOS e Android sem codificação
  • Exporta código React Native limpo para propriedade e personalização total
  • Cria protótipos e MVPs em horas ou dias (não semanas)
  • Biblioteca grande de componentes UI reutilizáveis e personalizáveis
  • Visualiza aplicativos ao vivo em dispositivos móveis
  • Integrações fáceis com APIs e serviços de terceiros, como Firebase, Airtable e Supabase
  • Adiciona JavaScript personalizado e componentes avançados
  • Colabora em espaços de trabalho compartilhados com base em acesso
  • Flexível para startups, agências e desenvolvedores que precisam de velocidade e controle
  • Combina assistência de IA com ajuda de especialistas opcional
  • Curva de aprendizado acentuada
  • Animações ou fluxos de trabalho complexos podem exigir ferramentas ou codificação extras
  • Principalmente para aplicativos móveis nativos, não para projetos web-first
  • Pode sobrecarregar usuários sem formação em design
  • Algumas características podem ser desajeitadas

O que é Draftbit?

Draftbit é um construtor de aplicativos móveis sem código que projeta e constrói aplicativos móveis para iOS e Android sem escrever código. Ele tem uma interface de arrastar e soltar para criar layouts de aplicativos rapidamente, enquanto gera automaticamente o código fonte React Native. Isso permite que você tenha controle total sobre o código do aplicativo para personalização ou desenvolvimento adicional.

Em vez de gastar semanas configurando a estrutura de navegação básica para um aplicativo móvel, o Draftbit cria um protótipo funcional com várias telas, navegação e conexões de API em questão de horas. A curva de aprendizado existe, mas é mais como aprender a dirigir em vez de aprender a construir um carro do zero.

Origens e O que Torna o Draftbit Especial

Fundado em 2017 por uma equipe de desenvolvedores que se frustraram com quanto tempo o desenvolvimento móvel leva, Draftbit começou como uma maneira de preencher a lacuna entre ferramentas de design e código. Os fundadores notaram que a maioria das plataformas sem código produz código bagunçado ou trava você em seu ecossistema para sempre.

A abordagem do Draftbit é diferente: você pode exportar seu código React Native e entregá-lo a uma equipe de desenvolvedores a qualquer momento. Isso é enorme para empresas preocupadas com a dependência da plataforma.

Além disso, o editor visual se sente mais como Figma do que os tradicionais construtores de sites. Isso provavelmente explica por que muitos designers se aproximaram dele.

Para Quem o Draftbit é Melhor?

Aqui estão os tipos de pessoas para as quais Draftbit é melhor:

  • Desenvolvedores e empreendedores de aplicativos móveis podem usar o Draftbit para construir aplicativos para iOS e Android.
  • Equipes podem usar o Draftbit para construir aplicativos juntos em uma plataforma de baixo código, mantendo o controle total do código fonte.
  • Designers podem usar o Draftbit para trabalhar em uma interface de arrastar e soltar que se sente semelhante ao Figma.
  • Agências e organizações podem usar o Draftbit para colaborar em espaços de trabalho compartilhados com equipes e integrações de API.
  • Indivíduos tecnicamente aptos podem usar o Draftbit para trabalhar com JSON, REST APIs e React Native.
  • Projetos que precisam de protótipos rápidos podem usar o Draftbit para se mover rapidamente da ideia para o lançamento com publicação de um clique.
  • Quem quer a propriedade total do código pode usar o Draftbit para exportar o código React Native para personalização ou entrega ao desenvolvedor.

Recursos Chave do Draftbit

Aqui estão os recursos principais do Draftbit:

  • Construtor de Aplicativos Visuais: Arraste e solte para projetar aplicativos iOS e Android sem codificação.
  • Exportação de Código Fonte: Baixe o código React Native limpo para controle total.
  • Previsões Instantâneas: Teste seu aplicativo em dispositivos em tempo real com um código QR.
  • Biblioteca de Componentes: Use blocos UI pré-construídos, modelos e modo escuro/claro.
  • Integrações de API: Conecte facilmente a APIs REST, Airtable, Supabase e mais.
  • Código Personalizado: Adicione JavaScript, componentes JSX e pacotes de terceiros.
  • Navegação e Ações: Estilos de navegação incorporados e gatilhos.
  • Colaboração em Equipe: Trabalhe juntos com espaços compartilhados e permissões.
  • Prototipagem Rápida: Construa MVPs em horas ou dias.
  • Publicação de Um Clique: Implante em lojas de aplicativos ou na web.
  • Assistência de IA: Obtenha ajuda da IA para acelerar o desenvolvimento.
  • Lógica Avançada: Construa fluxos de trabalho e ações multietapa.
  • Design Responsivo: Estilos de layout que se adaptam a qualquer tela.

Como Usar o Draftbit

Aqui está como eu usei o Draftbit para gerar e personalizar um rastreador de hábitos diários:

  1. Criar uma Conta
  2. Ajuda de Especialista (Opcional)
  3. Criar um Projeto
  4. Adicionar um Nome e Descrição
  5. Adicionar Detalhes do Projeto
  6. Escolher um Ponto de Partida
  7. Escolher um Ícone de Aplicativo
  8. Personalizar Componentes
  9. Visualizar Telas do Aplicativo
  10. Acessar Componentes
  11. Adicionar um Componente
  12. Editar Componentes
  13. Definir Projeto ao Vivo

Etapa 1: Criar uma Conta

Começando com o Draftbit.

Eu comecei indo para draftbit.com e selecionando “Get Started” no canto superior direito.

Etapa 2: Ajuda de Especialista (Opcional)

Draftbit oferecendo ajuda humana de especialista para construir um aplicativo.

Depois de criar uma conta e compartilhar meus detalhes e objetivos com o Draftbit, eles perguntaram se eu queria trabalhar com um especialista para acelerar meu projeto.

Eu nunca vi um construtor de aplicativos de IA oferecer isso, então apreciei a combinação única de automação de IA com suporte humano real (especialmente para usuários não técnicos). Eu cliquei em “Não, obrigado”, mas se você sentir que precisa de ajuda de especialista humano, aproveite!

Etapa 3: Criar um Projeto

Criando um novo projeto no Draftbit.

A partir daí, eu fui levado ao meu painel de controle do Draftbit. Tudo era simples e claramente disposto, com a navegação à esquerda, projetos no centro e as últimas atualizações sobre o Draftbit abaixo dos meus projetos.

Eu selecionei “Criar Meu Primeiro Projeto.”

Etapa 4: Adicionar um Nome e Descrição

Dando um nome e descrição ao meu projeto do Draftbit.

Em seguida, o Draftbit perguntou qual era o nome do meu aplicativo e para fornecer uma descrição do projeto. Eu dei ao meu aplicativo o nome “HabitForge” com a seguinte descrição:

“Um aplicativo móvel gamificado para ajudar os usuários a construir e rastrear hábitos diários, definir metas pessoais, ganhar badges e celebrar o progresso por meio de desafios divertidos e barras de progresso visuais. Projetado para empoderar a auto melhoria com cartões elegantes, notificações e integração com dispositivos vestíveis para rastreamento de hábitos sem esforço.”

Você pode alterar o nome e a descrição do seu aplicativo mais tarde, então não se preocupe muito com isso. Eu selecionei “Próximo” para continuar.

Etapa 5: Adicionar Detalhes do Projeto

Informando ao Draftbit sobre o backend que eu usarei, o tipo de aplicativo e como eu planejo implantar o aplicativo.

Em seguida, eu tive que informar ao Draftbit mais sobre o meu projeto. Isso incluiu fornecer as seguintes informações:

  • O backend a ser usado para o meu projeto (Xano, Bubble, Supabase, etc.)
  • O tipo de aplicativo (áudio, negócios, criptomoeda, etc.)
  • Como eu planejava implantar o meu aplicativo (lojas de aplicativos, web, PWA, etc.)

Considerando que eu queria criar um aplicativo de rastreamento de hábitos, eu escolhi “Saúde e Fitness” como o tipo de aplicativo que eu estaria criando. Eu não sabia sobre o backend ou como eu implantaria o aplicativo, então eu disse que não sabia.

Etapa 6: Escolher um Ponto de Partida

Escolhendo um modelo de treino para trabalhar a partir do Draftbit.

A partir daí, o Draftbit perguntou como eu queria começar a construir o meu aplicativo. Ele apresentou modelos que variavam de aplicativos de namoro a aplicativos de treino.

Eu selecionei o aplicativo de treino, pois se adequava mais ao meu projeto e cliquei em “Próximo” para continuar.

Etapa 7: Escolher um Ícone de Aplicativo

Escolhendo um ícone de aplicativo no Draftbit.

Em seguida, eu fui solicitado a escolher um ícone de aplicativo e cor (isso pode ser alterado mais tarde). Eu gostei da combinação do emoji de marcação preta e fundo amarelo.

Etapa 8: Personalizar Componentes

Alterando o estilo de elementos no Draftbit.

Alguns minutos depois, o meu aplicativo foi criado!

Para começar, eu cliquei em diferentes componentes dentro da pré-visualização para fazer edições estilísticas no painel direito.

Etapa 9: Visualizar Telas do Aplicativo

Visualizando as diferentes telas do aplicativo criadas pelo Draftbit.

No painel esquerdo, eu selecionei “Telas”. Eu podia clicar em todas as telas do meu aplicativo para fazer edições.

Etapa 10: Acessar Componentes

Adicionando blocos a um aplicativo criado com o Draftbit.

O Draftbit vem com componentes pré-construídos que realmente parecem decentes fora da caixa. Estamos falando de botões, cartões, listas, formulários (tudo o que você normalmente gastaria dias estilizando).

Para acessar esses componentes, eu fui para Blocos (abaixo de “Telas”) no canto superior esquerdo e cliquei no “+”.

Acessando a galeria de blocos no Draftbit.

Quando selecionei o “+”, eu tive a opção de adicionar um bloco em branco ou acessar a Galeria de Blocos. Eu escolhi a Galeria de Blocos.

Etapa 11: Adicionar um Componente

Importando um bloco para um aplicativo feito com o Draftbit.

A Galeria de Blocos forneceu uma ampla gama de componentes que eu podia adicionar ao meu aplicativo (serviços, perfis, imagens, etc.) Eu pairei sobre um desses componentes (um cartão de imagem) para importá-lo.

Um cartão de imagem adicionado à minha biblioteca de blocos no Draftbit.

Uma vez importado, o componente que eu escolhi foi adicionado à minha biblioteca de blocos!

Adicionando um bloco a um aplicativo criado com o Draftbit.

Para adicionar o bloco ao meu aplicativo, eu fui para a página onde eu queria adicioná-lo e selecionei o ícone “+” no painel de Componentes. Isso abriu uma nova janela onde eu podia adicionar “Bits” (elementos pequenos, como ícones e botões) ou “Blocos” (onde o meu cartão de imagem estava armazenado).

Eu pairiei sobre o meu cartão de imagem e o adicionei ao meu aplicativo.

Etapa 12: Editar Componentes

Personalizando um bloco de imagem que foi adicionado a um design de aplicativo criado com o Draftbit.

O meu cartão de imagem foi adicionado ao meu aplicativo! Eu agora podia selecioná-lo e editá-lo como eu queria.

Etapa 13: Definir Projeto ao Vivo

Publicando um projeto feito no Draftbit.

Uma vez que eu estava satisfeito com como tudo parecia, eu fui para “Definir Projeto ao Vivo” no canto superior direito.

Essas são as bases de como usar o Draftbit para gerar um aplicativo com uma descrição simples e como você pode começar a personalizá-lo. O Draftbit é mais técnico do que outros geradores de aplicativos de IA, então, se você precisar de ajuda, contrate um especialista em Draftbit.

No geral, o Draftbit tornou fácil transformar minha ideia em um aplicativo funcional com um fluxo de etapas claro. Eu gostei da combinação de automação de IA com a opção de suporte humano real, tornando o processo todo flexível e acessível.

3 Principais Alternativas do Draftbit

Aqui estão as melhores alternativas do Draftbit:

Base44

A primeira alternativa do Draftbit que eu recomendaria é o Base44. É uma plataforma de baixo código de IA que constrói aplicativos funcionais descrevendo sua ideia. Ele constrói a interface do usuário, o backend, o banco de dados e os fluxos de trabalho automaticamente. Edições são feitas por meio do chat de IA ou do editor visual sem habilidades avançadas necessárias.

O Base44 usa IA para automatizar a configuração do backend e frontend com hospedagem incorporada. Isso torna o Base44 ótimo para aplicativos web e MVPs rápidos.

Enquanto isso, o Draftbit se concentra mais em projetar visualmente aplicativos móveis com o React Native por trás. Você obtém a exportação completa do código fonte e a publicação de um clique nas lojas de aplicativos.

Escolha o Draftbit para criar aplicativos móveis com controle de design detalhado, exportação de código e implantação na loja de aplicativos. Caso contrário, escolha o Base44 para criar rapidamente aplicativos web de pilha completa com prompts de IA, serviços backend e hospedagem.

Leia minha revisão do Base44 ou visite Base44!

Softr

A próxima alternativa do Draftbit que eu recomendaria é o Softr. É uma plataforma sem código para construir rapidamente aplicativos web, ferramentas internas e portais de cliente a partir de dados existentes.

Por um lado, o Softr se destaca na construção de aplicativos web e portais com integração de banco de dados fácil e uma interface de usuário amigável. Ele também inclui gerenciamento de membros e usuários incorporado que é mais fácil de configurar do que o Draftbit.

Enquanto isso, o Draftbit se concentra em gerar aplicativos móveis com exportação de código React Native, flexibilidade de design semelhante ao Figma e entrega de código para desenvolvedores.

Escolha o Draftbit para construir facilmente aplicativos móveis que sejam personalizáveis, exportáveis e amigáveis para desenvolvedores. Caso contrário, escolha o Softr para criar rapidamente aplicativos web e ferramentas internas com integração de dados e gerenciamento de usuários.

Leia minha revisão do Softr ou visite Softr!

Revisão do Draftbit: A Ferramenta Certa para Você?

No geral, o Draftbit tornou fácil transformar minha ideia em um aplicativo móvel completamente funcional. Eu apreciei o fluxo de etapas claro, a combinação de automação de IA e a opção de suporte humano real.

Para qualquer um que busque controle total sobre o design e o código do aplicativo, enquanto ainda acelera o desenvolvimento, o Draftbit é uma escolha excelente. Caso contrário, você pode querer considerar essas alternativas:

  • Base44 é melhor para criar rapidamente aplicativos web de pilha completa e MVPs com IA.
  • Softr é melhor para construir aplicativos web, ferramentas internas ou portais de cliente com integração de banco de dados fácil e gerenciamento de usuários.

Obrigado por ler minha revisão do Draftbit! Eu espero que tenha sido útil.

O Draftbit oferece um plano gratuito que vem com tudo o que você precisa para começar a construir seu aplicativo. Tente por si mesmo e veja como você gosta!

Perguntas Frequentes

O Draftbit é gratuito?

O Draftbit oferece um plano gratuito para começar a desenvolver seu aplicativo. O plano gratuito inclui acesso a todos os recursos de construção principais, suporta até 5 telas por projeto, projetos de rascunho ilimitados e imagens geradas por IA, mas tem limitações na publicação.

O Draftbit é bom?

O Draftbit é um construtor de aplicativos móveis de baixo código para prototipagem rápida com exportação completa do código React Native. Sua interface de arrastar e soltar é fácil para usuários tecnicamente aptos, embora algumas características possam ser complicadas. É perfeito para desenvolvedores e equipes que desejam design visual com controle de código.

Onde fica a sede do Draftbit?

A sede do Draftbit está localizada em Chicago, Illinois, EUA.

O Draftbit é sem código?

Sim, o Draftbit é uma plataforma sem código para construir aplicativos móveis com uma interface de arrastar e soltar visual.

Janine Heinrichs é uma Criadora de Conteúdo e Designer que ajuda criativos a otimizar seu fluxo de trabalho com as melhores ferramentas de design, recursos e inspiração. Encontre-a em janinedesignsdaily.com.