---
title: "Visualizar o seu App a partir do back office"
description: "Oferecemos várias maneiras de visualizar suas modificações quando você está trabalhando no seu app.  As pré-visualizações permitem ver modificações imediatas* f"
canonical_url: "https://pt.goodbarber.com/help/shop/testar-seu-app-antes-de-publicar-r7/visualizar-o-seu-app-a-partir-do-back-office-a87/"
lang: pt
---

# Visualizar o seu App a partir do back office

Source: https://pt.goodbarber.com/help/shop/testar-seu-app-antes-de-publicar-r7/visualizar-o-seu-app-a-partir-do-back-office-a87/

Oferecemos várias maneiras de visualizar suas modificações quando você está trabalhando no seu app.
As pré-visualizações permitem ver modificações imediatas* feitas no seu back office.

**Essas alterações só serão visíveis para os seus usuários, depois de você atualizar as configurações clicando no botão "Atualizar agora" no canto superior direito.*


- **A pré-visualização do back office** visível a partir da coluna principal do seu back office (com base na versão Progressive Web App (PWA)

- **O modo de pré-visualização** acessível a partir do botão "**Pré-visualização**" no canto superior direito (com base na versão Progressive Web App (PWA))

![](https://cmsphoto.ww-cdn.com/superstatic/1878443/art/default/34458515-31506020.jpg?v=1782311465.5374713)

**Uma janela de pré-visualização é aberta.**

Selecione o tipo de pré-visualização na barra superior do modo de pré-visualização::

- Telefone
- Tablet
- Computador portátil
- Navegador

## 1. Pré-visualização do Celular

É desta forma que o seu app aparecerá num celular. Contudo, tenha em mente que o design do seu app é automaticamente adaptado para cada tamanho de tela, por isso o app real pode aparecer um pouco diferente, consoante o tamanho da tela em que é exibido.

![](https://cmsphoto.ww-cdn.com/superstatic/1878443/art/default/34458515-31506022.jpg?v=1782311465.5534716)

## 2. Pré-visualização do Tablet

Este é o modo como seu app será exibido em tablets.
O modo paisagemencontra-se disponível para tablet. Para modificar a orientação da tela utilize o botão azul no topo direito da pré-visualização.

![](https://cmsphoto.ww-cdn.com/superstatic/1878443/art/default/34458515-31506023.jpg?v=1782311465.5734715)

## 3. Pré-visualização do Laptop

A pré-visualização do computador portátil, tal como o nome indica, é o modo como o seu PWA será mostrado num computador portátil. É mais estreita do que uma pré-visualização de desktop regular.
​

![](https://cmsphoto.ww-cdn.com/superstatic/1878443/art/default/34458515-31506024.jpg?v=1782311465.5854716)

## 4. Pré-visualização do Browser

A pré-visualização do Browser é o tamanho mais amplo e permite que você veja e teste o app como ele aparece num navegador.
Clique no ícone do planeta para abrir a visualização do navegador em uma nova aba do seu navegador, ele irá abrir a mesma página que a que você estava vendo na pré-visualização do back office.

*Nota: quando no modo de visualização, um banner é exibido na parte superior da tela.*

![](https://cmsphoto.ww-cdn.com/superstatic/1878443/art/default/34458515-31506025.jpg?v=1782311465.6014717)