Experimento de rediseño de la tarjeta de usuario

Hoy hemos instalado una nueva versión de la tarjeta de usuario en los foros de meta. Lo hacemos para recopilar sus comentarios y ver qué funciona y qué no.

Nueva Versión

Actualizaciones

  • Fondo de encabezado del usuario
    • Hemos movido el fondo del usuario a ser una imagen de encabezado, en lugar de una imagen de fondo de la tarjeta.
    • si un usuario no tiene una imagen de fondo configurada, usamos los colores de su avatar para crear la imagen de encabezado
    • mover las insignias al área de la “imagen de banner” superior de la nueva tarjeta de usuario
    • mover la ubicación del usuario también a la “imagen de banner”
  • Estadísticas de usuario rediseñadas
  • mover el estado del usuario a un icono de avatar, en lugar de la descripción completa
  • mover los botones de acción a la parte inferior de la tarjeta
  • Permitir que la ubicación enlace a Google Maps o Open Street Maps

Versión antigua como referencia


Como con cualquier experimento, supongo que surgirán algunos problemas con esta nueva tarjeta de usuario.

Por favor, utilice este tema para informar sobre errores visuales / funcionales, así como sus opiniones sobre la tarjeta en sí.

Solo como información, a medida que se solucionen los errores, eliminaré la publicación que informó el error para disminuir la cantidad de contenido a revisar :smile:

Úsalo en tu propio foro

Como se mencionó anteriormente, esto sigue siendo un experimento. No planeamos dar soporte a esto a largo plazo como un componente temático, ya que el objetivo a largo plazo es integrar esto en el núcleo como una nueva tarjeta de usuario. Dicho esto, si desea usar esto en su foro ahora, puede hacerlo instalándolo a través de → GitHub - discourse/experimental-usercard

55 Me gusta

Solo me pregunto…

Si sobre mí es innecesario, ¿por qué los puntos, el tiempo de lectura y lo más extraño :wink: , el día del pastel, son dignos de mostrar?

Edición: sobre mí es visible aquí, pero no en mi foro… aún más extraño.

6 Me gusta

Estoy de acuerdo en que el día de la tarta es un concepto extraño en el discurso. Prefería “Miembro desde…”

Pero toda esa información es útil para juzgar a la persona con la que estás tratando.

8 Me gusta

¡Guau, se ve genial! :slight_smile:

Solo tengo algunas cosas menores con el plugin de Ubicaciones:

  • La ubicación se muestra una línea debajo del marcador.
  • También veo dos URL de sitios web con un diseño diferente. Esto también sucedió hasta hace unas semanas y fue corregido por @merefield, pero en la antigua tarjeta de usuario había dos sitios web y ninguna ubicación.
7 Me gusta

Quizás podría ser una idea dar a los usuarios la opción de subir imágenes separadas en modo oscuro, como ya tenemos en las categorías, etc.

4 Me gusta

¿Podemos intentar eliminar el color de fondo del elemento de imagen para el avatar? Los avatares de personas que se esforzaron por usar PNG transparentes para el fondo ahora se ven peor.

La imagen de fondo / encabezado en la tarjeta de usuario tiene menos de la mitad de la altura que teníamos antes, me pregunto si podríamos darle un poco más :thinking:

En general, gran trabajo, se ve muy elegante.

9 Me gusta

En temas con fuentes, el experimento de la tarjeta de usuario no tiene la fuente en la tarjeta de usuario, como Minima.
Ejemplo:

8 Me gusta

¡Genial que venga un rediseño! :star2:

Una cosa que me encantaría ver diferente es la cabecera. Incluso diría que ahora me parece un poco triste:

image

Poner una imagen de fondo no se siente tan original y apoya las funciones de la comunidad. La etiqueta de ubicación se siente un poco como en un archivo. Y las insignias se minimizan y se colocan en una esquina.

Me encantan las insignias y, por mi experiencia, a muchos gestores de comunidades les encanta ser creativos con las insignias. Me encantaría que las insignias se celebraran más, en lugar de minimizarse en las nuevas tarjetas. Ya sabes, algo como esto:

18 Me gusta

Creo que algo así podría ser más bien una configuración, yo personalmente prefiero solo 3.

3 Me gusta

Podría valer la pena agregar algo de CSS personalizado a tu sitio para abordar esto. Dado que este no es un plugin oficial de Discourse, no estoy seguro de si agregaría CSS para admitirlo, ya que es posible que eventualmente se fusione con el núcleo.

1 me gusta

Lamento ser negativo, especialmente porque no tengo muchas sugerencias de mejora, pero sinceramente, mi primera impresión fue decir literalmente “puaj, qué puaj, ¿es esto un error?”. Eso no significa que tenga razón, no significa que estas no sean una mejora para todos los demás, pero para mí, las antiguas tarjetas de usuario eran realmente agradables y sencillas y algo que no habría cambiado.

¿Quizás me acostumbre?

Puntos clave:

  1. Las insignias son súper útiles para fines de calificación y deberían estar en las tarjetas de usuario. Nada dice “Esto es quién soy…” mejor que “He hecho este tipo de contribuciones hasta ahora”. Supongo que ahora están en la esquina superior derecha, pero solo me di cuenta después de revisar varias tarjetas de usuario.
  2. Las cajas de estilo de etiqueta para “publicado”, “saludos”, “soluciones”, etc. me llaman demasiado la atención. ¿Quizás también sea la fuente en negrita? Me gustaba lo sutil que era esta información en la tarjeta de usuario anterior. ¿Por qué? Porque realmente no me importa.
  3. El aspecto del pastel también entra en la categoría de “no me importa”. Es divertido y agradable, pero cuando quiero saber más sobre un usuario, ¿es realmente una de las cuatro cosas más importantes que quiero saber sobre él? Probablemente no.

Cambiaría el día del pastel a la esquina superior derecha y movería las insignias de nuevo a una fila o dos completas, con el nombre completo expandido de las insignias destacadas. La mayoría de los usuarios no sabrán qué significan los iconos y necesitarán la elaboración del texto. Esto anuncia aún más las insignias que están disponibles, despertando la curiosidad en algunos usuarios para que contribuyan más si desean una insignia en particular que ven en la tarjeta de usuario de otra persona.

6 Me gusta

Sé que los problemas que veo son causados por el plugin Locations. La razón por la que lo mencioné aquí es porque este plugin parece ser muy común. Además, diría que los ajustes de CSS o código deben hacerse en el plugin y no en el núcleo de Discourse, al menos principalmente. Y espero que las personas que mantienen el plugin Locations lo investiguen. Y, para ser honesto, si la nueva tarjeta de usuario se convierte en parte del núcleo, más o menos tendrán que hacerlo. :wink:

Solo quería abordar los problemas que tengo aquí en el tema para todos.

3 Me gusta

He encontrado algunas cosas más que están un poco mal, esta vez con la animación de brillo.
En primer lugar, todos están en ciclos diferentes. Se ve mejor si te desconectas de wifi y luego haces clic en una tarjeta:

Y además, se detiene demasiado pronto:

La imagen aún no se ha cargado y la animación se ha detenido.

2 Me gusta

¡Ahora veo nombres de insignias al pasar el cursor!

Creo que sería bueno que los usuarios pudieran configurar qué se muestra, como la fecha de unión, la última vez visto, etc., como en la barra lateral.

2 Me gusta

Me encanta un enfoque más minimalista, y todavía hay una pregunta principal sin respuesta directa:

¿El concepto de tarjetas de usuario es solo un elemento decorativo sin ningún propósito real? Supongo que la mayoría de los usuarios lo usan solo para enviar un mensaje privado o abrir un canal de chat. Entonces… ¿deberíamos simplificarlo más en lugar de aumentar los elementos visibles rápidamente?

Las necesidades de los administradores/moderadores son un terreno de juego totalmente diferente.

6 Me gusta

También podría ser bueno combinar los detalles principales del usuario en un solo lugar en lugar de en varias ubicaciones de la tarjeta:

Si esto recibe una revisión, creo que podría ser una buena oportunidad para eliminar la información del nivel de confianza de las insignias. No son insignias sino membresía de grupo, que indican autoridad y derechos de acceso en el foro.

5 Me gusta

No estoy seguro de lo que está pasando, pero se ve horrible en mi sitio. Falta mucha información. Lo probé sin ningún otro CSS, y así es como se ve. ¿Quizás un conflicto de plugins, o algo más está pasando?

Nuevo:

Antiguo:

6 Me gusta

Algo no va bien, ¿puedes intentarlo en modo seguro? ¿Quizás tu tema también está aplicando cambios?

5 Me gusta

Es un plugin oficial el que está causando el problema, no estoy seguro de cuál. Primero deshabilité los no oficiales y se veía igual, pero al deshabilitar todos funcionó. Aquí está el error en la consola:

Editar: Todos mis plugins oficiales

          - git clone https://github.com/discourse/discourse-chat.git
          - git clone https://github.com/discourse/discourse-user-notes.git
          - git clone https://github.com/discourse/discourse-reactions.git
          - git clone https://github.com/discourse/discourse-calendar.git
          - git clone https://github.com/discourse/discourse-adplugin.git
          - git clone https://github.com/discourse/discourse-whos-online.git
          - git clone https://github.com/discourse/discourse-canned-replies.git
          - git clone https://github.com/discourse/discourse-follow.git
          - git clone https://github.com/discourse/discourse-push-notifications.git
          - git clone https://github.com/discourse/discourse-gamification.git
          - git clone https://github.com/discourse/discourse-templates.git
          - git clone https://github.com/discourse/discourse-automation.git
          - git clone https://github.com/discourse/discourse-fontawesome-pro.git --branch fa5
          - git clone https://github.com/discourse/discourse-spoiler-alert.git
          - git clone https://github.com/discourse/discourse-data-explorer.git
6 Me gusta