# Design do Aplicativo - Sistema de Chamados de Manutenção

## Visão Geral

Aplicativo móvel para gestão de chamados de manutenção em grupo de concessionárias. Projetado para ser **extremamente intuitivo** e de **fácil entendimento**, considerando usuários com diferentes níveis de instrução.

---

## Princípios de Design

1. **Simplicidade Absoluta**: Fluxos diretos, sem etapas desnecessárias
2. **Ícones Grandes e Claros**: Representação visual óbvia de cada função
3. **Cores Intuitivas**: Verde = concluído, Amarelo = em andamento, Vermelho = urgente
4. **Textos Curtos e Objetivos**: Frases simples e diretas
5. **Botões Bem Visíveis**: Tamanho grande, fácil de tocar
6. **Feedback Imediato**: Usuário sempre sabe o que está acontecendo

---

## Lista de Telas

### 1. Tela Inicial (Home)
- Botão grande "ABRIR CHAMADO" em destaque
- Lista dos chamados recentes do usuário
- Indicadores visuais de status (cores)

### 2. Tela de Abertura de Chamado
- Seleção de unidade/prédio (lista simples)
- Seleção de categoria (ícones grandes: ar-condicionado, elétrica, telhado, outros)
- Campo de descrição do problema (texto livre)
- Botão "ENVIAR CHAMADO"

### 3. Tela de Meus Chamados
- Lista de todos os chamados abertos pelo usuário
- Status visual claro (cores e ícones)
- Toque para ver detalhes

### 4. Tela de Detalhes do Chamado
- Informações completas do chamado
- Timeline de etapas (visual de progresso)
- Status atual destacado
- Histórico de atualizações

### 5. Tela da Equipe de Manutenção
- Lista de todos os chamados pendentes
- Filtros por unidade e categoria
- Opção de definir prioridade
- Atualizar status/etapa do chamado

---

## Conteúdo e Funcionalidades por Tela

### Tela Inicial (Home)
**Conteúdo:**
- Saudação simples ("Olá!")
- Botão principal "ABRIR CHAMADO" (grande, cor primária)
- Seção "Seus Chamados Recentes" com cards resumidos
- Cada card mostra: categoria (ícone), local, status (cor)

**Funcionalidades:**
- Navegar para abertura de chamado
- Ver lista de chamados próprios
- Acessar detalhes de um chamado

### Tela de Abertura de Chamado
**Conteúdo:**
- Título "Novo Chamado"
- Seletor de unidade (dropdown ou lista)
- Grid de categorias com ícones grandes:
  - ❄️ Ar-Condicionado
  - ⚡ Elétrica
  - 🏠 Telhado/Estrutura
  - 🔧 Equipamentos
  - 📦 Outros
- Campo de texto "Descreva o problema"
- Botão "ENVIAR"

**Funcionalidades:**
- Selecionar unidade
- Selecionar categoria
- Descrever problema
- Enviar chamado

### Tela de Meus Chamados
**Conteúdo:**
- Lista de cards com chamados
- Cada card: ícone da categoria, descrição resumida, status colorido
- Indicador de data/hora

**Funcionalidades:**
- Visualizar todos os chamados
- Filtrar por status
- Acessar detalhes

### Tela de Detalhes do Chamado
**Conteúdo:**
- Cabeçalho com categoria e status
- Informações: unidade, data, descrição
- Timeline visual de etapas:
  1. ✅ Chamado Aberto
  2. ⏳ Em Análise
  3. 🔧 Em Execução
  4. ✅ Concluído
- Histórico de comentários/atualizações

**Funcionalidades:**
- Visualizar progresso
- Ver histórico completo

### Tela da Equipe de Manutenção
**Conteúdo:**
- Filtros: Unidade, Categoria, Prioridade
- Lista de chamados pendentes
- Indicadores de prioridade (cores)
- Botões de ação rápida

**Funcionalidades:**
- Filtrar chamados
- Definir prioridade (Baixa, Média, Alta, Urgente)
- Atualizar status/etapa
- Adicionar comentários

---

## Fluxos de Usuário

### Fluxo 1: Abrir Chamado
1. Usuário abre o app → Tela Inicial
2. Toca em "ABRIR CHAMADO"
3. Seleciona a unidade/prédio
4. Toca no ícone da categoria
5. Escreve descrição do problema
6. Toca em "ENVIAR"
7. Confirmação visual → Volta para Home

### Fluxo 2: Acompanhar Chamado
1. Usuário abre o app → Tela Inicial
2. Vê chamados recentes ou vai para "Meus Chamados"
3. Toca em um chamado
4. Visualiza timeline de progresso e atualizações

### Fluxo 3: Equipe de Manutenção - Gerenciar Chamado
1. Técnico abre o app → Aba Manutenção
2. Vê lista de chamados pendentes
3. Toca em um chamado
4. Define prioridade
5. Atualiza status/etapa
6. Adiciona comentário se necessário

---

## Paleta de Cores

| Cor | Uso | Hex Light | Hex Dark |
|-----|-----|-----------|----------|
| **Primária** | Botões principais, destaques | #2563EB | #3B82F6 |
| **Fundo** | Background das telas | #F8FAFC | #0F172A |
| **Superfície** | Cards, elementos elevados | #FFFFFF | #1E293B |
| **Texto** | Texto principal | #1E293B | #F1F5F9 |
| **Texto Secundário** | Texto auxiliar | #64748B | #94A3B8 |
| **Sucesso** | Concluído, confirmações | #22C55E | #4ADE80 |
| **Alerta** | Em andamento, atenção | #F59E0B | #FBBF24 |
| **Erro/Urgente** | Urgente, problemas | #EF4444 | #F87171 |
| **Borda** | Divisores, bordas | #E2E8F0 | #334155 |

---

## Unidades (Prédios)

Lista configurável de unidades do grupo de concessionárias:
- Matriz
- Filial Centro
- Filial Norte
- Filial Sul
- Oficina Central
- Depósito
- (Configurável conforme necessidade)

---

## Categorias de Manutenção

| Categoria | Ícone | Descrição |
|-----------|-------|-----------|
| Ar-Condicionado | ❄️ snowflake | Climatização, splits, centrais |
| Elétrica | ⚡ bolt | Tomadas, iluminação, quadros |
| Telhado/Estrutura | 🏠 home | Goteiras, infiltrações, estrutura |
| Equipamentos | 🔧 wrench | Máquinas, ferramentas, elevadores |
| Hidráulica | 💧 droplet | Encanamento, vazamentos, banheiros |
| Outros | 📦 package | Demais necessidades |

---

## Níveis de Prioridade

| Prioridade | Cor | Descrição |
|------------|-----|-----------|
| Baixa | Cinza | Pode aguardar, sem urgência |
| Média | Azul | Normal, resolver em breve |
| Alta | Laranja | Importante, priorizar |
| Urgente | Vermelho | Crítico, resolver imediatamente |

---

## Status do Chamado

| Status | Cor | Ícone | Descrição |
|--------|-----|-------|-----------|
| Aberto | Azul | 📋 | Chamado registrado, aguardando |
| Em Análise | Amarelo | 🔍 | Equipe avaliando |
| Em Execução | Laranja | 🔧 | Trabalho em andamento |
| Concluído | Verde | ✅ | Serviço finalizado |
| Cancelado | Cinza | ❌ | Chamado cancelado |

---

## Navegação

**Tab Bar (3 abas simples):**
1. **Início** (ícone: home) - Tela inicial com botão de abrir chamado
2. **Meus Chamados** (ícone: list) - Lista de chamados do usuário
3. **Manutenção** (ícone: wrench) - Área da equipe técnica

---

## Considerações de Acessibilidade

- Fontes grandes (mínimo 16px para texto, 20px+ para títulos)
- Contraste alto entre texto e fundo
- Áreas de toque mínimo de 48x48px
- Ícones sempre acompanhados de texto
- Feedback visual e tátil (haptics) em ações
- Cores não são o único indicador (sempre há ícone ou texto)