Project

General

Profile

Actions

Padrão #50

open

Layout Doppler Aorta e Artérias Ilíacas

Added by camila oliveira 5 months ago. Updated 5 months ago.

Status:
concluído
Priority:
normal
Category:
-
Start date:
07/21/2025
Due date:
% Done:

0%

Estimated time:

Description

Finalizado o layout de Aorta e Ilíacas ✅


Files

Captura de Tela 2025-07-21 às 08.38.15.png (189 KB) Captura de Tela 2025-07-21 às 08.38.15.png camila oliveira, 07/21/2025 11:45 AM
Captura de Tela 2025-07-21 às 08.41.51.png (224 KB) Captura de Tela 2025-07-21 às 08.41.51.png camila oliveira, 07/21/2025 11:46 AM
Captura de Tela 2025-07-21 às 08.45.46.png (59.2 KB) Captura de Tela 2025-07-21 às 08.45.46.png camila oliveira, 07/21/2025 11:46 AM
Captura de Tela 2025-07-21 às 08.43.20.png (114 KB) Captura de Tela 2025-07-21 às 08.43.20.png camila oliveira, 07/21/2025 11:46 AM
clipboard-202507222103-gxtqn.png (88.3 KB) clipboard-202507222103-gxtqn.png Henrique Novaes, 07/23/2025 12:02 AM
clipboard-202507222118-5znrn.png (124 KB) clipboard-202507222118-5znrn.png Henrique Novaes, 07/23/2025 12:18 AM
clipboard-202507222120-nvizn.png (122 KB) clipboard-202507222120-nvizn.png Henrique Novaes, 07/23/2025 12:20 AM
clipboard-202507260914-2iulc.png (128 KB) clipboard-202507260914-2iulc.png Henrique Novaes, 07/26/2025 12:14 PM
clipboard-202507260919-3mpmt.png (200 KB) clipboard-202507260919-3mpmt.png Henrique Novaes, 07/26/2025 12:19 PM
clipboard-202507260919-tow2f.png (48.2 KB) clipboard-202507260919-tow2f.png Henrique Novaes, 07/26/2025 12:19 PM
Captura de Tela 2025-07-28 às 18.01.17.png (114 KB) Captura de Tela 2025-07-28 às 18.01.17.png camila oliveira, 07/28/2025 09:01 PM
Captura de Tela 2025-07-28 às 18.05.21.png (56.5 KB) Captura de Tela 2025-07-28 às 18.05.21.png camila oliveira, 07/28/2025 09:07 PM
Captura de Tela 2025-07-28 às 18.33.58.png (84.4 KB) Captura de Tela 2025-07-28 às 18.33.58.png camila oliveira, 07/28/2025 09:34 PM
Captura de Tela 2025-07-28 às 18.34.25.png (53.1 KB) Captura de Tela 2025-07-28 às 18.34.25.png camila oliveira, 07/28/2025 09:34 PM
Captura de Tela 2025-07-28 às 18.35.41.png (15.2 KB) Captura de Tela 2025-07-28 às 18.35.41.png camila oliveira, 07/28/2025 09:35 PM
Captura de Tela 2025-07-28 às 18.36.06.png (31.2 KB) Captura de Tela 2025-07-28 às 18.36.06.png camila oliveira, 07/28/2025 09:36 PM
clipboard-202507281858-v17h9.png (38.7 KB) clipboard-202507281858-v17h9.png Henrique Novaes, 07/28/2025 09:58 PM

Updated by Henrique Novaes 5 months ago

Vamos precisar ajustar pequenos pontos:

  1. Estamos com um espaço vazio muito grande e chamativo na parte dos sinais de rotura. Idealmente seria melhor tentar deixar ele justo à margem superior. Outra opção é subir as alternativas para alinhar horizontalmente e aumentar o espaçamento entre os títulos e as alternativas.

  2. Faltou um "X" entre as medidas do checkbox "calibre". Se for necessário um pouco mais de espaço, talvez poderíamos aumentar a largura de toda primeira coluna já que há margem lateral sobrando em aneurisma.

  3. Adicionei um campo "calibre transverso" nas opções de Aneurisma - o jeito que tinha deixado antes ficou estranho

  4. Acho que poderíamos alinhar ao centro essas alternativas aqui

  5. O espaçamento horizontal dessas alternativas tá bem justo.. talvez afastar um pouquinho os itens entre si melhore um pouco a visibilidade

Actions #2

Updated by camila oliveira 5 months ago

  • Status changed from teste reprovado to teste

Henrique Novaes wrote in #note-1:

Vamos precisar ajustar pequenos pontos:

  1. Estamos com um espaço vazio muito grande e chamativo na parte dos sinais de rotura. Idealmente seria melhor tentar deixar ele justo à margem superior. Outra opção é subir as alternativas para alinhar horizontalmente e aumentar o espaçamento entre os títulos e as alternativas. ✅

  2. Faltou um "X" entre as medidas do checkbox "calibre". Se for necessário um pouco mais de espaço, talvez poderíamos aumentar a largura de toda primeira coluna já que há margem lateral sobrando em aneurisma.✅

  3. Adicionei um campo "calibre transverso" nas opções de Aneurisma - o jeito que tinha deixado antes ficou estranho (não encontrei essa alternativa)

  4. Acho que poderíamos alinhar ao centro essas alternativas aqui✅

  5. O espaçamento horizontal dessas alternativas tá bem justo.. talvez afastar um pouquinho os itens entre si melhore um pouco a visibilidade✅

Feito ✅

Updated by Henrique Novaes 5 months ago

Camila, o Layout que vc fez está ótimo, porém quando fui utilizar, não ficou funcional. Erro meu novamente, mas é muito difícil ver esses detalhes sem tentar utilizar. A verdade é que precisei organizar melhor as informações e melhorar o espaço em tela.

Seguem as modificações que eu fiz e já estão no figma:

  1. Módulo de aorta
  • Inseri o "calibre tranverso" na parte de "Aneurisma de Aorta Abdominal (AAA)", coluna do meio
  1. Módulo de Artérias Ilíacas
  • Paredes: permaneceu praticamente igual, só mudei uma das alternativas da caixa de seleção para "ateromatose esparsa"
  • Calibres: reformulado, agora descrevendo cada um dos quatro vasos isoladamente, com botão de popover caso a opção "aneurisma" na artéria ilíaca direita ou esquerda seja selecionado. Note que a opção aneurisma só tem na ilíaca comum direita/esquerda, enquanto na externa (linha de baixo) não temos essa opção.
  • Estenoses e oclusões: objetivo é o usuário poder adicionar até 4 itens (atualmente só temos 2)
  • Quadro de velocidades: agora agregado junto ao módulo de artérias ilíacas (melhorou a visualização e deixou mais bonito o layout.. estava meio estranho pequeno e em baixo antes)

Updated by camila oliveira 5 months ago

1. Aorta

  • Adicionei a opção calibre transverso
  • Coloquei os números pré-definidos no novo campo
  • Ajustei a margem superior da coluna de "aneurisma aorta abdominal"
  • Reposicionei todos os campos com uma margem de 16px (no figma todos estavam com uma margem de 25px, mas testando em tela vi que ficava muito distante)

2. Módulo de Artérias Ilíacas

  • Reposicionei todos os campos com uma margem de 16px (Assim como no módulo de aorta)

  • Paredes: fiz o alinhamento com a linha debaixo

  • Calibre: Inseri os novos campos, fiz as alternativas das caixas de seleção, fiz os dois novos popovers (consegui reaproveitar boa parte da estrutura antiga) e trabalhei com o modelo de colunas, dividindo o nosso espaço útil em dois. Além disso, tive que aplicar um espaçamento único em cada campo para que as alternativas de cada linha ficassem exatamente alinhadas umas com as outras. (Infelizmente não consegui manter alinhado quando o popover aparece, mesmo colocando uma margem maior o conteúdo ao lado acaba sendo um pouco deslocado para a direita)

  • Estenoses: Adicionei novas alternativas e já deixei dinâmico para que apareçam conforme o usuário clicar nas opções de cima.

  • Quadro de velocidades: Tive que fazer a alteração de caixa para módulo, mudando o arquivo onde o conteúdo estava. Também reposicionei os campos utilizando o modelo de colunas. Primeiro dividi o espaço em dois, utilizando 40% do espaço do lado esquerdo e 60% do lado direito. Depois dividi cada linha em pequenas colunas para que se alinhassem umas com as outras. Também utilizei algumas margens negativas para permitir que as alternativas da direita ocupassem a linha do título.

Actions #5

Updated by Henrique Novaes 5 months ago

Tudo está perfeito!

Um último detalhe de grafia: na terceira alternativa é "Irregularidade"

Actions #6

Updated by Henrique Novaes 5 months ago

  • Status changed from teste reprovado to concluído
Actions

Also available in: Atom PDF