Design de projeto adaptável

Criar um projeto responsivo com o Adobe Captivate lhe oferece atão necessáriavantagem sobre os concorrentes. Utilize os recursos de autoriaapenas uma vez e o conteúdo se reorganizará para ser visto no tablet e em dispositivos móveis. Comece com uma tela em branco, grave um dispositivo iOS ou até mesmo importe um storyboard usando o Adobe Captivate Draft. Forneça experiências de aprendizado multiscreen, específicas ao local e de acordo com o dispositivo, sem precisar de programação.

Crie uma experiência de aprendizado envolvente para os alunos e deixe o aprendizado interessante e interativo.

Fluid Boxes no Adobe Captivate

O que é uma Fluid Box

Na versão 2017 do Adobe Captivate, uma Fluid Box é um modo de layout que fornece a organização dos objetos em um slide de forma que eles se comportem de maneira previsível quando o slide se ajusta aos diferentes tamanhos de tela e dispositivos. Uma Fluid Box é um modelo de layout fácil de usar para designers de e-learning. Você pode dispor objetos secundários em qualquer direção e ter a flexibilidade de se adaptar aos espaço de exibição.

Um contêiner de Fluid Box expande os objetos para preencher o espaço livre disponível ou contrai os objetos para impedir que excedam os limites. Os elementos de uma Fluid Box não dependem da direção. Os objetos podem se adaptar ao espaço disponível.

Usar Fluid Box no Captivate

No Captivate, você pode inserir um layout de Fluid Box vertical ou horizontalmente em um projeto responsivo. Dependendo do tamanho da tela, os objetos em um contêiner de Fluid Box aumentam ou diminuem sem comprometer a largura da tela.

Na versão 2017 do Adobe Captivate, há dois novos itens na barra de menus Objetos.

  1. Layout horizontal da Fluid Box
  2. Layout vertical da Fluid Box

Layout horizontal da Fluid Box

Neste exemplo, você cria um layout com uma Fluid Box com quatro bolas de bilhar. A exibição muda conforme você visualiza o projeto em um dispositivo diferente.

  1. Crie um único layout horizontal. Este layout se torna uma Fluid Box principal.

  2. Coloque as bolas de bilhar na Fluid Box uma de cada vez a partir da biblioteca.

  3. No painel Inspetor de propriedades, as seguintes propriedades da Fluid Box estão ativadas:

    1. Estático: se selecionar essacaixa de seleção, os objetos dentro da Fluid Box se sobrepõem e podem ser movidos para qualquer lugar dentro da Fluid Box.

      Opcional: se selecionar essacaixa de seleção, um objeto desaparece sempre que sua largura é atingida. Opcional funciona somente com um tipo de quebra, Encaixar em uma linha ou Encaixar em uma coluna.

    2. Fluxo: indica a direção em que os objetos são colocados em uma Fluid Box. Em um fluxo horizontal, os objetos são apresentados horizontalmente. Da mesma forma, em um fluxo vertical, os objetos são dispostos verticalmente.

      1. Horizontal: selecione as opções de alinhamento horizontal dos objetos ao longo do eixo principal. As opções são:

      2. Alinhar à esquerda: os objetos são alinhados à esquerda. O primeiro objeto está no início do eixo.

      3. Centralizar: os objetos ficam centralizados ao longo do eixo

      4. Alinhar à direita: os objetos são alinhados à direita. O último objeto está no final do eixo.

      5. Espaço no meio: os objetos são distribuídos uniformemente ao longo do eixo; o primeiro objeto está no início do eixo e o último objeto está no final do eixo.

      6. Espaço ao redor: os objetos são distribuídos uniformemente ao longo do eixo com espaço igual em torno deles.

    3. Preenchimento: adiciona espaço em todos os lados de um objeto. Para adicionar preenchimento horizontal aos objetos, digite o valor do preenchimento em pixels. Valores negativos não são permitidos.

      Distribuir objetos igualmente: clique no botão para garantir que todos os objetos em uma Fluid Box sejam equidistantes e sejam do mesmo tamanho. Por exemplo,

      Objetos antes da distribuição
      Objetos antes da distribuição
      Objetos após a distribuição
      Objetos após a distribuição

    4. Ponto de quebra: um ponto de quebra é um ponto que, quando atingido, quebra ou reorganiza os objetos com uma alteração na largura do dispositivo. Por exemplo, quando o ponto de quebra estiver em 80%, um objeto será reorganizado na Fluid Box em 80% da largura do dispositivo de acordo com as propriedades definidas nas opções de Quebra automática.

      Por exemplo, quando a área de visualização tiver 1024 pixels de largura e o ponto de quebra estiver definido em 50% e quando a largura do dispositivo estiver definida como 512 pixels de largura, os objetos serão reorganizados.

    5. Quebra automática: define quando e como os objetos de uma Fluid Box são quebrados ou reorganizados quando um limite predefinido for atingido. As seguintes opções estão disponíveis:

      1. Quebra para a próxima linha: quando o ponto de quebra atingir o limite, um objeto passa para a próxima linha.

        pic1
      2. Encaixar em uma linha: quando o ponto de quebra atingir o limite, os objetos não alteram suas posições. Os objetos ajustam seus tamanhos de acordo com as dimensões do dispositivo.

        pic2
      3. Uma linha/coluna: quando o ponto de quebra atingir o limite, os objetos se alinham em uma coluna.

        pic3
      4. Simétrico: quando o ponto de quebra atingir o limite, os objetos se reorganizam de acordo com o número de objetos na Fluid Box.

        pic4

Layout vertical da Fluid Box

Neste exemplo, você cria um layout com uma Fluid Box com quatro bolas de bilhar. A exibição muda conforme você visualiza o projeto em um dispositivo diferente.

pic5

No painel Inspetor de propriedades, selecione o fluxo de objetos e o tipo de quebra de objetos.

Opções de fluxo e quebra
Opções de fluxo e quebra

Escolha o alinhamento horizontal dos objetos: centro, à esquerda ou à direita.

Opções de alinhamento horizontal
Opções de alinhamento horizontal

Escolha o alinhamento vertical dos objetos.

Opções de alinhamento vertical
Opções de alinhamento vertical

Alinhamento superior

pic9

Alinhamento no meio

pic10

Alinhamento inferior

pic11

Espaço no meio

pic12

Espaço ao redor

pic13

Criar um projeto de Fluid Box com vários contêineres

  1. Crie um projeto responsivo (Arquivo > Novo projeto > Projeto responsivo ou pressione Ctrl+H).

  2. Em um slide em branco, insira um layout de Fluid Box, conforme mostrado a seguir:

    Layout da Fluid Box
    Layout da Fluid Box
  3. Após inserir o layout vertical, clique em qualquer parte do layout. FB_5 é o contêiner principal que representa todo o contêiner do slide. No painel Inspetor de propriedades, você pode ver toda a hierarquia dos contêineres individuais da Fluid Box.

    Fluid Box principal
    Fluid Box principal

    Para modificar os objetos, escolha o contêiner apropriado.

  4. Nos contêineres da Fluid Box, arraste as alças azuis para ajustar o tamanho dos contêineres secundários.

    pic16

    Se você clicar em qualquer outro lugar, as alças azuis desaparecem. Para fazê-las reaparecer, execute um destes procedimentos:

    • Clique em qualquer lugar fora da área de estágio e arraste o mouse até lá.
    • Clique em qualquer lugar na área de estágio e marque a caixa fluida principal na seção Seletor de caixa fluida. É possível ver que as alças retornam.
  5. Insira os objetos nos contêineres conforme mostrado abaixo:

    pic17

    A imagem acima representa um layout de áreas de trabalho (1024x627). Para verificar como este layout se comporta em outros dispositivos, mova o controle deslizante na parte superior para ver as alterações no layout.

    Se visualizar o projeto em dispositivos diferentes, você poderá ver que os contêineres da Fluid Box se alinham de forma inteligente à largura do dispositivo.

    pic18

    No caso de um dispositivo com largura menor:

    pic19

    Se o texto especificado em uma caixa de texto ultrapassa o limite da caixa para se adaptar à alteração na largura do dispositivo, é exibido um botão na parte inferior do contêiner de texto. Clique nesse botão para ver o texto completo. Por exemplo, neste caso, o texto é exibido como:

    pic20

Observação:

Não é possível copiar um slide com objetos em uma Fluid Box ecolá-loem um projeto em branco ou responsivo. Como alternativa, clique com o botão direito do mouse na Fluid Box, escolhaSelecionar tudo e cole os objetos em um slide em branco ou responsivo.

Observação:

Se houver um único objeto em uma Caixa fluida, não é possível redimensionar o objeto. É possível exibir as alças vermelhas ao redor do objeto, o que significa que o objeto não pode ser redimensionado.

Modificar a largura de uma Fluid Box

Você pode modificar a largura de uma Fluid Box alterando os valores no painel Posição no Inspetor de propriedades.

Por exemplo, se a largura de uma Fluid Box secundária for 33,3% da Fluid Box principal ou 341 px, você pode alterá-la para os valores que você deseja e as alterações serão, portanto, refletidas na cena.

Antes de alterar a largura
Antes de alterar a largura
Depois de alterar a largura
Depois de alterar a largura

Observação:

No painel Posição, se digitar um valor maior que o valor máximo permitido, o valor é restaurado para o valor original.

Automatic Device Preview

Hit the play button to see your content automatically change shape and form factor across the full spectrum of device sizes. See how responsive your content is on every screen size.

Click the Layout Preview button to see your content automatically wrap, scale and align across device sizes.

Live device preview
Live device preview

You can also use the same option in the Wrap properties. Change the wrap property for the Fluid Box and click the Layout Preview button to check out the new wrapping behavior.

Ativar o ponto de quebra de Fluid Boxes

Como discutido na seção anterior, um ponto de quebra é um ponto de quebra é um ponto que, quando atingido, quebra ou reorganiza os objetos com uma alteração na largura do dispositivo.

Por exemplo, quando o ponto de quebra estiver em 80%, a 80% da largura do objeto, um objeto será reorganizado na Fluid Box de acordo com as propriedades definidas nas opções de quebra.

Geralmente, em projetos de e-learning visualizados em dispositivos, é desejável que os objetos sejam quebrados em mais de uma Fluid Box. Embora você possa facilmente definir um ponto de quebra em uma Fluid Box, a capacidade de definir pontos de quebra em várias caixas fluidas oferece mais flexibilidade ao desenvolver projetos de e-learning.

Para configurar um ponto de quebra nas Fluid Boxes, clique em Editar > Preferências, ou pressione Shift + F8 para abrir a caixa de diálogo Preferências.

Ativar ponto de quebra
Ativar ponto de quebra

Selecione Ativar ponto de quebracaixa de seleçãoe clique em OK. Reinicie o Captivate.

No projeto, ao adicionar várias Fluid Boxes e objetos dentro de cada Fluid Box, você verá que os pontos de quebra podem ser ativados em cada Fluid Box.

Ao mover os controles deslizantes, os objetos quebram-se no ponto exato do limite especificado.

Quebra de objetos em cada Fluid Box
Quebra de objetos em cada Fluid Box

Captura responsiva

Barra de reprodução responsiva

Torne os controles dabarra de reproduçãoresponsivos. Em Windows>Editor de capa, você pode criar uma capa personalizada alterando os controles dabarra de reproduçãoe salvando as alterações como um tema. Agora, você pode fazer com que os controles dabarra de reproduçãosejam exibidos de forma diferente nas vistas Principal, Tablet e Dispositivos móveis.

Para ver diferentes controles dabarra de reproduçãoem cada uma das saídas das vistas Principal, Tablet e Dispositivo móvel, personalize a variável cpMobilePlaybar.

 

  1. Vá até a localização da barra de reprodução:

    C:\Program Files\Adobe\Adobe Captivate 8 x64\pt_BR\Gallery\Playbars\HTML\cpPlaybarMobileStep text

    Observação:

    A localização varia de acordo com o diretório de instalação em seu computador.

  2.  Crie um backup da barra de reprodução que deseja alterar.

  3. Abra o arquivo playbarScript.js

    cp.responsiveButtons = 
    {
    	//"ButtonName"	: 	[Primary,Tablet,Mobile],
    	"Rewind"		: 	[true,true,false],
    	"Backward"		: 	[true,true,true],
    	"Play"			: 	[true,true,true],
    	"Slider"		: 	[true,true,false],
    	"Forward"		: 	[true,true,true],
    	"CC"			: 	[true,true,true],
    	"AudioOn"		: 	[true,false,false],
    	"Exit"			: 	[true,true,true],
    	"FastForward"	: 	[true,true,false],
    	"TOC"		: 	[true,true,false]
    };
  4. Caso você deseje que cada um dos botões de controle da barra de reprodução apareçam nas vistas Principal, Tablet e Dispositivos móveis, altere o código acima para [true,true,true] para todos os botões. Salve e feche o arquivo.

    Por exemplo, se você desejar que o “Controle deslizante” somente apareça em vistas do Tablet e Dispositivos móveis, então edite o código como segue:

    "Slider" : [false, true, true] 

    Observação:

    Caso você deseje que uma barra de reprodução diferente seja responsiva, siga o mesmo procedimento acima mencionado, mas primeiro copie a função responsiva no arquivo js.

    A primeira preferência é fornecida para as caixas de seleção no Editor de fundo de tela. Se eles não estiverem selecionados, então a despeito do valor de verdadeiro ou falso, aquele botão não aparece na barra de reprodução.

  5. Reinicie o Captivate e a barra de reprodução será atualizada. 

Captura responsiva (simulação responsiva)

Crie uma única captura de tela que possa ser usada em todas as telas e dispositivos. O Adobe Captivate permite escolher a parte da captura de tela que você desejar exibir em telas menores.

  1. Abrir um projeto adaptável do Captivate

  2. Clique em Slides > Simulação do software

    A janela Gravar slides adicionais é exibida. 

    record-additional-slides
  3. Selecione o slide após o qual o slide gravado será inserido e clique em OK. 

    A tela Captura de tela é exibida. 

  4. Selecione o tipo de gravação como Automático, Demonstração de vídeo ou Manual e clique em Gravar para capturar as telas. 

    Observação:

    Use a gravação manual se desejar selecionar alguma captura de tela durante o processo de gravação. 

    Ao usar a gravação automática, o Adobe Captivate faz a captura de tela automaticamente e as insere em slides separados. A gravação automática é o método de gravação mais usado no Adobe Captivate.

  5. Em Projeto adaptável, clique na exibição Móvel.

    A captura de tela se realinha a si própria e aparece como mostrado aqui: 

    responsive_mobile
  6. É possível observar que o plano de fundo está distorcido.

    Você pode usar uma parte da imagem do plano de fundo na vista para Dispositivo móvel. 

  7. No Inspetor de propriedade, clique em Usar parte da imagem do segundo plano. Você pode mover a captura do slide para a parte do plano de fundo que preferir.

    Agora é possível notar a diferença da exibição anterior.

    background_skew_fix

Conversão de um projeto em branco em um projeto responsivo

  1. Crie um projeto em branco com alguns objetos, conforme mostrado abaixo.

    Novo projeto em branco
    Novo projeto em branco

  2. Para converter o projeto em responsivo, clique em Arquivo > Salvar como responsivo. Você pode ver uma mensagem de aviso sobre os objetos que não têm suporte em um projeto responsivo. Para obter mais informações, consulte Objetos sem suporte em HTML5.

    Clique em Salvar e salve o projeto como um projeto responsivo. Você tem um projeto responsivo novo, conforme mostrado abaixo:

    Novo projeto responsivo
    Novo projeto responsivo

    Arraste o controle deslizante para ver seu projeto em várias exibições.

  3. Se o texto especificado em uma caixa de texto ultrapassa o limite da caixa para se adaptar à alteração na largura do dispositivo, um botão Expandir aparece na parte inferior do contêiner de texto. Clique nesse botão para ver o texto completo. 

    Botão Expandir
    Botão Expandir

  4. No slide responsivo, você pode inserir seu próprio layout de FluidBox (FluidBox > Vertical ou Horizontal) ou clicar em Sugerir FluidBoxes para colocar automaticamente os objetos em contêineres adaptáveis. Se clicar em Sugerir FluidBox, você pode ver que o layout do projeto muda, conforme mostrado abaixo:

    Layout de FluidBox
    Layout de FluidBox

  5. Mova os objetos, coloque-os como quiser e visualize ou publique seu projeto responsivo.

Criar o dispositivo de visualização personalizado

Em qualquer projeto responsivo, o Captivate permite visualizar o projeto nos vários dispositivos, como Desktop, iPhone, iPad e assim por diante.

Você pode criar dispositivos personalizados para visualização além daqueles já fornecidos por padrão.

Para criar um modo de visualização personalizado:

  1. Primeiro, inicie o Captivate como administrador.

    Digite as dimensões necessárias, conforme mostrado abaixo: 

    Dimensões personalizadas de visualização
    Dimensões personalizadas de visualização

  2. Para adicionar a visualização na lista de modos de visualização, clique em + ao lado dos campos de dimensão. Você pode ver a seguinte caixa de diálogo:

    Novo dispositivo de visualização personalizado
    Novo dispositivo de visualização personalizado

    Digite um nome, por exemplo, Galaxy S8, e o dispositivo de visualização personalizado agora se torna parte da lista de dispositivos de visualização.

    Para excluir uma visualização personalizada, selecione a visualização e clique em - ao lado dos campos de dimensão.

  3. <?xml version="1.0" encoding="UTF-8"?>
    <devicelist>
       <device name="Desktop" width="1024" height="627" candelete="0"/>
       <device name="iPhone6" width="375" height="667" candelete="0"/>
       <device name="iPad" width="768" height="1024" candelete="0"/>
       <device name="Galaxy S7" width="360" height="640" candelete="0"/>
       <device name="Nexus 5x" width="412" height="732" candelete="0"/>
       <device name="Galaxy S8" width="1000" height="1000" candelete="1"/>
    </devicelist>
    
  4. Adicione ou exclua uma visualização personalizada usando os atributos de nome, largura e altura.

  5. Reinicie o Captivate e você poderá ver as alterações refletidas na lista suspensa Visualizar em.

    Lista suspensa Visualizar
    Lista suspensa Visualizar

Pontos de interrupção no projeto responsivo

Crie conteúdo com cinco pontos de interrupção: 

  • Desktop com viewport de 1024x627,
  • Orientação paisagem no tablet com uma viewport de 896 x 627
  • Orientação retrato no tablet com uma viewport de 768 x 627
  • Orientação paisagem no dispositivo móvel com uma viewport de 667 x 410, e
  • Orientação retrato no dispositivo móvel com uma viewport de 360 x 460

Visualize a saída usando Reproduzir slide nos respectivos layouts de dispositivo. Publique conteúdo como HTML5.

O Adobe Captivate permite arrastar e soltar objetos com uma experiência perfeita em todas as três exibições de ponto de interrupção em projetos adaptáveis. 

Para obter informações sobre as propriedades específicas de visualização do projeto Responsivo, consulte Propriedades específicas de visualização.

Você pode exibir o painel Alinhar ao clicar em Janela > Alinhar.

Como criar um Projeto adaptável

  1. Após iniciar o Adobe Captivate, clique na primeira miniatura na tela inicial, Projeto responsivo e clique em Criar. 

    Como alternativa, você pode escolher Arquivo > Novo projeto > Projeto responsivo.

  2. Para navegar através dos diferentes pontos de interrupção, clique nos ícones de Desktop, Tablet e Dispositivo móvel no layout Projeto responsivo.

    Você pode exibir a área do projeto responsivo dividida em seis pontos de interrupção exclusivos, como mostrado na captura de tela abaixo. Cada área de ponto de interrupção é um espaço de criação único.

    responsive_layout
    Pontos de interrupção disponíveis

Design adaptável (posicionamento inteligente)

Há controles deslizantes disponíveis no início e no fim de cada ponto de interrupção.

Por padrão, cinco pontos de interrupção estão disponíveis para você criar conteúdo.

Você pode criar conteúdo para qualquer dispositivos maior do que o tamanho da viewport do layout do dispositivo móvel ao aumentar o tamanho bastando arrastar o controle deslizante.

Observação:

Qualquer tamanho superior ao do visor padrão terá o layout do próximo visor de maior tamanho.
Por exemplo: considere que você deseja usar o visor de dispositivo móvel 450 x 450, em vez dos valores padrão. Nesse caso, como valor é superior ao tamanho para Móvel e inferior ao Tablet, a visualização adotará o layout do Tablet.

O posicionamento inteligente é permitido entre pontos de interrupção. O Adobe Captivate permite visualizar os projetos com uma experiência perfeita entre os pontos de interrupção. Em outras palavras, os usuário não observam qualquer atraso de tempo na visualização da saída ao passar de uma vista para a outra entre os pontos de interrupção.

Personalizar cores do tema

É possível escolher as cores de tema predefinidas ou personalizar cores de tema para criar seu próprio esquema de cores.

  1. Na barra de ferramentas, clique em Temas > Cores do tema

  2. Escolha uma das cores de tema predefinidas no menu Selecionar cor do tema e clique em Personalizar. A janela Personalizar cores do tema será exibida, conforme mostrado abaixo:

    theme-colors
  3. Escolha o componente do qual se deseja alterar as cores.
    É possível alterar as cores de cada componente do slide, como o título, a capa, o subtítulo, o fundo do slide.

  4. Você pode escolher a cor com a ajuda das ferramentas Sombras, ou Amostras, Seletor de cor ou Conta gotas.

  5. Clique no título do tema predefinido e escolha um nome para o título.

  6. Clique em Salvar.
    Agora, a cor de tema personalizada será exibida na lista suspensa.

    É possível usar o ícone circular de configurações para gerenciar as cores de tema: excluir, renomear.

Altura do dispositivo

Defina vários planos de fundo em diversos visores através da inclusão/exclusão de objetos.

Você também pode definir a altura do dispositivo para cada layout ao selecionar a caixa de seleção Altura do dispositivo no Inspetor de propriedade. Se Altura do dispositivo estiver selecionado, você poderá ver a borda amarela para cada layout, coo mostrado nas capturas de tela abaixo para o layout Dispositivos móveis.

device_height
Definir a altura do dispositivo

device_height_view

A altura do slide pode ser vinculada à altura do dispositivo clicando no ícone de vinculação próximo à altura do dispositivo na janela Propriedades, conforme mostrado na tela abaixo. Altere a altura do slide para vista específica ou todas as vistas. 

slide-height-link

Altura do slide

O Adobe Captivate também permite que você personalize a altura da viewport conforme a altura do dispositivo.

A altura do visor é a altura do layout da página para as opções Principal (Desktop), Tablet e Dispositivos móveis. É possível ajustar essa altura de acordo com a altura de qualquer dispositivo com a ajuda da opção Altura do Slide nas propriedades.

Observação:

Desvincule a altura do slide da altura do dispositivo para alterá-la.

Personalização da altura do slide

Vamos supor que a altura do visor e a altura do dispositivo para o layout dispositivo móvel seja 415. Considere um casoem que aaltura do dispositivo é 500. Você poderá ajustar a altura da viewport ao mover o controle deslizante de altura do dispositivo na vertical até alcançar 500. Por padrão, a altura do dispositivo é vinculada à altura do slide. Você pode desvincular a mesma ao clicar no ícone de link junto ao valor Altura do slide no Inspetor de propriedade.

Nesse caso, todo o conteúdo dentro da altura do visor ficará visível no dispositivomóvelpor padrão. Portanto, essa alternativa permite desenvolver conteúdo de maneira precisa no layout, acompanhando a altura do dispositivo.

Se a altura da viewport for maior do que a altura do dispositivo, então o conteúdo além da altura do dispositivo será visível para o usuário final com a ajuda de uma barra de rolagem no dispositivo.

Agora, é possível alinhar qualquer objeto nocentrodo slide em todos os pontos de interrupção de projetos responsivos. As opções de alinhamento central horizontal e vertical são inseridas no Captivate 9.

  1. Inserir qualquer formato inteligente no slide principal do ponto de interrupção. 
  2. Clique na guia de posição de exibição e formato inteligente noInspetor depropriedade. 
  3. Clique em Avançado. É possível exibir as opções de alinhamento central horizontal e vertical, conforme mostrado na captura instantânea. 

Alinhar objetos

Agora, é possível alinhar qualquer objeto no centro do slide em todos os pontos de interrupção de projetos responsivos usando as opções de alinhamento central horizontal e vertical do Captivate.

  1. Insira qualquer forma ou objeto no slide principal do ponto de interrupção.

  2. Selecione-o e visualize o painel Posição no Inspetor de propriedade. Clique em Avançado.

  3. Clique em Avançado. 

    alignment
    Opções de alinhamento vertical e horizontal da imagem

    É possível exibir as opções de alinhamento central horizontal e vertical, conforme mostrado na captura instantânea. 

    vertical_horizontal
    Opções de alinhamento

  4. Você pode escolher opções de alinhamento do centro horizontal e vertical ao clicar com o botão direito do mouse no objeto e selecionando Alinhar como aqui mostrado.

    right-click-centeralign
  5. Como alternativa, você pode usar os ícones no painel Alinhar janela como aqui mostrado. 

    Observação:

    Ative o painel Exibir Alinhar ao clicar em Janela > Alinhar.

    align-panel

    Alinhamento central horizontal - Caso este alinhamento seja aplicado, é possível mover o objeto somente na direçãoverticalno slide. Seu movimento horizontal é restrito.

    Alinhamento central vertical - Caso este alinhamento seja aplicado, é possível mover o formato somente na direçãohorizontalno slide. Seu movimento vertical é restrito.

    Alinhamento central horizontal e vertical - se você aplica ambos os alinhamentos, então omovimentofica restrito nas duas direções. 

    A codificação por cores das opções de alinhamento central e vertical é suportada. A cor da borda de duas opções de caixa de seleção acessa o esquema de cores doponto de interrupçãoem que as opções de alinhamento são escolhidas.

Observação:

Se você tiver múltiplas formas, poderá alinhar um único objeto no centro do slide e vincular o restante dos objetos ao objeto centralizado para obter o slide centralizado com fluxogramas em todos os pontos de interrupção.

Se você desalinhar a opção de centralização horizontal ou vertical, o objeto não se move de volta à sua posição original. 

Definir cores de legenda padrão

Você pode definir diferentes cores padrão para o texto da legenda para as vistas dos pontos de interrupção.

  1. Selecione Editar > Gerenciador de estilo do objeto

  2. Selecione Estilo de legenda padrão

  3. Em Formato do texto, clique na caixa suspensa junto a Pontos de interrupção e escolha Desktop, Orientação retrato no tablet ou Orientação retrato no dispositivo móvel.

  4. Escolha a cor para cada ponto de interrupção.

Capturar suporte a interações

É possível capturar interações em todas as vistas e definir o foco automático para uma área de interação específica em todas as vistas. Defina uma forma inteligente como imagem de fundo no projeto adaptável. É possível definir a área de corte da imagem de fundo em várias vistas.

Slides de Perguntas e Resultados, junto com os Slides mestres, são perfeitamente compatíveis com todas as exibições do Projeto adaptável.

As propriedades responsivas e os Temas são permitidos em slides de Perguntas.

Um símbolo da estrela indica um estilo substituído na área Texto de amostra do Inspetor de propriedades.

Interação de arrastar e soltar

O Adobe Captivate suporta as interações de arrastar e soltar para projetos responsivos.

Interações de arrastar e soltar oferecem uma maneira interessante e de acessar o conhecimento dos seus usuários. Esta interação permite que o usuário responda a perguntas arrastando e soltando objetos nas áreas ou objetos designados.

Toda interação de arrastar e soltar envolve uma fonte de arrastar e um destino de soltar. Os usuários arrastam as fontes de arrastar e soltam em destinos de soltar.

No projeto responsivo, você pode executar o Assistente de Interação de Arrastar e Soltar ao escolher Inserir > Iniciar o Assistente de Interação de Arrastar e Soltar. Você também "pode" escolher Interações > Arrastar e soltar, conforme mostrado na captura instantânea abaixo: 

drag-n-drop

Todos os recursos da interação de arrastar e soltar em projetos adaptáveis são semelhantes aos projetos em branco. Para obter mais informações sobre como criar uma interação de arrastar e soltar, além de conhecer vários recursos de interação e as melhores práticas, consulte Interações de arrastar e soltar. 

Baixar projetos de amostra

Esta obra está licenciada sob uma licença não adaptada da Creative Commons Attribution-Noncommercial-Share Alike 3.0  As publicações do Twitter™ e do Facebook não são cobertas pelos termos do Creative Commons.

Avisos legais   |   Política de privacidade online