Modo de Visualização

O Modo de Visualização é iniciado no Visualizador do Moqups e é usado para apresentar o trabalho final ou para habilitar Interações nos seus protótipos.

Neste artigo, você aprenderá como entrar e sair do Modo de Visualização – e como abrir um projeto diretamente na Visualização. Você também aprenderá sobre as ações que pode realizar enquanto está no Modo de Visualização.

Entrar e sair do modo de visualização

Na maioria das vezes, você provavelmente desejará entrar no Modo de Visualização a partir do Editor, enquanto está trabalhando ativamente em um projeto. No entanto, às vezes, pode querer abrir um projeto diretamente no Modo de Visualização – especialmente ao apresentar. Abordaremos cada caso abaixo.

Entrar no Modo de Visualização a partir do Editor

Existem duas maneiras de visualizar um projeto em que você está trabalhando atualmente:

  1. Navegue até a Barra de Ferramentas Superior e, à direita, selecione Visualização ou...

    01.PreviewMode-EnterfromTopToolbar.png

  2. Abra o Menu Principal do Moqups e selecione Visualização ou...

    02.PreviewMode-enterfromMainMenu.png

  3. Use o atalho de teclado: Ctrl/Cmd + P

Abrir Projeto Diretamente na Visualização

  1. Clique no botão Menu Principal do Moqups

  2. Clique em Abrir Projetos para abrir a Janela de Projetos no Dashboard

  3. Na visualização em Miniatura, passe o cursor sobre o projeto que deseja visualizar e clique em Visualizar

    ou

    Na visualização em Lista, clique no botão Visualizar à extrema direita do título do projeto

03.PreviewMode-OpenProjectDirectlyinPreview.gif

Sair do Modo de Visualização

Para sair da Visualização:

  • Pressione a tecla Esc

    ou

  • Navegue até a extrema direita da Barra de Ferramentas Superior e clique em Editar Projeto

04.PreviewMode-Exit2x.png

Zoom, selecionar texto e mostrar hotspots

Zoom

Para ampliar e reduzir, use o ícone de Lupa e clique no sinal de mais ou menos.

05.PreviewMode-Zoom2x.png\

Você também pode aplicar zoom usando dois dedos no touchpad (ou Cmd/Ctrl + Roda do Mouse). Ao usar o teclado ou a barra de ferramentas, o zoom centraliza em um objeto quando você tem um selecionado.

Manter a tecla Shift pressionada enquanto pressiona o ícone de Lupa ajustará a largura da página para preencher a janela do Editor.

Selecionar Texto

Se você estiver visualizando um projeto no modo de Visualização e quiser copiar texto, pode usar o recurso Selecionar Texto.

Para habilitar Selecionar Texto, clique no ícone Selecionar.

06.PreviewMode-Select2x.png

Mostrar Hotspots

Clicar no ícone de Hotspots torna todos os hotspots da página temporariamente visíveis. Isso permite localizar rapidamente a posição deles.

07.PreviewMode-Hotspots2x.png

Para tornar os Hotspots visíveis por um período mais longo, mantenha pressionada a tecla Shift e eles aparecerão.

Ir para tela cheia

Quando você estiver apresentando ou exibindo seu trabalho como um protótipo interativo, pode querer ocultar a interface do Moqups, incluindo a Barra Lateral Esquerda e a Barra de Ferramentas Superior.

Ou, pode querer ir ainda mais longe, ocultando tanto a janela do navegador quanto a barra de menu do seu dispositivo – permitindo que seu projeto preencha completamente a tela.

08.PreviewMode-Fullscreen2x.png

Para ocultar a interface do Moqups, navegue até a Barra de Ferramentas Superior e clique em Tela Cheia.

Para ocultar a janela do navegador e a barra de menu do dispositivo, mantenha pressionada a tecla Option/Alt enquanto clica no botão Tela Cheia.

Para sair do modo Tela Cheia, pressione Esc.

Você pode navegar pelas páginas do seu projeto usando o Painel de Páginas ou a Barra de Ferramentas Superior.

Painel de Páginas

No Modo de Visualização, o Painel de Páginas pode ser aberto usando o botão na barra de ferramentas superior.

Para navegar pelas páginas do seu projeto, clique no título delas ou use o campo de pesquisa para encontrar páginas específicas.

09.PreviewMode-PagesPanel.gif

Observe que, no Modo de Visualização, páginas e pastas ocultas não aparecem no Painel de Páginas. Isso ajuda a eliminar distrações visuais enquanto você apresenta seu trabalho, ou quando as partes interessadas visualizam seus projetos por meio de links compartilhados.

Se você mantiver pressionada a tecla Fn, pode usar as teclas de seta para cima e para baixo para subir ou descer pela Árvore de Páginas.

Barra de Ferramentas Superior

No canto extremo direito da Barra de Ferramentas Superior, você pode navegar pelas páginas usando os botões de seta esquerda e direita. Você também pode ir diretamente para uma página inserindo seu número no campo de navegação.

10.PreviewMode-TopToolbar2x.png

Como alternativa, você também pode usar as teclas de seta esquerda e direita do teclado.

Comentários na visualização

Quando estiver no Modo de Visualização, o Painel de Comentários pode ser aberto usando botões ao longo da barra de ferramentas superior – para que você possa adicionar, ler e responder a comentários sem precisar voltar ao Modo de Edição.

O acesso aos Comentários na Visualização é essencial para colaboradores que têm apenas direitos de Visualização. Embora não possam entrar no Modo de Edição, ainda podem dar feedback e colaborar com outras partes interessadas.

Você pode criar um comentário no Painel de Comentários ou diretamente na página.

Para criar um comentário usando o Painel de Comentários:

  1. Navegue até a Barra Lateral Esquerda e clique na Aba de Comentários
  2. A aba ficará azul e abrirá o Painel de Comentários
  3. No topo do Painel de Comentários, clique no ícone Adicionar Comentário
  4. Um Marcador de Comentário numerado aparecerá na página e ficará vermelho pulsante
  5. Digite no campo de comentário e pressione Enviar

11.PreviewMode-CommentsfromPanelinPreview.gif

Para deixar um comentário diretamente na página:

  1. Clique com o botão direito na área da página onde deseja colocar o comentário
  2. Selecione Adicionar Comentário Aqui no Menu de Contexto
  3. Digite no campo de comentário e pressione Enviar

12.PreviewMode-AddcommentonPage.gif

Para aprender mais sobre como formatar e editar comentários – e como gerenciar seus tópicos de comentários resolvendo, reabrindo, filtrando, ocultando e excluindo – acesse nossa seção de Comentários.