Arraste para explorar. Role ou use a pinça para aproximar. Abra a Ajuda para ver os atalhos de teclado.

Yan
ABERTO A
PROJETOSVamos conversar
Yan Fontão Boring view
TV viewEN
Todos os trabalhos

Case 048Design de web app e dashboard

AMIE Client Portal

O design de um portal para a Cullen Cleaning Services, que aparece na tela como CORE by CCS e AMIE Client Portal, com um dashboard de locais, orçamentos, chamados e notas de auditoria. As linhas das tabelas são texto provisório.

Meu papel
Design de interface
Status do projeto
Portal web · Acervo do Figma
Laptop com a entrada do portal do cliente ao lado do símbolo de folha da marca.
A capa de apresentação do arquivo.

01

Minha contribuição

O AMIE Client Portal reúne em um só lugar o acompanhamento dos serviços de limpeza da Cullen Cleaning Services, sob a marca CORE by CCS. O arquivo no Figma inclui login, verificação em duas etapas, um dashboard e uma lista de auditorias.

Dashboard com barra lateral quase preta e o logo CORE. Quatro contadores de locais ativos, orçamentos abertos, chamados abertos e nota de auditoria ficam acima de um gráfico de linha verde com as auditorias mensais, uma faixa semanal de orçamentos abertos e tabelas de status da limpeza e chamados de suporte, com linhas provisórias.
O dashboard, com contadores, tendência de auditorias e linhas provisórias.

02

Quatro números, depois os detalhes

O dashboard abre com quatro contadores: locais ativos, orçamentos abertos, chamados abertos e nota média de auditoria. Logo abaixo, um gráfico de linha acompanha as auditorias mês a mês ao lado de uma faixa semanal de orçamentos abertos, e duas tabelas mostram o status da limpeza e os chamados de suporte. As linhas dessas listas ainda têm texto provisório, então isto é um layout, não uma tela preenchida.

Foto de floresta em tela cheia com o logo CORE by CCS, o rótulo AMIE Client Portal e a frase Your custom built portal to overview of your cleaning services from Cullen Cleaning Services. Nenhum formulário aparece nesta exportação.
O painel de entrada do portal, exportado sem o card de login.

03

Um menu longo numa coluna escura

Uma barra lateral quase preta guarda o sistema inteiro, da gestão de equipe e de locais à ferramenta de auditoria, suprimentos, agenda de trabalho, saúde e segurança, mapas, relatórios e chamados. Ao lado dela, a área de conteúdo fica branca, com cards em verde suave, e o mesmo verde marca o dia selecionado e os status concluídos.

000

Instruções

Yan Fontão
Toque
Abre uma tela
Clique
Abre uma tela
Arrastar
Move pelo mural
Rolagem
Mouse aproxima, trackpad move, pinça aproxima
− +
Afasta até ver o mural inteiro, ou aproxima
Setas
No case: ↑↓ trocam de case, ←→ trocam de mídia. No mural: movem
Espaço
Abre ou volta
Enter
Abre
Esc Backspace
Volta
Home
Volta ao centro, depois à abertura
PgUp PgDn
Canal anterior ou próximo
Tab
Percorre projetos e links
R
Projeto aleatório
0–9
Digite um canal, 1–61
?
Esta página
Atalhos

Use Esquerda / Direita para ir à mídia anterior ou à próxima, ou use os botões e a rolagem horizontal. Clique em uma imagem lateral para trazê-la para a frente. Role para baixo ou clique no centro para voltar ao mural. Vídeos e imagens avançam sozinhos, e Pausar interrompe os dois. Enquanto o foco estiver nos controles, a troca também fica parada.

Música do mural

Arquivos comprimidos e nivelados para a web.

ABERTO A
PROJETOSVamos conversar

Nova mensagem para o Yan

Conte quem você é e eu respondo.

000

Sobre o Yan

Oi, eu sou o Yan

Product Designer/ Design Engineer

A maioria dos produtos perde algo entre o design e o código. Os meus não: eu pesquiso o problema, desenho o produto e coloco a interface no ar, então o que você aprova é exatamente o que seus usuários recebem.

  • 2018início em software
  • UI + codedesign e implementação

Trabalhei com Motorola · Ambev Tech · Rei do Pitaco · OneTool · CESAR

Brasil · Remoto, híbrido ou presencial

Retrato de Yan Fontão sentado, de suéter verde e óculos, segurando um microfone.
ABERTO A
PROJETOSVamos conversar
001–061

Digite um canal

Mobile

  1. 001BabyVerified
  2. 002Rei do Pitaco
  3. 003BetterTogether
  4. 004Hello You
  5. 005MeuCommerce
  6. 006TerasApp
  7. 007Hidratasport
  8. 008Boomerang Video Editor
  9. 009DoBetrBoy
  10. 010DigiKisan
  11. 011HubProlog
  12. 012ShaktiGrid
  13. 013Momentálity
  14. 014Grand Plaza
  15. 015DossApp
  16. 016Univesell
  17. 017Helps On
  18. 018MAT APP
  19. 019Boater
  20. 020NeverSoft
  21. 021Ageu
  22. 022AglomeraNão
  23. 023VascoApp
  24. 024GoVoice
  25. 025Anji
  26. 026Contacts Sync
  27. 027Needrr
  28. 028Heartbeat
  29. 029Rollê
  30. 030Face Skin Analysis
  31. 031Habit Tracker
  32. 032Hack For Good

Produto

  1. 033Synergy Insurance Affiliates
  2. 034OneTool
  3. 035Motorola Device Manager
  4. 036Autopost.ai
  5. 037FormaAI
  6. 038BabyVerified · Landing Page
  7. 039MotoTalk
  8. 040MotoSafe
  9. 041Financias
  10. 042Rei do Pitaco Research
  11. 043Stream Stickers
  12. 044Infinitoon
  13. 045Orka
  14. 046Manaus Mais Humana
  15. 047ÉOS Energia
  16. 048AMIE Client Portal
  17. 049Certify

Web

  1. 050SUTATO
  2. 051Gypsy — Tickets
  3. 052Lex by Alexandria
  4. 053Trackland
  5. 054Succession Now
  6. 055Straight Up Marine Group

Marca

  1. 056Qualifyer
  2. 057MeuSplit
  3. 058Divine’s Bake Shop
  4. 059Pasta Morada

Stories

  1. 060Processo
  2. 061Fluxos
ABERTO A
PROJETOSVamos conversar
000

canal bloqueado

Sob NDA

Digite o código

Peça o código ao Yan ↗
ABERTO A
PROJETOSVamos conversar
YAN FONTÃO Cases completos

Canal 48 Design de web app e dashboard

AMIE Client Portal

O design de um portal para a Cullen Cleaning Services, que aparece na tela como CORE by CCS e AMIE Client Portal, com um dashboard de locais, orçamentos, chamados e notas de auditoria. As linhas das tabelas são texto provisório.

Meu papel
Design de interface
Status do projeto
Portal web · Acervo do Figma
Vamos trabalhar juntos LinkedIn
Laptop com a entrada do portal do cliente ao lado do símbolo de folha da marca.
A capa de apresentação do arquivo.

Locais, orçamentos, chamados e auditorias em um só dashboard

Telas do arquivo original no Figma. O telefone do login foi removido e a tela com pessoas nomeadas ficou de fora.

Minha contribuição

O AMIE Client Portal reúne em um só lugar o acompanhamento dos serviços de limpeza da Cullen Cleaning Services, sob a marca CORE by CCS. O arquivo no Figma inclui login, verificação em duas etapas, um dashboard e uma lista de auditorias.

Dashboard com barra lateral quase preta e o logo CORE. Quatro contadores de locais ativos, orçamentos abertos, chamados abertos e nota de auditoria ficam acima de um gráfico de linha verde com as auditorias mensais, uma faixa semanal de orçamentos abertos e tabelas de status da limpeza e chamados de suporte, com linhas provisórias.
O dashboard, com contadores, tendência de auditorias e linhas provisórias.

Quatro números, depois os detalhes

O dashboard abre com quatro contadores: locais ativos, orçamentos abertos, chamados abertos e nota média de auditoria. Logo abaixo, um gráfico de linha acompanha as auditorias mês a mês ao lado de uma faixa semanal de orçamentos abertos, e duas tabelas mostram o status da limpeza e os chamados de suporte. As linhas dessas listas ainda têm texto provisório, então isto é um layout, não uma tela preenchida.

Foto de floresta em tela cheia com o logo CORE by CCS, o rótulo AMIE Client Portal e a frase Your custom built portal to overview of your cleaning services from Cullen Cleaning Services. Nenhum formulário aparece nesta exportação.
O painel de entrada do portal, exportado sem o card de login.

Um menu longo numa coluna escura

Uma barra lateral quase preta guarda o sistema inteiro, da gestão de equipe e de locais à ferramenta de auditoria, suprimentos, agenda de trabalho, saúde e segurança, mapas, relatórios e chamados. Ao lado dela, a área de conteúdo fica branca, com cards em verde suave, e o mesmo verde marca o dia selecionado e os status concluídos.