Ayúdanos a probar Horizon, nuestro tema más nuevo

Nos complace presentar nuestro tema más reciente: ¡Horizon! Hemos estado probando Horizon internamente durante algún tiempo y ahora estamos listos para probarlo aquí en Meta para poder recibir sus comentarios sobre cómo seguir mejorando este tema.

En este tema, compartiremos los objetivos detrás de Horizon y proporcionaremos orientación sobre cómo probar y compartir sus comentarios con nosotros.

:sunrise: Conociendo Horizon

Horizon es un tema simple y hermoso que aspira a convertirse en la nueva experiencia predeterminada para los sitios de Discourse.

:warning: ¡Tenga en cuenta que Horizon todavía se considera un tema experimental! Como tal, antes de instalarlo en su comunidad o proporcionar comentarios, lea el resto de este tema para comprender qué esperar de este tema y cómo proporcionarnos los mejores comentarios.

Horizon Theme

:mirror: ¿Para quién es Horizon?

Si bien esperamos que Horizon sea una excelente opción para muchas comunidades, creamos Horizon pensando en usuarios específicos: administradores no técnicos y miembros cotidianos.

  • Administradores no técnicos: son administradores de la comunidad que tienen conocimientos técnicos limitados y no tienen acceso a recursos de diseño o desarrollo. No tienen los recursos ni los conocimientos para personalizar la apariencia de Discourse para que funcione mejor para su comunidad, pero aún creen que Discourse es una excelente opción para su comunidad.

  • Miembros cotidianos: se encuentran en un punto intermedio entre el visitante ocasional y el usuario experto de élite. Leen y publican regularmente en la comunidad, y es más probable que visiten Discourse principalmente (si no exclusivamente) desde sus teléfonos.

Estamos orgullosos de que Discourse sea tan flexible y personalizable, queremos asegurarnos de que Discourse siga siendo una excelente opción para todas las comunidades, independientemente de su experiencia técnica o recursos. Creamos Horizon para administradores que no tienen acceso a recursos de diseño o desarrollador, pero que aún desean una comunidad atractiva que sus miembros adorarán.

:magic_wand: ¿Qué tiene de diferente Horizon?

Mientras que nuestro tema Predeterminado es un lienzo relativamente en blanco, Horizon es un tema opinado. Eso significa que hemos tomado ciertas decisiones sobre cómo se ve y opera Discourse al usar este tema para proporcionar una excelente experiencia de usuario general para nuestros usuarios objetivo (descritos anteriormente). Aquí hay algunos cambios que podría notar:

  • Las tarjetas de temas tienen menos densidad de información. La característica más notable de Horizon es la tarjeta de tema. Hemos eliminado la mayor cantidad de información posible para mantener la lista de temas limpia y accesible. Cierta información, como una lista más robusta de participantes del tema y etiquetas del tema, no es visible en la tarjeta del tema.

  • Horizon no está diseñado para admitir personalizaciones adicionales. Dado que nos dirigimos a una audiencia que no puede o no está interesada en personalizar la apariencia o el comportamiento de Discourse, no se garantiza que Horizon funcione bien con todos los componentes temáticos o personalizaciones.

    Dicho esto, hemos probado Horizon con los componentes temáticos más populares y las incompatibilidades que hemos encontrado hasta ahora son menores. Trabajaremos para abordarlas con el tiempo. Por ahora, no recomendamos activar componentes temáticos con Horizon ni agregar sus propias personalizaciones.

  • Horizon incluye nuevas paletas de colores que los administradores pueden habilitar para brindar a los miembros un mayor control sobre su experiencia comunitaria. Una vez habilitados a través de la configuración de Paleta de colores del administrador, los miembros pueden seleccionar entre una de las seis paletas de colores específicas del tema para una apariencia personalizada.

  • Texto más grande en el área de lectura. Notará que el área de lectura de Horizon (es decir, los temas) tiene un texto ligeramente más grande que el resto del texto de la interfaz. Estamos experimentando con este tamaño de texto diferenciado con la esperanza de que haga que los temas sean más fáciles de leer, al mismo tiempo que mantenemos el texto menos importante, como los enlaces de la barra lateral, más minimalista y menos distractivo.

:mega: Pruebas y comentarios

Puede consultar Horizon en Meta utilizando el selector de temas en la parte inferior de su barra lateral:

Mientras prueba aquí en Meta o en su propia comunidad, puede encontrar problemas con el diseño visual o incompatibilidades con ciertos componentes temáticos o personalizaciones. Cuando eso suceda, háganoslo saber. Sus comentarios nos ayudarán a mejorar Horizon para que podamos comenzar a hacerlo más accesible.

Tenga en cuenta que es posible que no abordemos todos los comentarios que recibimos en este momento. Eso no significa que sus comentarios no sean válidos o invaluables; simplemente significa que queremos continuar probando una idea o decisión de diseño particular para comprender mejor cómo satisface las necesidades de nuestros usuarios objetivo.

:wrench: Problemas conocidos / áreas en progreso

Aquí hay algunas áreas en las que estamos trabajando activamente:

  • Retoques en las paletas de colores para garantizar la accesibilidad. Horizon tiene un sistema de color más simplificado (y ha inspirado nuevas paletas de colores, por ejemplo, Lily, Clover, Royal, Marigold, etc.). Estamos trabajando para asegurarnos de que Horizon sea accesible y tenga el contraste adecuado en modos claro y oscuro.
38 Me gusta

4 Me gusta

[cita=“lindsey, post:1, tema:360484”]
Las tarjetas de tema contienen menos información. La característica más notable de Horizon es la tarjeta de tema. Hemos eliminado toda la información posible para que la lista de temas se vea limpia y accesible. Ccierta información, como una lista más completa de participantes del tema y etiquetas del tema, no es visible en la tarjeta de tema.
[/cita]

He estado usando Discourse durante años, pero nunca había escuchado el término “tarjeta de tema” antes. Parece que te refieres a las filas de la lista en la página Temas?

En el tema estándar, la página Temas es una tabla, con las siguientes columnas:

  • Tema: Título + Categoría + etiquetas
  • Una lista de avatares que participan en el tema
  • Respuestas: Número de respuestas
  • Vistas: Número de vistas
  • Actividad: Marca de tiempo, por ejemplo, 10m, 4h, etc.

En Horizon, no hay tabla. Cada fila tiene:

  • Título
  • Un avatar, el comentarista más reciente
  • El nombre de usuario de ese comentarista, “respondió” o “publicó” y la marca de tiempo de la actividad, por ejemplo, “lindsey publicó hace 9 minutos” “tobiaseigen respondió hace 11 minutos”
  • Un conteo de me gusta. (¿Qué es eso? ¿Me gusta en “Tema”? ¿Es el número de me gusta que alguien ha dado en algún momento en todo el tema…? Eso parece un número muy extraño, y una cifra especialmente extraña para destacar tan prominently.)
  • Un conteo de respuestas, junto a una pequeña flecha de respuesta
  • Categoría, ahora en la esquina derecha

Mis pensamientos:

  1. En mi opinión, la categoría del tema es mucho mucho más importante que la identidad de quien respondió más recientemente. Volvería a ponerlo a la izquierda, y colocaría “lindsey publicó hace 9 minutos” en la esquina derecha, donde solía estar la marca de tiempo de la actividad.
  2. Estoy de acuerdo en eliminar “Vistas.” A la vista, parece un número extraño para mostrar de manera tan prominente.
  3. No estoy seguro sobre eliminar los otros avatares. Quizá se me vaya haciendo familiar.
  4. No me gusta el mensaje destacado “¡Bienvenido de nuevo, usuario!”. El espacio en la cabecera es muy valioso.
  5. Ahora solo las filas de la lista de temas son “tarjetas,” con esquinas redondeadas y un espacio visible entre cada “tarjeta.” No me gusta, aunque quizás me vaya gustando con el tiempo. Prefiero que los temas estén separados por una simple línea divisor.
  6. Las etiquetas del tema han desaparecido completamente de las tarjetas del tema. Eso me parece mal; significa que solo se pueden ver las etiquetas del tema en la página del tema mismo.
9 Me gusta

Hay un poco de “arte previo” aquí a través de un componente temático — Topic Cards — que tiene un diseño similar.

Tienes razón en que hay un diseño muy diferente entre las listas de temas en Default y Horizon; esto es intencional. Agradezco tus comentarios iniciales y me interesaría saber si alguna de tus opiniones iniciales cambia (o no) en uno o dos días. ¡Espero que vuelvas y nos lo hagas saber!

2 Me gusta

Gracias por informar, se lo comunicaremos a nuestro equipo.

(Para que conste, se trata de un problema de transparencia con los filtros de categoría / etiqueta en la parte superior de la página /categories en dispositivos móviles).

3 Me gusta

Me entusiasma mucho este enfoque, ya que gestiono un foro para profesionales no técnicos.

La imagen de “Bienvenida” tiene algunos artefactos extraños encima de la búsqueda:

También preferiría que me llamaran por mi nombre, en lugar de mi apodo.

3 Me gusta

¿Podrías compartir algunos detalles sobre tu dispositivo/navegador? No veo esto en este momento, pero hemos estado retocando algunos problemas como estos en diferentes áreas, ¡así que obtener detalles específicos sería de gran ayuda!

Esto se puede lograr editando los textos del sitio; esta es una característica que recientemente agregamos al núcleo de Discourse, sobre la cual puedes leer aquí: Bringing popular features to Discourse: Header search, welcome banner, and category icons / emoji

4 Me gusta

DiscourseHub y móvil:

Forzar el uso de la barra lateral para iniciar un nuevo tema no sería el movimiento más inteligente, si el objetivo no son los usuarios más experimentados (especialmente cuando se usa un móvil).

6 Me gusta

Estoy usando la última versión de Safari 18.3.1 (20620.2.4.11.6) en un MacBook Pro de 14 pulgadas con la última versión de macOS 15.3.2.

3 Me gusta

Yo también he pensado en esto… incluso en el escritorio puedes hacer que la barra lateral desaparezca mientras lees, por lo que tener otra forma fácil de ser guiado hacia un nuevo tema parece tener sentido. No estoy seguro de dónde podría estar… ¿tienes alguna sugerencia? Google simplemente “minimiza” la barra lateral sin eliminarla por completo, por lo que nunca pierdes el botón de redacción de correos electrónicos nuevos.

Por otro lado, en Discourse, ¿qué tan esencial es el botón de nuevo tema para las personas que aún no conocen el funcionamiento? Después de todo, queremos que los nuevos miembros de una comunidad pasen tiempo conociendo la comunidad leyendo y respondiendo a las discusiones existentes.

4 Me gusta

Esto probablemente depende de la comunidad. En nuestra pequeña comunidad privada, animamos a los nuevos usuarios a publicar temas como una forma de compartir recursos que han creado/están utilizando, o para buscar ayuda.

Preferiría que el botón “nuevo tema” permaneciera visible de alguna manera.

Editar: la configuración de notificación de categorías también es importante para nosotros: las usamos como membresía ad hoc a grupos de interés (representados por diferentes categorías). El diseño actual les resta importancia. Preferiría que fueran más obvias y estuvieran claramente asociadas a la categoría actual. Tal como está, no está claro a qué se refieren:

Podrían referirse a la categoría “Documentación”.

Quizás podrían colocarse en la parte superior izquierda o derecha del propio banner.

4 Me gusta

¿Qué pasa con lo que ya tenemos? ¿Por qué intentar inventar la rueda de nuevo? :smirking_face:

(No me molesté en cambiar el idioma, ya conoces esta configuración)

Si el propósito de un foro es solo ofrecer algo para leer, entonces no es esencial en absoluto. Pero muchos foros se construyen para ofrecer algún tipo de Q/R y entonces el botón de nuevo tema es realmente esencial.

Y me gustaría pensar que mostrar lo más básico de las funcionalidades es lo más esencial que se puede hacer.

No es solo una cuestión de lectura. Yo no uso la barra lateral aquí en absoluto, porque no me aporta nada útil. Es solo otro componente sin ningún propósito, una distracción que llena el espacio vacío en pantallas grandes.

Pero en los móviles siempre está oculta. Lo que significa que los usuarios de móviles ahora deben hacer un toque adicional para iniciar un tema. ¿Contamos cuántos temas y publicaciones podemos encontrar donde los usuarios de escritorio cuentan clics antes de obtener lo que quieren y después de eso las cosas se han simplificado para ofrecer la cantidad mínima de clics? :smirking_face:

2 Me gusta

Aterrizo en el mismo lugar con esto. Por todos los medios, elimine los elementos de la interfaz y use las tarjetas de tema para crear separación visual, pero por otro lado, reubicar cosas como el botón ‘nuevo tema’ también dificulta que los usuarios no técnicos se familiaricen con otros temas de Discourse.

4 Me gusta

¡Por fin! A primera vista, ¡se ve genial! :chefs_kiss:
Me encontré con una versión anterior en Github y tenía curiosidad por la versión final. ¡Queda muy bien!

Aquí hay algunos comentarios aleatorios inmediatos:

  • Me gusta el fondo unificado alrededor de la salida principal: es elegante y ayuda a centrar el contenido. Sin embargo, en una pantalla grande, la falta de un límite definido para el contenido cansa la vista rápidamente. Obliga a los ojos a centrarse en un área grande. El tema Meta Branded es un buen ejemplo de cómo aliviar esto: proporcionar un límite y un fondo claros hace que se sienta equilibrado.

  • La ubicación del nuevo botón de tema tiene sentido; no te lo puedes perder. Me tomó unos segundos darme cuenta de dónde desapareció en el móvil. No soy muy usuario de móvil en Meta; habría esperado ver un botón aquí:

  • En la lista de temas, la fila se ve fantástica. Es simple: se centra en lo esencial. Veo dos cosas que me molestan:

    • La posición del estado “hot” es un poco confusa porque está demasiado cerca de la fila anterior.
    • No soy fan del borde completo. Individualmente, se ve muy bien, pero apilados juntos, se necesita más esfuerzo para leer el título real, especialmente al desplazarse. Podría ser un poco demasiado distractor. Quizás más espacio y/o un borde sutil podrían ayudar. (También necesito acostumbrarme; probablemente debería esperar y revisar mis comentarios más tarde.
      EDIT: Para ser justos, creo que es más el avatar debajo del título que el borde, lo que hace que la lectura sea menos directa. La vista móvil enfatiza aún más este problema con la categoría arriba y el avatar debajo del título)
  • El color de la paleta es maravilloso.

  • (No relacionado) El modo “composer peek” se ve bastante bien en este tema.

¡Espero con ansias las futuras mejoras!

8 Me gusta

¡Bonito tema! Lleva un poco de tiempo acostumbrarse visualmente (o al menos para mí)

Una cosa que pensé que podría ser agradable es hacer que la página /categories se parezca un poco a la de Air Theme porque todo parece estar en una caja en este tema horizon, tener una página de categoría con aspecto predeterminado se ve raro en mi opinión.

5 Me gusta

Ah, vale, puedo reproducirlo en esa versión de Safari pero no en la última versión (18.4). ¿Podrías actualizar y avisarme si el problema persiste?

1 me gusta

¡Este tema se ve realmente moderno, elegante y fantástico! Me encantan los botones redondeados, la lista de temas, entre otras cosas.

Sin embargo, encontré 4 pequeños problemas. Tenga en cuenta que todos estos ocurrieron en dispositivos móviles, usando Discourse en Chrome.

  1. Los temas se muestran como ‘nuevos’ con el punto azul incluso cuando no se han leído.

  2. El botón de traducción automática se agranda mucho cuando el editor está abierto.

  3. La vista previa de la publicación tiene esquinas blancas y el área con los botones de publicación no está unida (ver captura de pantalla).

  4. El contador y el botón de votos no están alineados con el título del tema.

6 Me gusta

Aquí hay algunas rarezas de altura:

Eché un vistazo rápido al código de la consola, pero mis ojos de CSS de aficionado no notaron nada peculiar de inmediato.

5 Me gusta

Iba a mencionar esto, es porque el nombre de usuario está envuelto, también puedes verlo en el segundo tema de esta lista a continuación. Esperemos que sea un pequeño arreglo de CSS para solucionar eso.

3 Me gusta

Por alguna razón extraña (y un poco molesta), este tema no cambia incluso si elijo otro tema después de este. Los colores siguen siendo los mismos, tanto que el contraste accesible (oscuro) es muy oscuro y no difiere en color de Meta Branded.

Este nuevo color es demasiado oscuro en comparación con lo que ofrecía Meta Branded. ¡Por favor, arréglalo pronto!

2 Me gusta