O documento apresenta um treinamento de Business Process Management (BPM) focado na suíte Bonita BPM Community Edition, destinado a desenvolvedores com conhecimentos em JavaScript, JSON e REST API. Ele abrange desde a instalação e configuração do software, até a modelagem e desenvolvimento de processos, incluindo exemplos práticos como um protótipo de gerenciamento de viagens. O treinamento também se concentra em conceitos essenciais do BPM e na criação de aplicações com a Bonita BPM, seguindo um ciclo de vida de desenvolvimento estruturado.

2. NPI
Workshop – Business Process Management
Universidade Federal do Ceará – Campus Quixadá – 2015.2
Núcleo de Práticas em Informática (NPI)
Thiago Pereira Rosa | thiagor@engineer.com
Engenharia de Software - Estagiário e Bolsista de Extensão do NPI
Attribution-NonCommercial-NoDerivatives 4.0 International (CC BY-NC-ND 4.0)

3. Treinamento BPM – Atenção
• Este treinamento foi planejado para um(a) desenvolvedor(a)
utilizando a suíte BonitaBPM Community Edition pela primeira vez.
• Ele também assume que você esteja familiarizado com as seguintes
tecnologias:
• JavaScript, JSON e REST API.

4. Treinamento BPM – Agenda
• Bonita Soft
• Suíte BonitaBPM
• O que é BPM
• Edições da suíte BonitaBPM
• BonitaBPM Community Edition 7
• BonitaBPM Studio
• BPMN 2.0
• BonitaBPM Execution Engine
• Bonita Execution Engine API
• BonitaBPM Portal
• Documentação
• Instalação e configuração (Windows/Linux/Mac)
• Ciclo de vida
• Configuração
• Organização
• Modelagem de processos
• BonitaBPM UI Design (Páginas e Formulários)
• Oficina - Desenvolvimento de um processo simplificado
• Resultado planejado
• Protótipos desenvolvidos para o NPI

5. http://www.bonitasoft.com

6. BonitaSoft
• Clientes:
• Números:

7. BonitaBPM – Visão Geral
• O que é a suíte BonitaBPM?
• É uma plataforma de aplicativos baseados em BPM
• O que é BPM? (Business Process Management)
• Ponto de vista da Tecnologia:
• Sigla que identifica soluções e software de gestão de
processos de negócio.
• Ponto de vista de Negócios:
• É um conceito que une gestão de negócios e tecnologia da
informação com foco na otimização dos resultados das
organizações por meio da melhoria dos processos de negócio.

8. BonitaBPM
• BonitaBPM – Edições

9. BonitaBPM Community Edition
• Suíte - BonitaBPM

10. BonitaBPM – Suíte
• BonitaBPM – Bonita Studio
3 - Painel de Detalhes
2 - Diagrama de Processo
1 - Menu principal

11. BonitaBPM – Suíte
• BonitaBPM – Bonita Studio – BPMN 2.0
http://www.omg.org/spec/BPMN/2.0/

12. BonitaBPM – Suíte
• BonitaBPM – Bonita Studio – Elementos importantes

13. BonitaBPM – Suíte
• BonitaBPM – Notação BPMN 2.0
http://www.omg.org/spec/BPMN/2.0/PDF

14. BonitaBPM – Suíte
• BonitaBPM – Bonita Execution Engine

15. BonitaBPM – Suíte
• BonitaBPM – Bonita Execution Engine - API

16. BonitaBPM – Suíte
• BonitaBPM – Bonita Portal

17. BonitaBPM
• BonitaBPM – Documentação
http://documentation.bonitasoft.com

18. BonitaBPM Community Edition
Instalação

19. BonitaBPM – Instalação
• Java SE Development Kit 8
• Java SE 8u65 / 8u66
• http://www.oracle.com/technetwork/java/javase/downloa
ds/jdk8-downloads-2133151.html?ssSourceSiteId=otnpt
• BonitaBPM
• Bonita BPM Community Edition 7
• http://www.bonitasoft.com/downloads-v2
• Cadastro é necessário para efetuar download
• Clique em: BonitaBPM-Community64Linux

20. BonitaBPM – Instalação

21. BonitaBPM – Lifecycle
• Ciclo de vida
• Ciclo de vida para criação de um aplicativo/processo usando o BonitaBPM e colocá-lo
em produção.
Criação da
Aplicação
• Análise de
negócio
• Definição da
aplicação
• Fluxo de
processo
Criação do
Sistema
• Administrador
Inicializa a
plataforma
• Definição da
aplicação
• Deploy do
processo
Produção
• Administrador
gerencia
aplicação e
processo
• Usuários
utilizam a
aplicação

22. BonitaBPM – Configuração
• Organização
• O que é uma Organização?
• Uma organização é um conjunto de utilizadores, normalmente definida em uma
estrutura hierárquica que está alinhada com a estrutura da Entidade de Negócio
que os utilizadores pertencem.
Criação da
aplicação
Criação do
sistema
Produção

23. BonitaBPM – Configuração
• Modelagem de processo
• Diagramas:
• Pools and Lanes
• A piscina é um recipiente para um processo em um diagrama.
• Tasks
• Uma tarefa é uma atividade em um processo.
• Gateways
• Gateways são utilizados para controlar a forma como uma
sequência flui e como convergem e divergem num processo.
• Transitions
• Transições representam um fluxo de sequência.
• Events
• Um evento é algo que acontece durante a execução de um
processo, e tem um impacto sobre o fluxo.
• Subprocesses
• Text Anotations
Criação da
aplicação
Criação do
sistema
Produção

24. BonitaBPM – Configuração
• Desenvolvimento de Páginas e Formulários
• Um aplicativo é um conjunto de formulários usados para coletar
informações de processo de um usuário e para apresentar informações.
• UI Designer (Versão 7.0+)
• O UI Designer é um ambiente gráfico de desenvolvimento para a criação de páginas e
formulários para um aplicativo Bonita BPM. É uma ferramenta web-based disponível a partir do
Bonita BPM Studio.
Criação da
aplicação
Criação do
sistema
Produção

25. BonitaBPM Community Edition
Aplicação + Design de Processo

26. BonitaBPM Community Edition
Oficina
Um colaborador abre a aplicação de ferramentas de viagem para visualizar
suas solicitações de viagens aprovadas.
Ele cria uma nova solicitação de viagem.
Em seguida, a solicitação é enviada para o gerente. O gerente analisa o pedido
e aprova ou recusa.
Em um aplicativo de gerenciamento de viagem real, haveria várias etapas do
processo após a aprovação: estimativa dos custos possivelmente recebendo
um segundo nível de aprovação se o custo passa de um determinado limite, a
apresentação de um pedido de reembolso, revisão de despesas e autorização
de pagamento.
No entanto, para este protótipo iremos considerar apenas a primeira parte do
processo, onde uma solicitação de viagem é apresentada e, em seguida,
revista.

27. BonitaBPM - Oficina
• Sequência de desenvolvimento de um aplicativo:
• Projetar páginas do aplicativo
• Definir o modelo de dados
• Definir o processo
• Criar o diagrama
• Definir variáveis
• Criar contratos (interfaces)
• Definir valores iniciais dos objetos de negócio
• Atualizar objetos de negócio com dados de aprovação
• Especificar atores
• Executar processo com formulários temporários
• Definir formulários do processo
• Criar o aplicativo

28. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Criar a home da Ferramenta de Viagens
Clique em:
UI Designer
Para abrir o
designer de
interface do
usuário em seu
navegador.

29. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
UI Designer
Em:
New page
Digite:
FerramentaDeViagem
e clique em +

30. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
• Crie a estrutura da página, arrastando
os widgets da paleta à esquerda e
soltando-os no quadro branco (central)
• TEXT widget: "usuario"
• TITLE widget: "Ferramenta de Viagem"
• TEXT widget: "Esta página lista suas solicitações
de viagens pendentes"
• CONTAINER widget: para solicitações pendentes
• TITLE widget: "Meus pedidos pendentes"
• TABLE widget: com as seguintes propriedades:
• Partida, Noites, Hotel, Destino, Motivo
• Columns key: desta mesma tabela
• dataPartida, numeroDeNoites, necessitaHotel, destino, motivo
• CONTAINER widget: para solicitações aprovadas
• TITLE widget: "Meus pedidos aprovados"
• TABLE widget: com as seguintes propriedades:
• Partida, Noites, Hotel, Destino, Motivo
• Columns key: desta mesma tabela
• dataPartida, numeroDeNoites, necessitaHotel, destino, motivo

31. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
• Adicionando dados fictícios 1:
• No painel de Variáveis (na parte inferior da página)
clique em: Create a new variable
• Digite o nome da variável: testePendentes
• Selecione o tipo: JSON
• Insira o valor abaixo:
[{
"userId": "3",
"destino":"Catalão",
"dataPartida":"12/1/2016",
"numeroDeNoites":"1",
"necessitaHotel":"true",
"motivo":"Almoço comercial",
"status":"Pendente",
"motivoRecusa":""
}]
• Clique em Save
• Clique no ícone "fx" na propriedade:
Content, da tabela: Pedidos Pendentes
• Informe: testePendentes

32. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
• Adicionando dados fictícios 2:
• No painel de Variáveis (na parte inferior da página)
clique em: Create a new variable
• Digite o nome da variável: testeAprovadas
• Selecione o tipo: JSON
• Insira o valor abaixo:
[{
"userId": "3",
"destino":"Quixadá",
"dataPartida":"10/1/2016",
"numeroDeNoites":"1",
"necessitaHotel":"true",
"motivo":"Almoço comercial",
"status":"Aprovado",
"motivoRecusa":""
}]
• Clique em Save
• Clique no ícone "fx" na propriedade:
Content, da tabela: Pedidos Aprovados
• Informe: testeAprovadas

33. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
• Reveja e melhore sua página!
• Prototipando? Por que iniciar pela interface gráfica?
• 5 minutos...

34. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o modelo de dados
• Há duas etapas para a definição de variáveis:
• Primeiro você define o modelo de dados de negócios e
em seguida,
• Você especifica como o processo manipula os objetos do modelo.
• Vá no menu:
• Desenvolvimento / Modelo de Dados de Negócio / Gerenciar

35. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o modelo de dados
• Clique no botão Adicionar
• Adicione: FerramentaDeViagem
• Descrição: Modelo Ferramenta de Viagem
• Em Pacote (package), no canto inferior esquerdo:
• Adicione: br.ufc.quixada.npi.model
• Na aba Atributos, na parte central, adicione:
Variável Tipo Obrigatório
userId String no
dataPartida Date yes
numeroDeNoites Integer yes
necessitaHotel Boolean no
destino String yes
motivo String yes
status String no
motivoRecusa String no

36. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o modelo de dados
• Na aba Consultas, na parte central da janela
selecione: Personalizado
• Clique no botão Adicionar
• Informe o nome: findByUserIdAndStatus
• Clique no campo Consulta ao lado direito do nome
• Clique no ícone de editar query: […]
• No campo: Consulta JPQL (query)
• Remova todos atributos, exceto:
userId e status
• Abaixo, exclua os parâmetros não usados
• Clique em Concluir

37. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o processo
• A primeira etapa é criar um novo diagrama,
usando o BonitaBPM Studio.
• Vamos dar ao diagrama um nome mais descritivo.
• Clique no diagrama fora da Piscina, em seguida, vá para o Painel
de Detalhes (canto inferior direito da tela)
• Na guia Geral, no painel Diagrama, clique em Editar e informe: Ferramenta de Viagem
• Agora vamos dar à piscina um nome mais descritivo.
• Clique na piscina, em seguida, vá para o Painel de Detalhes
• Na guia Pool, e clique em Editar e informe: Ferramenta de Viagem
• Adicione um evento de Fim e efetue
a ligação com a tarefa Passo1.
• Altere a tarefa Passo1 para: Revisão
Coordenador

38. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o processo
• Definindo as variáveis de negócio.
• Selecione a piscina
• Vá para o Painel de Detalhes
• Clique na aba Dados em seguida clique no botão Adicionar
abaixo da caixa Variáveis do negócio
• No campo nome, adicione: ferramentaDeViagem
• Informe a descrição: Variável ferramentaDeViagem
• No campo Objeto de Negócio, selecione: FerramentaDeViagem
• Não configure o valor padrão, ele usará posteriormente a informação definida
nos contratos (interfaces)
• Clique no botão Concluir
• Os atributos de ferramentaDeViagem contém a informação que será usada no
processo. Não há outras variáveis para definir.
• Salve seu processo!

39. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o processo
• Criando contratos (interfaces).
• Um contrato especifica o quê um formulário retorna para uma
instancia de processo, ele deve ser definido na inicialização
e para cada tarefa humana.
• Selecione a piscina
• Vá para o Painel de Detalhes
• Clique na aba Execução em seguida na aba Contrato
• Em contato, na aba Entradas clique no botão: Adicionar a partir de dados…
• Selecione: ferramentaDeViagem
• Clique em Avançar
• Especifique os atributos desejados para seu contrato...
• Desmarque: userId, status e motivoRecusa
• Clique no botão Concluir
• Na janela de diálogo: Geração de contrato, clique em Ok.
• Na janela de informação, clique em OK.

40. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o processo
• Criando contratos (interfaces).
• Ainda na janela de Entradas de instanciação de processo
• Selecione a piscina
• Vá para o Painel de Detalhes
• Clique na variável ferramentaDeViagemInput para expandi-la
• Para cada atributo adicione uma descrição, como segue abaixo, pois elas serão
exibidas no formulário para auxiliar o usuário final.
Atributo Descrição
dataPartida Selecione a data em que a viagem se inicia
numeroDeNoites Informe o número de noites
necessitaHotel Selecione este campo caso necessite de um hotel
destino Informe a cidade de destino
motivo Informe o motivo desta viagem

41. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o processo
• Contrato para tarefa Revisão Coordenador
• Este contrato possui apenas duas entradas e uma
restrição caso o pedido seja negado pelo gerente.
• Selecione a tarefa Revisão Coordenador
• Vá para o Painel de Detalhes / Execução / Contrato
• Clique no botão Adicionar
• Na aba Restrições, clique no botão Adicionar
• Informe: motivoRecusaObrigatorio
• No campo Expressão, clique no ícone […]
• Informe: status=="Aprovado" || (status=="Recusado" && motivoRecusa != null &&
!motivoRecusa.isEmpty())
• Em Mensagem de erro informe: Caso recuse, você deverá informar o motivo
Atributo Descrição
status Indica quando se aprova ou recusa uma requisição de viagem
motivoRecusa Caso recuse, será necessário informar o motivo

42. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o processo
• Valores iniciais do objeto de negócio
• Agora que o contrato foi definido, é possível configurar os
valores iniciais da variável ferramentaDeViagem
• Selecione a piscina
• Vá para o Painel de Detalhes / Dados
• Dê um duplo clique em: ferramentaDeViagem
• Clique no ícone de caneta ao lado do campo Valor padrão
• Nesta nova janela, no campo Nome, informe: novaRequisicaoInicializador
• Adicione o seguinte script:

43. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o processo
• Valores iniciais do objeto de negócio
• Adicione o script abaixo:
• Clique em OK, seguido de OK na janela de Editar variável de negócio
def ferramentaDeViagemVar = new br.ufc.quixada.npi.model.FerramentaDeViagem()
ferramentaDeViagemVar.userId =
String.valueOf(BonitaUsers.getProcessInstanceInitiator(apiAccessor,
processInstanceId).getId())
ferramentaDeViagemVar.dataPartida = ferramentaDeViagemInput.dataPartida
ferramentaDeViagemVar.numeroDeNoites = ferramentaDeViagemInput.numeroDeNoites
ferramentaDeViagemVar.necessitaHotel = ferramentaDeViagemInput.necessitaHotel
ferramentaDeViagemVar.destino = ferramentaDeViagemInput.destino
ferramentaDeViagemVar.motivo = ferramentaDeViagemInput.motivo
ferramentaDeViagemVar.status = "Pendente"
return ferramentaDeViagemVar

44. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o processo
• Atualizando o objeto de negócio
• É necessário definir as operações para atualizar o objeto de
negócio com os valores informados na revisão pelo gerente
• Selecione a tarefa Revisão Coordenador
• Vá para o Painel de Detalhes / Execução / Operações
• Adicione operações clicando no botão Adicionar
• Selecione: ferramentaDeViagem
• Clique em Recebe o valor de e informe Use um método java
• Selecione setStatus(String), clique em Ok
• No campo à direita de setStatus selecione a variável: status
• Faça o mesmo procedimento para a variável: motivoRecusa

45. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o processo
• Gerenciando organizações
• Selecione o menu: Organização / Gerenciar
• Para visualizar as informações das organizações publicadas
• Selecione o menu: Organização / Importar
• Acesse: https://github.com/npi-ufc-qxd/workflow-
engine/blob/master/Engine%20Info/Bonita%20BPM/Estrutura%20organiza
cional%20-%20Universidade%20Federal%20do%20Ceará.xml
• Importe organizações pré-estabelecidas
• Selecione o menu: Organização / Publicar
• Para publicar uma organização

46. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o processo
• Especificando atores (colaboradores)
• O próximo passo é definir quem realiza as etapas do processo.
Isto é feito através da atribuição de atores.
• Vamos importar a organização simulada do NPI de Quixadá.
• Acesse: https://github.com/npi-ufc-qxd/workflow-
engine/blob/master/Engine%20Info/Bonita%20BPM/
Estrutura%20organizacional%20-%20Universidade%20Federal
%20do%20Ceará.xml
• Informe o nome: Estrutura-Universidade Federal do Ceará.xml
• Selecione a piscina
• Vá para o Painel de Detalhes / Geral / Atores
• Clique no botão Adicionar e informe: colaboradores
• Clique no botão: Definir como iniciador em colaboradores
• Exclua o item: Employee actor
• Ainda na piscina, clique em: Configurar, no menu principal
• Selecione Mapeamento de Ator na lateral esquerda
• Clique em: colaboradores, clique no botão Grupos, altere a organização,
selecione: /Campus Quixadá/Núcleo de Práticas em Informática
• Clique em: Concluir
• Clique em Concluir, na janela de configuração Local

47. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o processo
• Especificando atores (coordenadores)
• O próximo passo é definir quem realiza as etapas do processo.
Isto é feito através da atribuição de atores.
• Selecione a piscina
• Vá para o Painel de Detalhes / Geral / Atores
• Clique no botão Adicionar e informe: coordenadores
• Ainda na piscina, clique em: Configurar, no menu principal
• Selecione Mapeamento de Ator na lateral esquerda
• Clique em: coordenadores, clique no botão Roles, altere a organização,
selecione: Coordenador e Gerente de Projetos
• Clique em: Concluir

48. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do
processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo o processo
• Definindo filtro de Atores
• Assim é possível garantir que uma determinada tarefa somente
seja executada por um usuário devidamente autorizado.
• Selecione a tarefa Revisão Coordenador
• Vá para o Painel de Detalhes / Geral / Atores
• Selecione: Utilizar o ator abaixo
• Informe em Selecione um ator: coordenadores
• Selecione a Lane
• No item: Selecione um ator, informe: colaboradores e salve o seu processo!

49. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo formulários
• Executando processos com formulários temporários
• A maneira mais fácil de criar formulários é gerando-os
a partir de um contrato definido
• Criando um formulário de Instanciação de Processo
• Selecione a Piscina
• Vá para o Painel de Detalhes / Execução / Contrato
• Clique no ícone do UI Designer (no canto inferior direito)
• Altere o nome newForm para: submeterFerramentaDeViagem e Salve
• Organize melhor a página gerada. 5 minutos...

50. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do processo
Criar o
aplicativo
BonitaBPM - Oficina
Definindo formulários 1
• Agora vamos definir o formulário da tarefa Revisão pelo
Gerente
• Selecione a tarefa: Revisão Coordenador
• Vá para o Painel de Detalhes / Execução / Contrato
• Clique no ícone do UI Designer
• Altere o nome para: revisaoFerramentaDeViagem e Salve
• Ainda no UI Designer do formulário revisaoFerramentaDeViagem:
• Adicione variáveis para recuperar a informação do formulário:
• Clique no botão Create a new variable e adicione: requisicaoViagem
• Selecione o tipo: External API
• Adicione em API URL: /bonita/{{context.ferramentaDeViagem_ref.link}}
• Clique em Save

51. Definindo formulários 3
• Complementando as informações da solicitação.
• Para isso, vamos adicionar os widgets abaixo:
• Especifique estes widgets como somente leitura.
• Adicione um Radio button com o label Status:
• Available values: Aprovado, Recusado
• Selected Value: formInput.status
• Adicione um texto ao lado de Status com o seguinte valor: Escolha uma das
opções para informar sua decisão sobre esta Requisição de Viagem.
Tipo Valor
Destino Input requisicaoViagem.destino
Data de partida Input requisicaoViagem.dataPartida | date
Número de noites Input requisicaoViagem.numeroDeNoites
Hotel Checkbox requisicaoViagem.necessitaHotel
Motivo da viagem Text area requisicaoViagem.motivo
Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do processo
Criar o
aplicativo
BonitaBPM - Oficina

52. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do processo
Criar o
aplicativo
BonitaBPM - Oficina
Execute o processo
• Agora você pode executar o processo utilizando os
formulários criados.
• Tenha certeza de salvar as alterações no UI Designer
antes de executar seu processo.
• O processo está completo, então agora podemos executá-lo
e adicioná-lo posteriormente à uma aplicação.
• Selecione a Piscina
• No menu principal clique em: Executar

53. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do processo
Criar o
aplicativo
BonitaBPM - Oficina
Resultado preliminar - Processos

54. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do processo
Criar o
aplicativo
BonitaBPM - Oficina
Resultado preliminar - Tarefa

55. BonitaBPM Community Edition
Construindo o aplicativo
Ultima fase do ciclo de vida
Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do processo
Criar o
aplicativo

56. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do processo
Criar o
aplicativo
BonitaBPM - Oficina
Construindo o aplicativo
• Há dois estágios para atualizar uma página:
• 1º criar algumas variáveis
• 2º alterar o mapeamento dos widgets
• No UI Designer edite a página: FerramentaDeViagem.
• Crie a variável (External API): session com o valor:
• ../API/system/session/unusedid
• Crie a variável (External API): processDef com o valor:
• ../API/bpm/process?p=0&c=1&f=name=Ferramenta de Viagem
• Crie a variável (JavaScript expression): myUserId com o valor:
• return $data.session.user_id;
• Crie a variável (External API): minhasRequisicoesPendentes com o valor:
• ../API/bdm/businessData/br.ufc.quixada.npi.model.FerramentaDeViagem?q=fi
ndByUserIdAndStatus&p=0&c=10&f=userId={{myUserId}}&f=status=Pendente
• Crie a variável (External API): minhasRequisicoesAprovadas com o valor:
• ../API/bdm/businessData/br.ufc.quixada.npi.model.FerramentaDeViagem?q=fi
ndByUserIdAndStatus&p=0&c=10&f=userId={{myUserId}}&f=status=Aprovado

57. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do processo
Criar o
aplicativo
BonitaBPM - Oficina
Construindo o aplicativo
• Vamos atualizar os seguintes widgets:
• Selecione o widget username e atualize a propriedade
Text para: {{session.user_name}}
• Atualize a tabela de solicitações pendentes para: minhasRequisicoesPendentes
• Atualize a tabela de solicitações aprovadas para: minhasRequisicoesAprovadas
• Para ambas as tabelas, ajuste a propriedade Column keys para:
• dataPartida | date, numeroDeNoites, necessitaHotel, destino, motivo

58. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do processo
Criar o
aplicativo
BonitaBPM - Oficina
Link para criar nova requisição
• Quando o usuário clica no botão de criar uma Requisição de
viagem, a aplicação exibe tal formulário:
• Para configurar o botão, selecione-o e informe na
propriedade target URL o link abaixo:
• http://localhost:8080/bonita/portal/resource/process/Ferramenta%20de%20Viagem
/1.0/content/?id={{processDef[0].id}}
• Salve a página:

59. Projetar
páginas do
aplicativo
Definir o
modelo de
dados
Definir o
processo
Definir
formulários
do processo
Criar o
aplicativo
BonitaBPM - Oficina
Construindo o aplicativo
• Para construir a Ferramenta de Viagem, é necessário exportar
a página pelo UI Designer, executar o processo e então criar
o aplicativo no BonitaBPM Portal:
• Para exportar clique no botão:
• Para executar o processo, clique no botão executar:
• Para criar o aplicativo
• Efetue login no portal com o perfil de Administrador.
• No menu principal clique em Recursos, em seguida no botão Add e importe.
• No menu principal clique em Aplicações, em seguida no botão New.
• Informe o Nome (Ferramenta de viagem) e a URL (ferramenta-de-viagem) para este
aplicativo, então clique em Create.
• Na Lista de Aplicações, clique no ícone de editar […], para configurar o aplicativo.
• *Na sessão de páginas (pages), clique em Add para adicionar a página importada
(FerramentaDeViagem page) e informe a URL: inicio, defina-a como Home clicando
no ícone de uma casa, então delete: Application home page.
• Verifique se o aplicativo foi corretamente instalado, clicando na URL.
• Compartilhe o link do seu novo aplicativo baseado em BPM.

60. BonitaBPM – Configuração
• Resultado
• Processo planejado
• Ferramenta de viagem, simplificada
• URL: http://10.0.1.215/bonita/apps/Ferramenta-de-viagem
Ps: Disponível em toda rede local da UFC – Campus Quixadá.
Criação da
aplicação
Criação do
sistema
Produção

61. BonitaBPM – Configuração
• Resultado
Criação da
aplicação
Criação do
sistema
Produção

62. BonitaBPM – Configuração
• Resultado
Criação da
aplicação
Criação do
sistema
Produção

63. BonitaBPM – Configuração
• Protótipos do NPI
• Workflow Engine: https://github.com/npi-ufc-qxd/workflow-engine

64. NPI
Workshop – Business Process Management
Universidade Federal do Ceará – Campus Quixadá
Núcleo de Práticas em Informática – 2015.2
Thiago Pereira Rosa | thiagor@engineer.com | @kamihouse
Engenharia de Software
Obrigado!
Attribution-NonCommercial-NoDerivatives 4.0 International (CC BY-NC-ND 4.0)