Formulários no Constellation

Você pode configurar as visualizações do formulário de duas maneiras: na guia Fluxo de trabalho (Workflow) de um tipo de caso (case type) ou na guia UX de um tipo de caso ou objeto de dados.

Guia Fluxo de trabalho

Na guia Fluxo de trabalho, quando você configura uma visualização para uma etapa (step) no ciclo de vida do caso, o sistema cria uma visualização do formulário. Um exemplo de uma visualização de formulário criada na guia Fluxo de trabalho é mostrado na figura a seguir:

Guia UX

Na guia UX, no painel Outras visualizações (Other Views), você pode criar um dos seguintes tipos de visualização:

• List
• Partial
• Form

As opções de modelo e configuração dependem do tipo de visualização que você cria. Um exemplo de uma visualização de formulário criada na guia UX é mostrado na figura a seguir:

Quando você cria ou configura uma visualização de formulário, o sistema exibe opções de layout e instruções. 

Modelo

Por padrão, as visualizações de formulário usam a opção de modelo Default form, conforme mostrado na figura a seguir:

Para usar um modelo diferente, crie um tipo de visualização diferente na guia UX. A tabela a seguir descreve os diferentes tipos de visualização e opções de modelo:

Layout

Ao configurar um layout de formulário, você define o número de colunas que o formulário deve conter. Os formulários no Constellation podem usar de uma a três colunas mas, como melhor prática, use um layout de duas colunas para a maioria dos casos de uso.  

Os campos que você inclui no formulário ajustam automaticamente seu tamanho e largura de acordo com os padrões de design prescritos. Por exemplo, em um modelo de formulário de duas colunas, entradas como Texto (linha única) e Moeda ocupam somente uma coluna. Entradas mais largas ou entradas que podem ter qualquer altura, como editor de rich text, área de texto, grupo de radio buttons, checkbox, booleanos e anexos, abrangem duas colunas. Esse ajuste aumenta a usabilidade e garante que a tabulação leve os usuários da esquerda para a direita, em vez de cima para baixo.  

A figura a seguir mostra um modelo de formulário padrão que ajusta o layout com base no tipo de entrada: 

Instruções

Por padrão, uma visualização de formulário exibe as instruções da etapa que você configura a partir do ciclo de vida do caso. Em uma visualização de formulário, você tem a opção de substituir as instruções da etapa do caso por texto personalizado ou ocultar as instruções da etapa, conforme mostrado na figura a seguir:

Um grupo de campos é um agrupamento de campos individuais que, juntos, apresentam dados relacionados dentro de uma visualização. Os campos individuais podem vir do modelo de dados do tipo de caso ou de vários objetos de dados. 

Os grupos de campos ajudam você a organizar seus campos em um único cabeçalho e fornecem ferramentas para você adicionar instruções ou ocultar temporariamente os campos em seções recolhíveis, facilitando aos usuários a navegação pelas informações apresentadas na visualização.

Os grupos de campos dentro de uma visualização são específicos somente dessa visualização. Eles não estão disponíveis para reutilização em outras visualizações.

 Um formulário é uma interface para coletar dados de usuários e processar o trabalho. Formulários online longos e complexos podem dificultar a navegação dos usuários.

Por exemplo, formulários de pedidos online como o da imagem abaixo requerem muitos dados. Os usuários devem inserir informações de contato, os itens a serem comprados e a forma de pagamento. 

Um formulário de várias etapas representa uma atribuição única concluída por um único usuário, composta por várias visualizações focadas e concisas. É um fluxo de trabalho linear e guiado que utiliza telas de IU relacionadas.

É possível configurar um formulário de várias etapas para ajudar os usuários a concluir tarefas complicadas. Por exemplo, em vez de ter um único formulário de pedido online confuso, configure um formulário de várias etapas. O formulário de várias etapas apresenta informações do formulário de pedido online em uma série de telas simples e fáceis de navegar.

O formulário de várias etapas fornece três estilos de navegação: horizontal, vertical e padrão. Com todos os três estilos, os usuários navegam pelas telas usando os botões Previous e Next . A figura a seguir exibe um formulário de várias etapas para pedidos online que usa navegação padrão:

Com a navegação horizontal e vertical, um menu de navegação (orientado horizontal ou verticalmente) exibe a etapa do formulário de várias etapas em que o usuário está. A figura a seguir exibe um formulário de várias etapas para pedidos online que usa navegação vertical:

Embora os formulários de várias etapas sejam recomendados quando as informações devam ser preenchidas em ordem sequencial, os usuários podem navegar entre as visualizações, desde que não haja campos obrigatórios e o formulário de várias etapas não seja enviado.  A opção Submit está disponível na última tela do formulário de várias etapas. A figura a seguir exibe a última etapa de um formulário de várias etapas de pedido online que usa navegação horizontal:

Assim como os formulários de várias etapas, os formulários hierárquicos dividem uma atribuição (assignment) complexa que captura dados em vários campos em grupos de campos menores e relacionados. Os formulários hierárquicos reduzem a rolagem e otimizam a área da janela para os usuários durante o processamento do caso. 

Se os formulários de várias etapas dividem as informações em várias visualizações de formulário, os formulários hierárquicos dividem as informações em várias guias em uma única visualização de formulário.  Cada guia é chamada de grupo de formulários. Os grupos de formulários em um formulário hierárquico não são visualizações independentes e não são reutilizáveis ou acessíveis por meio de uma lista de visualizações.

Como melhor prática, os formulários de várias etapas são recomendados quando os usuários precisam preencher o formulário sequencialmente, e os formulários hierárquicos são recomendados quando os usuários podem preencher o formulário em qualquer ordem.

A imagem a seguir mostra um formulário hierárquico no momento do design na Pega Platform: