# Design de passes no construtor de passes
O **construtor de passes** da Apple Wallet é um designer visual no Painel de Controle. Você escolhe um estilo de passe, preenche a marca, os campos e um código de barras, assiste a uma pré-visualização ao vivo e gera um `.pkpass` assinado — sem necessidade de escrever o `pass.json` manualmente.
## Criar um passe
No Painel de Controle, vá para **Campanhas → Apple Wallet** e clique em **Criar passe**.
## Configurar o passe
* **Do zero:** comece com um passe vazio. Escolha um estilo de passe e, em seguida, defina cores, imagens, campos, código de barras e outras opções você mesmo nas seções abaixo.
* **A partir de um modelo:** clique em **Carregar modelo**, escolha um passe integrado em **Selecionar Modelo** (cartão de embarque, cupom, ingresso para evento, genérico ou cartão de loja) e confirme. O formulário preenche previamente o estilo do passe, cores, imagens, campos do passe, código de barras e informações básicas. Edite qualquer valor ou altere o estilo conforme necessário. O Pushwoosh substitui os IDs de equipe e de Tipo de Passe do modelo pelos valores da sua aplicação.
### Escolha um estilo de passe
Em **ESTILO DO PASSE**, escolha um dos cinco estilos de passe da Apple Wallet. O estilo controla o layout e quais áreas de campo e imagens estão disponíveis:
* **Cartão de Embarque**
* **Cupom**
* **Ingresso para Evento**
* **Cartão de Loja**
* **Genérico**
Se você começar do zero, escolha o estilo antes de adicionar campos e imagens.
Mudar o estilo redefine os campos específicos do estilo.
### Adicione o nome e a descrição do passe
Em **INFORMAÇÕES BÁSICAS**, preencha:
| | |
| :---- | :---- |
| **Nome do Passe** | O título do passe e o nome da fonte exibido nas notificações de atualização. |
| **Descrição** | Uma breve descrição do passe. |
| **Texto do Logotipo** | Texto exibido ao lado do logotipo (usado quando nenhuma imagem de logotipo é carregada). |
### Defina cores e imagens
#### Cores
Em **CORES**, defina:
* **Cor de Fundo:** o fundo do passe.
* **Cor do Primeiro Plano:** texto principal e ícones no passe.
* **Cor do Rótulo:** cor dos rótulos dos campos (por exemplo, `DE`, `PORTÃO`).
Para definir ou alterar uma cor, clique no campo correspondente e escolha uma cor no seletor.
#### Imagens
Em **IMAGENS**, carregue o **Ícone** e o **Logotipo** (ambos obrigatórios). As imagens opcionais dependem do estilo do passe.
Clique em **Escolher arquivo** ao lado de cada espaço de imagem. Carregue arquivos PNG ou JPEG. O Pushwoosh processa cada imagem nas resoluções que a Apple exige (@1x, @2x, @3x) quando gera o passe.
### Preencha os campos do passe
Em **CAMPOS DO PASSE**, adicione o texto e os valores que aparecem no passe. Os grupos que você vê dependem do estilo do passe:
* **Campos de cabeçalho (topo do passe):** Cartão de Embarque, Ingresso para Evento
* **Campos primários (conteúdo principal):** todos os estilos
* **Campos secundários (informações de suporte):** todos os estilos
* **Campos auxiliares (detalhes extras):** todos os estilos
* **Campos do verso (lado oposto do passe):** todos os estilos
Clique em **+ Adicionar Campo** em cada grupo que você precisar.
Para cada campo, defina:
| | |
| :---- | :---- |
| Chave (ID) | Identificador de campo único (gerado automaticamente). |
| Rótulo | Rótulo curto no passe (por exemplo, `DE`). |
| Valor | Valor exibido no passe (por exemplo, `SFO`). |
| Mensagem de alteração | Texto na notificação de atualização quando este valor muda. Exibido apenas quando o valor muda. Use `%@` para o novo valor (por exemplo, `Portão alterado para %@`). |
No cartão do campo, clique em **Formatar** para mostrar as opções de formatação. Clique em **X** para remover o campo.
#### Opções de formatação
* **Formato do valor:** Texto, Data e hora ou Número/moeda.
* **Alinhamento do texto:** Padrão (Natural), esquerda, centro ou direita.
* **Detectores de dados** *(apenas campos do verso):* transformam números de telefone, links, endereços e eventos de calendário em conteúdo tocável nos campos do verso.
### Adicione um código de barras
Em **CÓDIGO DE BARRAS**, escolha um formato e insira os dados a serem codificados:
1. **Formato do Código de Barras:** escolha a aparência do código de barras e que tipo de scanner pode lê-lo.
* **Código QR (recomendado):** código quadrado que a maioria dos telefones e scanners lê facilmente. Melhor para cupons, cartões de fidelidade e a maioria dos passes.
* **PDF417:** código de barras largo composto por várias fileiras de linhas. Frequentemente exigido para cartões de embarque de companhias aéreas ou de trânsito.
* **Asteca:** código quadrado compacto, semelhante ao QR. Comum em ingressos de eventos e de trânsito.
* **Código 128:** código de barras clássico de linhas verticais. Escolha este apenas se o seu scanner ou sistema de PDV exigir um código de barras 1D.
2. **Mensagem do Código de Barras:** o valor codificado no código de barras (por exemplo, um número de ingresso ou de membro).
3. **Texto Alternativo (opcional):** texto exibido abaixo do código de barras no passe.
### Defina a expiração e o status
Em **EXPIRAÇÃO E STATUS**, controle quando o passe é exibido, quando expira e se ainda é válido:
* **Data Relevante (quando mostrar o passe):** data e hora em que o passe pode aparecer na tela de bloqueio.
* **Data de Expiração (quando o passe expira):** data e hora após a qual o passe fica esmaecido na Wallet.
* **Marcar como Anulado (invalidar este passe):** caixa de seleção para invalidar o passe para que não seja mais utilizável.
### Opções específicas de estilo e avançadas
* **Tipo de trânsito** *(apenas Cartão de Embarque):* Aéreo, Trem, Ônibus, Barco ou Genérico.
* **Identificador de agrupamento:** agrupa passes relacionados na Wallet.
### Relevância baseada em localização *(opcional)*
Em **RELEVÂNCIA BASEADA EM LOCALIZAÇÃO**, o passe aparece quando o usuário está perto dos locais que você adiciona. Para cada local, defina o texto exibido na tela de bloqueio quando o usuário estiver próximo. Você pode adicionar até 10 locais.
Clique no mapa, pesquise um endereço, cole coordenadas ou importe uma geozona para adicionar um ponto. Arraste o marcador para ajustar a posição.
Uma **distância máxima** (em metros) controla o quão perto o usuário deve estar para que o passe permaneça relevante.
**Exemplos de casos de uso**
* **Varejo:** um cartão de fidelidade ou cupom aparece quando o cliente está perto da sua loja. O texto da tela de bloqueio pode dizer que ele está perto da loja e lembrá-lo de usar o passe.
* **Eventos:** um ingresso para evento aparece quando o usuário está perto do local (estádio, teatro ou área do festival) para que ele possa encontrar o passe rapidamente na entrada.
* **Viagem:** um cartão de embarque se torna proeminente perto do aeroporto ou terminal de partida, para que o passageiro veja os detalhes do portão ou do voo na tela de bloqueio antes de abrir a Wallet.
* **Hotelaria:** um cupom ou passe de membro pode aparecer perto de um café ou hotel que você definir.
### Insira um ID de Usuário
Insira o [ID de Usuário](/pt/product/pushwoosh-knowledge-hub/users-userids/#how-are-users-and-devices-related) do Pushwoosh para a pessoa que receberá este passe. O Pushwoosh emite o passe para esse usuário e o lista em **USUÁRIO** em **Todos os passes**.
### Pré-visualizar e validar
Uma **pré-visualização ao vivo** é atualizada conforme você edita, para que você possa ver aproximadamente como o passe ficará na Wallet.
Para verificar o passe em relação às especificações da Apple sem criá-lo, clique em **Validar passe**. O construtor sinaliza imagens obrigatórias ausentes e outros problemas.
## Gerar o passe
Selecione **Gerar**. O Pushwoosh valida o passe, processa as imagens e assina o pacote. A geração leva alguns segundos, após os quais o passe aparece na sua lista de passes.
Para editar (incluindo atualização por número de série), baixar, compartilhar e excluir passes após a geração, consulte [Gerenciar passes existentes](/pt/product/messaging-channels/apple-wallet-passes/#view-and-manage-existing-passes).
## Gerenciar passes via API
Tudo o que o construtor de passes faz também está disponível através da [API PassKit Designer](/pt/developer/api-reference/apple-wallet-passkit-api/): criar, atualizar, listar, baixar e excluir passes.
## Configurar o passe
* **Do zero:** comece com um passe vazio. Escolha um estilo de passe e, em seguida, defina cores, imagens, campos, código de barras e outras opções você mesmo nas seções abaixo.
* **A partir de um modelo:** clique em **Carregar modelo**, escolha um passe integrado em **Selecionar Modelo** (cartão de embarque, cupom, ingresso para evento, genérico ou cartão de loja) e confirme. O formulário preenche previamente o estilo do passe, cores, imagens, campos do passe, código de barras e informações básicas. Edite qualquer valor ou altere o estilo conforme necessário. O Pushwoosh substitui os IDs de equipe e de Tipo de Passe do modelo pelos valores da sua aplicação.
### Escolha um estilo de passe
Em **ESTILO DO PASSE**, escolha um dos cinco estilos de passe da Apple Wallet. O estilo controla o layout e quais áreas de campo e imagens estão disponíveis:
* **Cartão de Embarque**
* **Cupom**
* **Ingresso para Evento**
* **Cartão de Loja**
* **Genérico**
Se você começar do zero, escolha o estilo antes de adicionar campos e imagens.
Mudar o estilo redefine os campos específicos do estilo.
### Adicione o nome e a descrição do passe
Em **INFORMAÇÕES BÁSICAS**, preencha:
| | |
| :---- | :---- |
| **Nome do Passe** | O título do passe e o nome da fonte exibido nas notificações de atualização. |
| **Descrição** | Uma breve descrição do passe. |
| **Texto do Logotipo** | Texto exibido ao lado do logotipo (usado quando nenhuma imagem de logotipo é carregada). |
### Defina cores e imagens
#### Cores
Em **CORES**, defina:
* **Cor de Fundo:** o fundo do passe.
* **Cor do Primeiro Plano:** texto principal e ícones no passe.
* **Cor do Rótulo:** cor dos rótulos dos campos (por exemplo, `DE`, `PORTÃO`).
Para definir ou alterar uma cor, clique no campo correspondente e escolha uma cor no seletor.
#### Imagens
Em **IMAGENS**, carregue o **Ícone** e o **Logotipo** (ambos obrigatórios). As imagens opcionais dependem do estilo do passe.
Clique em **Escolher arquivo** ao lado de cada espaço de imagem. Carregue arquivos PNG ou JPEG. O Pushwoosh processa cada imagem nas resoluções que a Apple exige (@1x, @2x, @3x) quando gera o passe.
### Preencha os campos do passe
Em **CAMPOS DO PASSE**, adicione o texto e os valores que aparecem no passe. Os grupos que você vê dependem do estilo do passe:
* **Campos de cabeçalho (topo do passe):** Cartão de Embarque, Ingresso para Evento
* **Campos primários (conteúdo principal):** todos os estilos
* **Campos secundários (informações de suporte):** todos os estilos
* **Campos auxiliares (detalhes extras):** todos os estilos
* **Campos do verso (lado oposto do passe):** todos os estilos
Clique em **+ Adicionar Campo** em cada grupo que você precisar.
Para cada campo, defina:
| | |
| :---- | :---- |
| Chave (ID) | Identificador de campo único (gerado automaticamente). |
| Rótulo | Rótulo curto no passe (por exemplo, `DE`). |
| Valor | Valor exibido no passe (por exemplo, `SFO`). |
| Mensagem de alteração | Texto na notificação de atualização quando este valor muda. Exibido apenas quando o valor muda. Use `%@` para o novo valor (por exemplo, `Portão alterado para %@`). |
No cartão do campo, clique em **Formatar** para mostrar as opções de formatação. Clique em **X** para remover o campo.
#### Opções de formatação
* **Formato do valor:** Texto, Data e hora ou Número/moeda.
* **Alinhamento do texto:** Padrão (Natural), esquerda, centro ou direita.
* **Detectores de dados** *(apenas campos do verso):* transformam números de telefone, links, endereços e eventos de calendário em conteúdo tocável nos campos do verso.
### Adicione um código de barras
Em **CÓDIGO DE BARRAS**, escolha um formato e insira os dados a serem codificados:
1. **Formato do Código de Barras:** escolha a aparência do código de barras e que tipo de scanner pode lê-lo.
* **Código QR (recomendado):** código quadrado que a maioria dos telefones e scanners lê facilmente. Melhor para cupons, cartões de fidelidade e a maioria dos passes.
* **PDF417:** código de barras largo composto por várias fileiras de linhas. Frequentemente exigido para cartões de embarque de companhias aéreas ou de trânsito.
* **Asteca:** código quadrado compacto, semelhante ao QR. Comum em ingressos de eventos e de trânsito.
* **Código 128:** código de barras clássico de linhas verticais. Escolha este apenas se o seu scanner ou sistema de PDV exigir um código de barras 1D.
2. **Mensagem do Código de Barras:** o valor codificado no código de barras (por exemplo, um número de ingresso ou de membro).
3. **Texto Alternativo (opcional):** texto exibido abaixo do código de barras no passe.
### Defina a expiração e o status
Em **EXPIRAÇÃO E STATUS**, controle quando o passe é exibido, quando expira e se ainda é válido:
* **Data Relevante (quando mostrar o passe):** data e hora em que o passe pode aparecer na tela de bloqueio.
* **Data de Expiração (quando o passe expira):** data e hora após a qual o passe fica esmaecido na Wallet.
* **Marcar como Anulado (invalidar este passe):** caixa de seleção para invalidar o passe para que não seja mais utilizável.
### Opções específicas de estilo e avançadas
* **Tipo de trânsito** *(apenas Cartão de Embarque):* Aéreo, Trem, Ônibus, Barco ou Genérico.
* **Identificador de agrupamento:** agrupa passes relacionados na Wallet.
### Relevância baseada em localização *(opcional)*
Em **RELEVÂNCIA BASEADA EM LOCALIZAÇÃO**, o passe aparece quando o usuário está perto dos locais que você adiciona. Para cada local, defina o texto exibido na tela de bloqueio quando o usuário estiver próximo. Você pode adicionar até 10 locais.
Clique no mapa, pesquise um endereço, cole coordenadas ou importe uma geozona para adicionar um ponto. Arraste o marcador para ajustar a posição.
Uma **distância máxima** (em metros) controla o quão perto o usuário deve estar para que o passe permaneça relevante.
**Exemplos de casos de uso**
* **Varejo:** um cartão de fidelidade ou cupom aparece quando o cliente está perto da sua loja. O texto da tela de bloqueio pode dizer que ele está perto da loja e lembrá-lo de usar o passe.
* **Eventos:** um ingresso para evento aparece quando o usuário está perto do local (estádio, teatro ou área do festival) para que ele possa encontrar o passe rapidamente na entrada.
* **Viagem:** um cartão de embarque se torna proeminente perto do aeroporto ou terminal de partida, para que o passageiro veja os detalhes do portão ou do voo na tela de bloqueio antes de abrir a Wallet.
* **Hotelaria:** um cupom ou passe de membro pode aparecer perto de um café ou hotel que você definir.
### Insira um ID de Usuário
Insira o [ID de Usuário](/pt/product/pushwoosh-knowledge-hub/users-userids/#how-are-users-and-devices-related) do Pushwoosh para a pessoa que receberá este passe. O Pushwoosh emite o passe para esse usuário e o lista em **USUÁRIO** em **Todos os passes**.
### Pré-visualizar e validar
Uma **pré-visualização ao vivo** é atualizada conforme você edita, para que você possa ver aproximadamente como o passe ficará na Wallet.
Para verificar o passe em relação às especificações da Apple sem criá-lo, clique em **Validar passe**. O construtor sinaliza imagens obrigatórias ausentes e outros problemas.
## Gerar o passe
Selecione **Gerar**. O Pushwoosh valida o passe, processa as imagens e assina o pacote. A geração leva alguns segundos, após os quais o passe aparece na sua lista de passes.
Para editar (incluindo atualização por número de série), baixar, compartilhar e excluir passes após a geração, consulte [Gerenciar passes existentes](/pt/product/messaging-channels/apple-wallet-passes/#view-and-manage-existing-passes).
## Gerenciar passes via API
Tudo o que o construtor de passes faz também está disponível através da [API PassKit Designer](/pt/developer/api-reference/apple-wallet-passkit-api/): criar, atualizar, listar, baixar e excluir passes.