Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

...

  1. Formulário Responsivo: Hoje no mercado existem variados tamanhos de telas e resoluções, por isso qualquer formulário desenvolvido para Mobile deve ser responsivo, ou seja, deve se ajustar a qualquer tamanho de tela.
     

  2. Estética: A aparência visual e design do html devem ser atraentes para os usuários, conseguimos isso através de CSS ou jQueryMobile que será explicado nas próximas sessões.
      

  3. Usabilidade: O Formulário deve ser fácil de usar, contendo apenas o campos importantes para tarefas ou processo.
     

  4. Área de clique: Os elementos do HTML devem estar bem posicionados de forma que facilite a área de clique, pois hoje existem dispositivos que as telas são muito pequenas.Segue um exemplo:


     

  5. Posicionamento das ações: As ações mais importantes devem estar posicionadas onde o usuário consegue alcançar mais facilmente, conforme a figura:

     
     

  6. Customizações: As customizações devem ser feitas dentro dos eventos do processo ou formulário na Web, todos os eventos que são aplicados nos formulários Web também são aplicados nos formulários Mobile. Para mais informações acesse o guia Customização de Formulários.

  7. Arquivos anexos: Os arquivos anexos do formulário Web não são carregados para o formulário Mobile, por isso o CSS e as funções Javascript's devem ser implementadas dentro do HTML Mobile.

  8. Acesso a serviços internos e externos: Qualquer acesso a webservices ou outros serviços interno ou externo deve ser feito via javascript. Recomendamos o uso de jQuery de jQuery Soap para Webservices.

  9. Nem todas informações precisam estar no Formulário Mobile: O grande limitador do Mobile é o tamanho de tela, por isso mapeie os campos que são mais importantes para que tenham prioridade no formulário. Existem campos que são informativos e não tem grande utilidade no processo ou tarefas, esses podem ser eliminados do estes não precisam ser inclusos no Formulário Mobile.

  10. Tipos: Formulário Mobile suporta os tipos:
    1. text
    2. textArea
    3. radio
    4. select
    5. combobox
    6. checkbox.

...

  • Permite iniciar/movimentar solicitações de qualquer dispositivo móvel, independente de sua localização geográfica.
  • Acesso rápido as informações, mostrando apenas as informações mais relevantes.
  • Permite a continuidade do processo, mesmo fora do ambiente empresarial.
  • Através da funcionalidade "Processo Off-line" consigo preencher informações mesmo sem acesso a internet, para futura sincronização posteriormente.


Criando um Formulário Mobile

No Fluig é possível criar formulários de diferentes maneiras, utilizando o Fluig Studio, através da modelagem de processos workflow ou através de upload de formulário na navegação de documentos.

Acompanhe a seguir, movimentando-se pelas abas abaixo, as formas de criação de formulários:

 

Deck of Cards
Deck of Cards
effectDuration0.5
idinstall-windows
historyfalse
effectTypefade
Card
defaulttrue
id1
labelFluig Studio
titleSelecione a linguagem

Fluig Studio

Para incluir um novo formulário com suporte a dispositivos móveis, realize o procedimento padrão para exportação da definição de formulário e selecione os campos que irão compor o formulário mobile na tela antes da conclusão da exportação.

Após a exportação será incluindo também será incluído outro arquivo HTML e marcando-o marcado como "mobile" na pasta forms do projeto Fluig. 

 

Veja na imagem a seguir a tela de seleção mobile na exportação de uma definição de formulário:

Figura 15 - Definição de formulário mobile.

 

Após exportado a exportação, o formulário deve ficar conforme imagem a seguir:

 

Informações
titleNota

O Fluig identificada o formulário Mobile pelo nome, o formulário Mobile deve ter o mesmo nome do formulário Web acrescido da palavra "_ecmMobile"

, por exemplo: O meu

.

Exemplo: Criado o formulário web

chama

"compras.html", o formulário Mobile, obrigatoriamente, deve

-se chamar 

ser nomeado como: "compras_ecmmobile.html".

 

 

Card
id2
labelFormulário Mobile em Processos
titleTermo de uso

Configuração de Formulário Mobile em Processos

É possível gerar o permitir a criação do Formulário Mobile também através do Gerador Web de Formulário (confirmar o nome)de Formulário, conforme passo a seguir:

 

Passo 1: Criar ou editar um processo existente e acionar o campo formulário.

 

Passo 2: Selecionar a pasta destino onde esse formulário será publicado, assim como atribuir também atribua um título e descrição. Após isso, clique em Criar Formulário.

 

Passo 3:  Inclua os campos e em cada um deles, selecione se é um campo pro este será também adicionado ao formulário para dispositivos móveis, clicando na opção Formulário Mobile?.

 

Informações
iconfalse
titleInformação

Nem todos os tipos que funcionam na web campos mapeados no formulário do processo, podem ser mapeados pro Mobile, os para o formulário para dispositivos móveis. Os campos que podem ser mapeados aparece exibem a opção "Formulário Mobile?".



Card
id3
labelUpload via Navegação de Documentos
titleInstalação do fluig

Upload via Navegação de Documentos

No upload via navegação de documentos é feito como uma publicação normal padrão de definição de formulário, onde o formulário web deve ter um nome definido e o Formulário Mobile deve ser acrescido com o termo _ecmmobile

Informações
titleNota

O Fluig identificada o formulário Mobile pelo nome, o formulário Mobile deve ter o mesmo nome do formulário Web acrescido da palavra "_ecmMobile".

Exemplo: Criado o formulário web "compras.html", o formulário Mobile, obrigatoriamente, deve ser nomeado como: "compras_ecmmobile.html". 

 

 

Nota
titleAtenção

Todos esses Os formulários gerados pelos métodos de criação formulários acima elencados, precisam ser editados caso necessite de alguma customização especial, eles são gerados automaticamente e com o básico contendo os itens básicos para seu funcionamento.

 

Customizando de Formulário Mobile

Com a inclusão de definição de formulários que suportem a visualização em dispositivos móveis, é possível movimentar solicitações Workflow através destes dispositivos e realizar o preenchimento das informações da definição de formulários HTML, garantindo maior mobilidade e agilidade para realizar movimentações de solicitações workflow.

...