O painel ShopIA é responsivo e adaptado para mobile, com algumas diferenças em relação ao desktop. Esta página descreve a experiência mobile, o que está disponível e quando recomendamos abrir no desktop.
Compatibilidade
| Dispositivo | Suporte |
|---|---|
| Smartphone (iOS 14+, Android 9+) | Total |
| Tablet (iPad, Android 9+) | Total |
| Desktop | Total (recomendado para configuração) |
| Navegadores antigos (IE 11, etc.) | Não suportado |
Recomendamos navegadores modernos: Chrome, Safari, Firefox, Edge na versão atualizada.
Padrões de navegação mobile
Sidebar vira drawer
Em telas menores que 768px, a sidebar vira menu drawer:
- Ícone de menu (≡) no canto superior esquerdo
- Toque abre menu de navegação
- Toque fora fecha
Bottom nav simplificada
5 itens principais ficam na barra inferior:
- Painel
- Oportunidades
- Memo
- Otto
- Configurar
Acesso rápido sem abrir drawer.
Header compacto
- Logo da loja à esquerda
- Sininho de avisos no centro
- Avatar do usuário à direita
O que funciona bem no mobile
Visualização de dados
- Painel principal adaptado em cards verticais
- Resultados ROI em grids responsivos
- Métricas em formato simplificado
- Listagens de pedidos, clientes, produtos
Aprovação rápida
- Aprovar newsletter sugerida (botão grande)
- Aprovar otimização do Turbinador
- Confirmar publicação de campanha
- Responder avisos
Memo via WhatsApp
A interface principal do Memo é o WhatsApp, não o painel. Mobile não muda nada — você fala com o Memo no WhatsApp como sempre.
Avisos e notificações
- Sininho com badge funciona normalmente
- Página de avisos otimizada para listagem mobile
O que recomendamos no desktop
Configuração inicial
Tela pequena dificulta:
- Configurar DNS (DKIM, SPF, DMARC)
- Cadastrar plataforma (preencher múltiplos campos)
- Definir DNA da marca em detalhe
- Configurar segmentação complexa
Faça essas operações no desktop. Mobile fica para acompanhamento e ajustes pontuais.
Edição de newsletter
Editor visual de newsletter funciona em mobile, mas o resultado é melhor avaliado no desktop:
- Pré-visualização em tela maior mostra problemas que mobile esconde
- Edição de imagem fica mais precisa com mouse
- Composição de campanha exige foco
Otimização de produto via Turbinador
Comparação lado a lado entre versão atual vs gerada exige tela maior. Mobile mostra empilhado, perdendo o paralelo visual.
App nativo
O ShopIA não tem app nativo no MVP. Acesso é via navegador.
<!-- TODO: confirmar com Gabriel se app nativo entra no roadmap -->
Para acesso rápido em mobile:
- Abra
app.shopia.com.brno navegador - Adicione à tela inicial (Safari iOS: ícone compartilhar > "Adicionar à Tela de Início"; Chrome Android: três pontos > "Adicionar à tela inicial")
- Ícone aparece como app
A experiência fica próxima de app nativo, mas é PWA (Progressive Web App).
Notificações push mobile
Em desenvolvimento. No MVP, notificações chegam via:
- WhatsApp (Memo notifica em mensagens proativas)
- Email (avisos críticos)
- Sininho no painel quando aberto
Push notifications nativas no celular estão no roadmap mas não disponíveis ainda.
Performance mobile
O painel é otimizado para:
- Conexão 3G ou superior
- Telas a partir de 320px (iPhone SE original)
- 2 GB de RAM
Em conexão lenta:
- Imagens carregam em qualidade reduzida
- Listas paginam menor (10 itens vs 30 desktop)
- Gráficos simplificam (linhas em vez de áreas, menos labels)
Problemas comuns
"Tela está cortada"
Mobile com viewport não-padrão ou navegador desatualizado. Atualize o navegador.
"Botão não responde"
Pode ser overflow horizontal em formulário. Faça pinch-zoom para ver fora da área visível e tentar novamente.
"Logo da minha loja sumiu"
Em mobile, logo aparece reduzida. Se você configurou logo muito alto/largo, pode estar cortada. Suba versão mais quadrada (240x80px ou similar).
"Sininho some quando rolo"
Header é fixo no topo, mas em algumas versões antigas de Safari iOS pode falhar. Atualize o iOS.