Criação de aplicativos

A criação de um aplicativo no Tulip pode parecer intimidadora no início, mas depois que você se divide e entende os principais elementos, não é tão complicado. Os aplicativos combinam os seguintes princípios para criar uma nova peça de software: Design da interface do usuário, lógica e funções condicionais, dados e bancos de dados, análise e conexões com outros sistemas, dispositivos e máquinas. Neste guia, discutiremos os principais conceitos e as ferramentas de interface de que você precisa para criar aplicativos com sucesso. Lembre-se de que o Tulip é uma plataforma sem código, portanto, vamos nos concentrar nos recursos necessários para projetar aplicativos prontos para produção, independentemente de sua experiência em codificação.

Começaremos examinando a interface principal para visualizar seus aplicativos.

Criação e organização de aplicativos

Para visualizar todos os aplicativos em sua instância, navegue até a página de aplicativos em sua instância do Tulip acessando: [your-instance].tulip.co/group. Você também pode passar o mouse sobre a guia Aplicativos na barra de navegação superior e clicar em Aplicativos.

É nessa página que você visualiza os aplicativos que criou na sua instância, separados em App Groups, pastas para organizar uma coleção de aplicativos. Você também pode visualizar cada aplicativo dentro de grupos de aplicativos e outras pastas, como aplicativos recentes e favoritos, no painel de navegação do lado esquerdo.

Selecione um aplicativo existente em um grupo para visualizar e editar suas informações. Você também pode visualizar qualquer um dos seguintes dados do aplicativo:

• Etapas
• Análises
• Versões
• Conclusões
• Permissions
• {{glossário.Aprovação}}s

Para editar o aplicativo, clique no botão azul "Editar" no canto superior direito ou clique diretamente em uma etapa.

Para criar um novo aplicativo, navegue até a tela Aplicativos e clique no botão azul "Criar aplicativo" no canto superior direito. Você também pode clicar na pequena seta ao lado do botão para criar um novo grupo de aplicativos.

Selecione um modelo em branco ou um aplicativo em destaque predefinido e clique em "Create" (Criar) na parte inferior esquerda da janela. Esses modelos em destaque foram criados por outros usuários da Tulip para que outras pessoas tenham soluções rápidas para problemas, caso não queiram criar um aplicativo do zero. Você também pode editar esses modelos para personalizá-los de acordo com suas necessidades.

Quando for redirecionado para a tela de informações do aplicativo, dê um nome ao seu aplicativo e uma descrição. Rotular essas informações é útil para que você possa acompanhar o aplicativo independentemente do estágio do processo em que se encontra.

Clique no botão azul "Edit" (Editar) no canto superior direito para acessar a interface do App Editor.

Editor de aplicativos

O App Editor é onde você cria e edita o aplicativo. O diagrama a seguir mostra as diferentes partes que compõem o editor de aplicativos:

1. Adicionar etapa/grupo de etapas - Adicionar uma nova etapa ou grupo de etapas
2. Painel de etapas/registros - Visualize as etapas por meio da guia de etapas ou alterne para a guia de registros para visualizar as tabelas usadas
3. Espaço de trabalho - O espaço para criar a interface do aplicativo
4. Adicionar um Asset Widget - Adicione uma forma, um ícone ou um logotipo ao seu aplicativo
5. Adicionar um widget de botão - Adicione um botão ao seu aplicativo
6. Adicionar um widget de entrada - Adicione um campo de entrada ao seu aplicativo
7. Adicionar um widget de texto - Adicione uma caixa de texto ao seu aplicativo
8. Incorporar um widget - Incorpore uma variedade de widgets, como imagens, análises, atributos de máquina e muito mais
9. Adicionar widget de câmera - Adicione uma câmera comum ou um instantâneo de câmera de código de barras
10. Traduzir - O Tulip Player traduzirá automaticamente o aplicativo para o idioma selecionado por meio do seu perfil Tulip.
11. Create Snapshot (Criar instantâneo) - Salve uma versão atual do seu aplicativo, criando uma duplicata para que você possa testar várias versões sem a possibilidade de erro.
12. Testar - Teste seu aplicativo no modo de desenvolvedor
13. Executar - Execute seu aplicativo no Tulip Player
14. Publicar - Publicar seu aplicativo
15. Avançar/retroceder - Mova um elemento dentro do espaço de trabalho para frente ou para trás de outros elementos
16. Painel de acionamento - Defina acionadores, elementos estilísticos e informações em nível de aplicativo

Para obter uma visão geral detalhada do editor de aplicativos, visite Introdução ao Tulip App Editor.

Etapas

As etapas são as "páginas" do seu aplicativo, as várias telas que exibem conteúdo. Para adicionar uma etapa, clique no botão "Add Step" (Adicionar etapa), que mostra quatro opções:

• Etapas - Uma etapa normal que pode ser personalizada de acordo com suas necessidades ou por meio do uso de widgets
• Etapas de formulário e formulários de assinatura - Essas opções foram desativadas para novas instâncias após a versão 235.
• Grupos de etapas - Uma pasta de etapas para ajudar a organizar o aplicativo e realizar operações em massa, como reorganizar/duplicar etapas

As etapas podem ser lineares ou não lineares, ou seja, não precisam seguir consecutivamente umas às outras na ordem em que você as organiza. A lógica que você adicionar ao seu aplicativo determinará a transição das etapas.

Para obter um guia detalhado sobre como trabalhar com etapas, consulte uma coleção de artigos aqui: Etapas.

Layout básico

O layout base é o modelo que se aplica a cada etapa que você cria. A criação de um layout de base facilita a criação do aplicativo, com os elementos fundamentais adicionados automaticamente a cada etapa, e garante um estilo coeso em todo o aplicativo.

Para navegar até o layout de base, clique no botão "Layout de base" na parte inferior do painel de etapas/registros.

No layout básico, tudo o que você colocar no espaço de trabalho aparecerá em todas as suas etapas. Esse processo torna rápida e fácil a configuração do layout do aplicativo, eliminando a tarefa de criar cada etapa individualmente do zero.

Para obter um guia detalhado sobre a criação de um layout de base, consulte Como usar o layout de base.

Widgets

Os widgets são os blocos de construção dos aplicativos. Eles podem exibir informações, coletar dados, executar a lógica do Trigger e muito mais.

Widgets de ícones

Coloque formas, ícones ou logotipos no espaço de trabalho e configure a lógica para criar a aparência e a marca do seu aplicativo.

Widgets de botão

Escolha entre uma variedade de botões, um com lógica pré-programada ou botões personalizados em branco, para usar em seu aplicativo.

Leia mais sobre widgets de botão aqui.

Widgets de entrada

Colete dados dos usuários do aplicativo com Input Widgets, com cada tipo de entrada representando uma variável diferente de dados.

Leia mais sobre widgets de entrada aqui.

Widget de texto

Exiba texto estático ou dinâmico, incluindo os valores de variáveis, texto estático simples e espaços reservados para registros inteiros.

Widgets incorporados

Incorpore vídeos, imagens, CAD, documentos, scanners de código de barras e muito mais em seu aplicativo.

Leia mais sobre widgets incorporados aqui.

Widgets de câmera

Mostre o feed da câmera do Tulip Vision ou leia um código de barras com a câmera do seu dispositivo.

Leia mais sobre os widgets de câmera aqui.

Widgets personalizados

Se nenhum dos widgets acima for adequado às suas necessidades, você pode criar seu próprio widget usando HTML, CSS e Javascript para ampliar os recursos da plataforma.

Saiba mais sobre widgets personalizados aqui.

Acionadores

Os acionadores permitem que você adicione lógica ao seu aplicativo.

Sem acionadores, seu aplicativo é uma tela plana; os acionadores fazem com que seu aplicativo faça alguma coisa. Os acionadores podem ser adicionados a widgets, bem como a etapas (acionadores de nível de etapa) e aplicativos (acionadores de nível de aplicativo), e a determinados eventos, como o disparo de um dispositivo. Para um widget, selecione aquele ao qual deseja adicionar um acionador e, no Painel de acionadores, clique no sinal de mais ao lado de "Acionador".

Para adicionar um acionador a uma etapa, verifique se você está na etapa à qual deseja adicionar um acionador. Navegue até a guia Step (Etapa) no Trigger Panel (Painel de acionadores) e selecione uma na lista de opções clicando no sinal de mais.

Todos os acionadores seguem o mesmo formato básico: quando uma ação acontece , execute a seguinte ação e/ou transição. Os acionadores podem ser tão simples ou complicados quanto você precisar, podendo adicionar várias ações. Você também pode adicionar instruções If, que acrescentam uma condição à ação que está sendo executada, se os critérios forem atendidos.

Com uma instrução If, você define as condições que permitem que as ações sejam executadas.

As instruções if são uma ação ou uma transição. Uma ação é uma alteração no aplicativo que não está relacionada à alteração das etapas. Uma transição é a alteração das etapas ou a conclusão do aplicativo.

Por fim, para coincidir com as declarações if, há declarações else if que determinam a ação alternativa a ser tomada quando a declaração if for comprovadamente falsa.

Para obter um guia mais detalhado sobre acionadores, consulte Acionadores.

Variáveis

As variáveis são tipos de dados armazenados na Tulip Cloud que são usados na criação de tabelas e análises. Há muitos tipos de dados no Tulip, cada um com sua própria finalidade:

• Booleano - Sim/não
• Cor - Cor dinâmica para definir o status do widget
• Datetime - Carimbo de data e hora
• Arquivo - Link para um arquivo armazenado no Tulip
• Image - Link para uma imagem armazenada na Tulip
• Integer - Um número inteiro
• Intervalo - Quantidade de tempo exibida em segundos
• Machine - Objeto de máquina no Tulip
• Número - Um número real
• Objeto - Estrutura de objeto configurável com atributos filhos que têm seu próprio tipo de dados
• Station - Objeto de estação no Tulip a partir do chão de fábrica
• Texto - Sequência de caracteres
• Usuário - Objeto de usuário no Tulip a partir das configurações de conta/espaço de trabalho

Para adicionar uma variável em seu aplicativo, navegue até a guia Aplicativo no Painel de Acionadores e selecione o X ao lado de "Variáveis".

A janela de variáveis é aberta, exibindo todas as variáveis usadas em seu aplicativo. Para criar uma nova variável, clique no botão azul "Create Variable" (Criar variável) no canto superior direito.

Na caixa pop-up, digite o nome da variável e o tipo de dados, e alterne duas opções: se a variável será limpa ou não após a conclusão do aplicativo e se a variável poderá ser salva para análise.

Depois de criar a variável, você a verá listada na janela de variáveis.

Você também pode criar variáveis no editor de acionamento. Por exemplo, se você quiser criar uma nova entrada quando clicar em um botão Enviar, clique no botão ao qual deseja adicionar o acionador e abra o editor de acionadores.

Adicione uma nova ação que siga a lógica acima, dê um nome à sua variável para que você possa identificá-la e selecione a tabela em que deseja que ela seja gravada. Isso cria um registro por meio de uma variável que é salva na tabela designada. Aprenderemos mais sobre tabelas em outro guia. Por enquanto, lembre-se de que as tabelas contêm dados.

Para saber mais sobre variáveis, consulte Variáveis.

Criar um aplicativo com o Tulip

Crie um aplicativo Hello World simples com um membro da Tulip. Esse curso também é oferecido pela Tulip University.

Práticas recomendadas de design de UI

Ao projetar seu aplicativo, a navegabilidade e a acessibilidade são duas noções importantes que devem ser levadas em conta. É importante que os usuários do seu aplicativo possam navegar por ele sem se perder e que os widgets interativos sejam claros em seu uso. Se você é novo na criação de aplicativos, talvez esteja se perguntando como otimizar a usabilidade da interface do usuário. Para obter guias sobre o design de interfaces de aplicativos, consulte Design de aplicativos.

Recursos adicionais

Universidade Tulip

A Tulip University é um recurso gratuito e sob demanda para aprender Tulip. A Tulip University contém dezenas de cursos, certificações e desafios de criação de aplicativos para ajudá-lo a levar a criação de aplicativos para o próximo nível. Dê seus primeiros passos inscrevendo-se no Tulip Essentials, pratique suas habilidades com os Tulip Challenges e compartilhe suas conquistas tornando-se um Tulip Certified App Builder.

Biblioteca Tulip

A Tulip Library é uma coleção de conteúdo pronto para uso desenvolvido por especialistas da Tulip. Você encontrará muito conteúdo para começar, desde aplicativos completos e suítes de aplicativos até modelos, widgets personalizados e conectores.

Comunidade Tulip

Tem dúvidas, mas não consegue encontrar a resposta na Base de Conhecimento ou na Universidade? Tem uma ideia para um recurso que tornaria sua vida 100 vezes mais fácil? Precisa de uma maneira de se manter atualizado com as novidades do Tuliverse? Dê uma olhada na Tulip Community.

A Tulip Community é um fórum on-line ativo para os usuários postarem perguntas, discutirem e ajudarem uns aos outros a usar a Tulip para resolver seus problemas.