Soy Claudio y trabajo como líder de UX en Canonical, la editorial de Ubuntu. Esta es mi primera publicación aquí en Meta Discourse, pero todos somos usuarios de Discourse para el foro de la comunidad de nuestros sitios web y productos en Canonical.
Hace un tiempo exploramos cómo podría verse Discourse cuando se incluye dentro del dominio principal de un sitio web existente, en lugar de un subdominio (por ejemplo, pasar de ‘discourse.ubuntu.com’ a ‘ubuntu.com/discourse’).
Utilizar el sitio web de nivel superior en lugar de un subdominio necesariamente cambiaría la navegación de Discourse, sus interacciones y la apariencia general para que se integre de manera coherente y fluida. Entendemos que este es un trabajo de exploración que afectaría varias partes de la UX existente, pero pensamos que era bueno compartirlo de todos modos y, eventualmente, debatir si alguna de estas modificaciones podría interesar o ser una propuesta válida (quizás como plantilla) también para la versión upstream.
En cuanto al estilo, utiliza nuestro framework CSS de código abierto Vanilla y sus componentes.
Voy a publicar todas las imágenes aquí, respondiendo a esta introducción inicial.
Por favor, hágannos saber qué opinan; estaremos disponibles para discutir esto más a fondo o con mayor detalle.
En nuestra propuesta, eliminamos el menú hamburguesa que viene por defecto en Discourse y utilizamos un componente de navegación lateral como punto de entrada principal para todas las páginas. La razón es que integrar Discourse en la navegación existente de un sitio web requiere mantener la coherencia con la estructura actual del sitio. De esta manera, también podemos mostrar a los usuarios todas las páginas y temas disponibles directamente en un único componente de navegación, siempre visible.
La funcionalidad de búsqueda está integrada en la navegación global del sitio web e incluiría también los resultados de búsqueda de Discourse. Dado que esto podría requerir cambios importantes en el front-end y el back-end, el campo de entrada de búsqueda podría trasladarse a las páginas de Discourse para funcionar de forma independiente.
Cuando los usuarios inician sesión, se muestra el botón de llamada a la acción «Nuevo tema», así como el elemento «Cuenta» en la navegación lateral izquierda.
En lugar de mostrar «Últimos», «Nuevos», «Sin leer», «Top» y «Categorías» todos juntos en la parte superior de la página, podemos incluir las categorías en la navegación lateral y el resto en un menú desplegable donde los usuarios puedan seleccionar la vista de contenido que deseen ver.
Hemos reorganizado la tabla al mostrar todos los temas. Las categorías se muestran mediante etiquetas de colores que los usuarios pueden hacer clic para acceder directamente a un tema específico. La imagen de perfil de los usuarios y múltiples usuarios se colapsan visualmente para ahorrar espacio. Las respuestas, las vistas y la actividad siguen siendo visibles.
Dentro de un tema o categoría, aparece el botón de acción «Opción de seguir». Mediante un menú desplegable, los usuarios pueden decidir el nivel de notificaciones que desean recibir. Nuestra propuesta muestra la etiqueta en el menú desplegable para que los usuarios puedan comprender fácilmente su suscripción a ese tema.
Al seleccionar «Superior» en el menú superior de la vista, los usuarios pueden decidir qué parte del tiempo mostrar a través del menú desplegable «Todo el tiempo».
Cuando el usuario ha iniciado sesión, su foto de perfil e información se muestran en la parte superior. En la página de información, las páginas secundarias se expanden en la navegación lateral, mientras que «Todos los temas» se contrae. Si el usuario no ha iniciado sesión, la página de información es la misma, pero no muestra el perfil en la parte superior ni la opción de «cuenta».
Los elementos del menú horizontal en Discourse están incluidos en la barra de navegación lateral: “Resumen - Actividad - Notificaciones - Mensajes - Insignias - Preferencias”. Los elementos del menú de subpáginas se abrirán bajo el principal correspondiente, por ejemplo: Actividad > Todo, Tema, Respuestas, Borradores, Me gusta, Marcadores.
Por favor, háznos saber qué opinas; estaríamos disponibles para discutirlo más a fondo o con mayor detalle.
Las cosas van bien. Pero el menú izquierdo se fusiona visualmente con el contenido principal. Mira si puedes separarlo como en Stack Overflow, por ejemplo. Quizás el fondo, la sangría, el color. Hay muchas opciones.
He notado que, desde que trabajamos en esto, Discourse ha cambiado los iconos de notificación/seguir (ahora son mucho más claros, debo decir), por lo que necesitamos actualizar esto en consecuencia.
Siéntete libre de subir tu tema al creador de temas.
Me encantaría explorar y darte retroalimentación sobre cómo se siente. Hay bastantes elementos de la interfaz ocultos que probablemente también debas revisar, como la interfaz de reporte/interfaz de marcadores, etc.
¡Esto se ve genial! Una cosa que no veo representada aquí son las notificaciones:
¿Esas se listarían junto con el enlace “cuenta” de la barra lateral?
También asumo que no hay planes de usar etiquetas, ya que no las veo representadas aquí… esa fue una de las razones por las que nos alejamos de tener una columna dedicada a categorías.
Con la categoría bajo el título, podemos mantener las categorías y las etiquetas estrechamente asociadas y también mantener la coherencia con la disposición del título en la parte superior de cada página de tema (acabo de notar también en tu diseño que la categoría no se muestra una vez que entras en un tema, ¿es intencional?).
Gracias @sam, echaremos un vistazo a la guía. De hecho, una especie de prototipo ayudaría a resaltar los problemas y las partes pasadas por alto en la interfaz de usuario actual.
Gracias por tu respuesta, @awesomerobot. Al mover Discourse bajo el dominio principal (no, por ejemplo, meta.discourse, sino The easiest way to host a Discourse community | Discourse - Civilized Discussion), tuvimos que eliminar la imagen de usuario, ya que podría entrar en conflicto con una existente en la cuenta o foto de perfil del sitio web principal. Creo que las etiquetas no estaban presentes cuando exploramos esta solución, por lo que es algo que debe incluirse en un seguimiento. Las categorías debajo del título son, de hecho, un punto muy acertado.
Gracias a todos por sus comentarios; nos ayudarán con el seguimiento de estos diseños.
