Deixe mais óbvio que uma imagem é redimensionável ao fazer upload de uma imagem

Contribuir Experiência do Usuário
1

Isso me deixa louco quase todos os dias.

  • Faço o upload de uma captura de tela retina
  • Levo imediatamente o mouse para a área de pré-visualização para obter os “controles de redimensionamento” e reduzi-la
  • Os controles não aparecem ao passar o mouse
  • Afasto o mouse
  • Depois volto à área de pré-visualização e os controles aparecem

No geral, nem sou fã de ter os “controles de redimensionamento” como algo que só aparece ao passar o mouse.

Consigo pensar em duas opções para melhorar isso:

  1. Podemos corrigir o bug para que, ao fazer o upload e passar o mouse, os controles apareçam imediatamente.

  2. Podemos exibir os “controles de redimensionamento” incondicionalmente (talvez de forma um pouco mais sutil).

Pessoalmente, prefiro a opção (2), mas gostaria de saber o que @codinghorror, @awesomerobot e a comunidade acham sobre isso?

11 curtidas
2

Não estou vendo isso. É um problema de latência?

1 curtida
3

Extremamente provável, 100% reproduzível no Firefox na Austrália contra o meta.

4 curtidas
4

Então a solução é o realocamento? :laughing:

10 curtidas
5

Adiciono meu voto pela opção 2. É um recurso extremamente útil, mas acho que é bem fácil passar despercebido se você não souber que existe.

3 curtidas
6

Não vejo mal em exibir os controles de redimensionamento na prévia incondicionalmente por três razões:

A primeira é que nós apenas os “escondemos” com opacidade

o que significa que eles ainda ocupam algum espaço mesmo quando invisíveis. O wrapper está posicionado de forma absoluta, mas adicionamos algum preenchimento a .image-wrapper

A segunda é que o recurso funcionaria também em dispositivos móveis, o que atualmente não ocorre para mim, mesmo sendo suposto funcionar

A terceira é que isso aumentaria a descoberta do recurso.

Caso contrário, o que podemos fazer é fazer com que os controles para todas as imagens fiquem visíveis quando você passar o mouse sobre o painel de prévia, e não apenas para imagens individuais. Além disso, corrigir o problema em dispositivos móveis (que pode estar limitado apenas aos meus dispositivos)

Se fizermos os controles visíveis incondicionalmente, também podemos dedicar um pouco de tempo para deixá-los com uma aparência melhor.

15 curtidas
7

Sim, eu prefiro que eles fiquem sempre visíveis e sobrepostos à imagem, para que o espaçamento não pareça maior no editor de mensagens em comparação com a postagem real.

Uma razão pela qual não fizemos isso originalmente é porque você veria os controles piscando terrivelmente enquanto digitava. Acredito que algumas alterações foram feitas para reduzir o piscar, mas os controles ainda são removidos completamente do DOM assim que você começa a digitar… Assim que isso for resolvido, sinta-se à vontade para reestilizá-los para que fiquem sempre visíveis, @johani!

8 curtidas
8

Não estou vendo nenhum flicker ao remover a opacidade, então acho que resolvemos o problema?

Corrigi (1) conforme:

Mas ainda sinto que o cerne da questão é que o problema não é facilmente descobrível e depende do hover.

@Johani, que tal criar um componente de tema para estilizar isso agora (já que você pode usar CSS puro para obter o que quiser)? Certifique-se de testar isso em uma imagem muito, muito curta. Em seguida, instale o componente no dev e no meta para que possamos conviver com ele por um tempo e decidir se preferimos essa abordagem ou não?

8 curtidas
9

Sim, acho que um debounce foi adicionado em algum momento? Agora que você corrigiu aquele primeiro problema, tudo parece estar bem.

3 curtidas
10

Uau, não acredito que 2019 foi há um ano inteiro :lolsob:

3 curtidas
11

Eu, pessoalmente, não sou a favor dessa mudança. Torna tudo muito mais movimentado. Havia algum problema real com a descoberta de redimensionamento?

1 curtida