Pular para o conteúdo

Capítulo 2 · App do Atleta

O app por dentro: navegação, sino, mensagens e sync

O app é organizado em 5 abas na barra inferior, com uma barra no topo (a organização, mensagens, notificações e o cronômetro) e camadas flutuantes (cronômetr…

Onde: o container do app (topo + abas)

O app é organizado em 5 abas na barra inferior, com uma barra no topo (a organização, mensagens, notificações e o cronômetro) e camadas flutuantes (cronômetros, folhas, celebrações). Esta página é o mapa de navegação — onde fica cada coisa.

  • Para se localizar: achar o sino, as mensagens, o tema, e entender por que umas telas “sobem” por cima.

A barra inferior com as 5 abas

AbaO que é
Hojeo treino do dia (Cap. 3)
Programasseus programas — e, na versão web, o catálogo (Cap. 8). No app do celular, esta casa é Treinos (abaixo)
Agendaas provas e os eventos da temporada — quanto falta para a próxima (Cap. 6)
ProgressoPRs, aderência, volume (Cap. 7)
Perfilconta, estatísticas e preferências (Cap. 10)

É uma placa só, de canto vivo, dividida por filetes finos em quatro partes lado a lado, todas da mesma altura:

  • A marca do app e a organização, à esquerda, ocupando o espaço que sobra: o A do Atleta num quadrado — o mesmo símbolo do ícone que você toca para abrir o app —, o nome da organização e, embaixo, uma segunda linha: no app do celular, a frase da organização, a linha de identidade que o coach cadastrou; na versão web, Coach e o nome do seu head coach. Sem ela, o nome fica sozinho. Com mais de uma organização, ou sem nenhuma, as duas linhas dizem isso (ver Uma organização, várias ou nenhuma). Encostada na borda direita dessa mesma parte, de cima a baixo, fica a barra de sincronização (ver abaixo) — ela informa, não é botão: o nome do estado aparece ao segurar o toque, e é o que o leitor de tela anuncia. Toque no resto para abrir o cartão da organização (Cap. 3).
  • Mensagens — a conversa com o coach, ou a lista Seus coaches quando você tem mais de um, com o número de não-lidas num selo quadrado (acima de nove, 9+). O número soma todas as conversas (Cap. 9).
  • Notificações — o sino, com um ponto quadrado quando há não-lidas (Cap. 9).
  • Cronômetro, fechando a placa à direita: o único botão preenchido da barra. Ele abre o cronômetro livre (Cap. 4.10).

Em tela estreita quem encurta é o texto — primeiro a frase da organização, depois o nome dela. Os três botões não mudam de tamanho: a barra nunca se desmonta, e nenhum alvo fica menor que o polegar.

Você pode ter vínculo com mais de uma organização ao mesmo tempo — e um vínculo pode acabar. A placa nunca finge: o que ela escreve depende de onde você está.

SituaçãoPrimeira linhaSegunda linha
Uma organizaçãoo nome delaa frase da organização (no celular) ou Coach e o nome do head coach (na web)
Duas ou maiso nome de uma delasquantas são: 2 organizações
Vínculo encerradoo nome da organização em que ele acabouVínculo encerrado
NenhumaAtleta, o nome do appSem organização

Ela não fica travada. A barra do topo rola junto com a página: ao descer, sai da tela; ao puxar um pouco para cima, volta. Vale para todas as abas. A tela é do treino — a moldura só aparece quando você pede.

Ao abrir o app, enquanto ele confirma a sua sessão, a marca se monta: quatro traços que crescem até formar o A. Numa abertura “quente” ela passa num piscar; numa fria (servidor esquentando) ela segura até o app entrar. Não é uma etapa que dá para pular, e não indica erro. Ver Cap. 1.

  • Sub-telas (Detalhe/Registro/Feedback): abrem sobre a aba e voltam com o botão de voltar.
  • A Agenda fora da barra: onde Aulas toma a casa dela, a Agenda abre como sub-tela de quem a chamou. A barra do alto diz de onde você veio (Hoje · Agenda ou Perfil · Agenda), a seta volta para lá — o voltar do Android também —, e a aba de onde você veio continua acesa na barra de baixo.
  • As Aulas fora da barra: sem matrícula para reservar, é a grade que abre como sub-tela, pela linha do Hoje ou do Perfil — com a mesma barra do alto (Hoje · Aulas ou Perfil · Aulas), a mesma seta e a mesma aba acesa (Cap. 14).
  • Flutuantes: cronômetro de sessão, cronômetro de bloco, cronômetro livre, celebrações (PR/conclusão), o wizard de registro e o toast de aviso.

Vira sidebar (logo + as seções, com o Perfil ainda na lista — no desktop sobra espaço, e ele não precisou sair — + o cartão da organização, com as mesmas duas linhas da placa) + uma toolbar (dia, sync, mensagens, notificações) e a área principal. Mesmas funções, layout largo. Detalhes no Cap. 11.

Ficam no Perfil: tema (claro/escuro), unidade (kg/lb) e, na versão web, idioma (pt-BR…). O app do celular fala só português. Ver Cap. 10.

Na primeira vez que você abre, o app segue o seu aparelho: se o celular está no modo escuro, ele abre escuro; se está no claro, abre claro. A partir do momento em que você escolhe um tema no Perfil, a sua escolha passa a valer sempre — o aparelho não manda mais.

O tema vale no app inteiro: no claro, a abertura, o login, o Hoje, o Detalhe, o registro e os Programas são claros do começo ao fim — nenhum cartão preto no meio. O destaque não é mais uma cor: o que está escolhido (o dia na trilha, o botão de iniciar, a aba aberta) fica com campo cheio de tinta e texto invertido. O app gasta exatamente três cores, e cada uma tem um dono: vermelho é erro, verde é resultado salvo, azul é sistema (sincronização, seleção, progresso). Aviso não tem cor: ele vem hachurado. O cronômetro é a exceção — ele tem cor própria por fase: ver Cap. 4.3.

Uma barra fina, na altura inteira da célula da organização. Ela muda de forma, não só de cor — quem não enxerga cor lê os dois estados do mesmo jeito —, e o nome exato está sempre lá para o leitor de tela.

A barraO que significa
inteira, em azula linha está viva: Sincronizado, Sincronizando ou Salvo
partida em três, apagadaOffline — sem rede. O shell e o cache podem abrir, mas API e registros aguardam conexão

Qual dos três estados vivos é o atual vem no toque longo e no leitor de tela: Sincronizado, Sincronizando, Salvo.

  • “Abri o Detalhe e sumiu a barra de abas.” — É uma sub-tela (sobe por cima). Use voltar para retornar à aba.
  • “Cadê o Perfil?” — É a sua foto, o quadrado no fim da barra de abas.
  • “Cadê o Timer?” — No botão preenchido, na ponta direita da barra do topo.
  • “Cadê o Estou aqui?” — No app do celular, na linha da sua aula, no Hoje: ele aparece no dia da aula, com a vaga reservada, de 30 minutos antes do começo até o fim dela (Cap. 14).
  • “Cadê a aba Agenda?” — Onde a organização tem aulas e você tem matrícula em dia, Aulas toma a casa dela. Com uma prova perto, a Agenda fecha o Hoje (Cap. 3); ela também está no Perfil, em Agenda e organização.
  • “Cadê a aba Aulas?” — Sem matrícula em dia, a Agenda fica na barra e a grade está na linha Aulas do Hoje e do Perfil (Cap. 14). Feita a matrícula, a aba aparece sozinha.
  • “Aparece ‘offline’.” — Sem rede. Conteúdo já carregado pode continuar visível, mas o app não inventa dados nem garante fila de registros; confira a confirmação do servidor quando a conexão voltar.
  • “O topo diz Vínculo encerrado.” — A organização encerrou o seu vínculo. Você continua entrando e com o seu histórico; para voltar a treinar lá, fale com ela.
  • “O topo diz 2 organizações e o nome de uma só.” — Você treina nas duas. Toque na placa para ver cada uma.

O sino e as mensagens são as duas pontas da comunicação com o coach: pelo sino chegam o feedback e os avisos dele; pelas mensagens vocês conversam (Cap. 9).

Trocar de aba esmaece a tela, curto, sem deslizar nada: uma aba não vem de lugar nenhum. O herói do Hoje entra com o dia, em opacidade, e as folhas sobem por cima do que você estava lendo.