Nuevo diseño de temas y componentes

¿Estás seguro de este diseño?

Hace que encontrar el componente correcto sea realmente difícil. Y se ve… realmente inquieto.

Y creo que el botón de instalar debería ser el primer componente, no el último. Se usa con más frecuencia que los componentes.

¿Dónde están los deshabilitados, aquellos sin temas conectados a ellos?

9 Me gusta

¡El cambio es interesante!

Mirando los PRs iniciales como:

(pero también #29225, #29079)

Aprecio la intención de simplificar y crear una interfaz más fácil de usar.
¡Creo que con las capturas de pantalla y la descripción apropiadas, se vería bastante bien!
Fusionar temas y componentes tiene sentido.
Evitar múltiples barras laterales también parece una buena idea.

Mi preocupación inmediata es la falta de búsqueda y filtrado, pero estoy seguro de que la interfaz de usuario se refinará con mejoras más adelante. Cuando tienes muchos componentes, es una característica imprescindible.

Otros comentarios:

¡Espero con ansias las futuras mejoras!

5 Me gusta

Y realmente me gustaría buscar allí. Me dio un poco de náuseas al desplazarme hacia arriba y hacia abajo buscando el componente de fuentes de Google…

4 Me gusta

Estoy totalmente de acuerdo, este no es un enfoque práctico:

Me da tantos mareos… De hecho, agregué algunos estilos para poder navegar por la página de componentes de una manera sencilla de nuevo :cara_invertida: :cara_con_ojos_en_espiral:

11 Me gusta

Lo que también estoy intentando hacer. :smile:
Por curiosidad, estaba intentando crear un botón de lista o cuadrícula y agruparlo por estado. Sería genial añadir algunas opciones de filtrado en la parte superior.

La vista de cuadrícula puede ser interesante para algunas personas, sin embargo. Al menos, para el tema, tiene sentido.

4 Me gusta

@osama @ella y @hugh están en medio de este trabajo, y están discutiendo algunas de estas mismas cosas internamente.

Por supuesto, sigan compartiendo sus comentarios aquí, pero esperen que esto siga cambiando en un futuro cercano, independientemente.

9 Me gusta

Para complementar lo que dije anteriormente:

  • Agrupado por estado
  • Búsqueda
  • Vista de cuadrícula o lista

Aquí hay una demostración rudimentaria (no soy diseñador, solo lo hice por diversión), estaría bastante contento con algo similar:

Otra vista posible para aquellos a los que les gustan las cajas pero con información mínima:

Imagen

(la inspiración es de Find the Perfect Icon for Your Project | Font Awesome)

Una última función que me gustaría ver es la capacidad de habilitar/deshabilitar directamente desde la lista. Será menos directo, por lo que un atajo sería bienvenido.

8 Me gusta

¿Te apetece compartirlo :smirking_face:?

(Y sí, sé que solo sería una solución temporal, pero aun así)

2 Me gusta

Aquí tienes :slight_smile:

Estilos temporales
.admin-config.customize.components {
  .admin-detail {
    padding: 0;
  }
  .themes-cards-container {
    display: flex;
    flex-direction: column;
    max-width: 500px;
    gap: 0;
  }
  .admin-config-area-card__content {
    flex-grow: 0;
    margin: 0;
    padding: 0;
  }
  .theme-card {
    flex-direction: row;
    margin: 0;
    padding: 0.75rem;
    padding-right: 0;
    box-shadow: none;
    border: none;
    border-top: 1px solid var(--primary-low);
    
    &:first-child {
      border-top: none;
    }
    
    &__image-wrapper,
    &__content {
      display: none;
    }
    &__footer {
      gap: 1rem;
    }
  }
  .theme-install-card {
    margin-top: 1rem;
  }
}
8 Me gusta

¡Eres mi nuevo héroe!

Y, al crear un nuevo componente, no se abren configuraciones, pero debería encontrarse en la lista y abrirse.

3 Me gusta

Cada vez me convenzo más de que quedarse en estable es la mejor opción. Después del drama de la configuración del sitio del mes pasado, este es otro ejemplo de algo que funcionaba bien, pero que se cambió y se lanzó a producción sin una configuración de feature flag, sin estar terminado o probado adecuadamente.

(Y para darte comentarios más constructivos sobre la característica específica, al menos sería muy útil si los componentes no utilizados y deshabilitados se pudieran reconocer en la pantalla general).

9 Me gusta

En realidad, acabo de recordarlo. Me pregunto legítimamente si hay alguna razón por la que este cambio no sea parte de Discourse Design team experimentation topic. Ese sería el lugar adecuado entre los otros, design-experiment.

Estoy de acuerdo en que se siente apresurado; sin información previa y configuración de feature flag, entiendo que puede no ofrecer la mejor experiencia para los administradores.

8 Me gusta

Existen varias formas diferentes en las que implementamos funciones, dependiendo de nuestra percepción del riesgo del cambio en cuestión.

En mi opinión, este es un caso en el que el riesgo es bastante bajo. El flujo de trabajo de nadie se ve afectado y el cambio se limita a los administradores, no a todos los miembros de una comunidad.

Entiendo que esto causa algunas interrupciones para aquellos que pasan mucho tiempo lidiando con temas y componentes. Agradecería más comentarios sobre cómo el cambio ha afectado el flujo de trabajo de alguien en particular, ya que ayudará a informar nuestras decisiones sobre el diseño de esta parte de la aplicación.

Sin embargo, no creo que este sea un caso en el que recurriría a un experimento de diseño o a una bandera de función.

2 Me gusta

Creo que para facilitar las cosas, también deberías poder filtrar los componentes por el tema al que se añaden.

1 me gusta

Un administrador necesita que las cosas le faciliten la vida. Tal vez sea comprensible experimentar. Pero dale a los administradores una opción de respaldo o un interruptor para cambiar entre la Coca-Cola clásica y la nueva. Por cierto, si mal no recuerdo, la Coca-Cola nueva no funcionó.

4 Me gusta

Trabajé en un tema de cliente y, después de actualizar la instancia de staging, me enfrenté al nuevo diseño. Tuve que detenerme y agregar los estilos que compartí anteriormente para poder seguir trabajando de manera efectiva. El diseño actual no permite ninguna visión general ni da pistas sobre qué componentes se están utilizando actualmente, cuáles están deshabilitados, etc. Diría que desarrollar un tema o una nueva configuración rompe completamente el flujo de trabajo.

La lista anterior era realmente buena. Si mal no recuerdo, incluso se mejoró no hace mucho. El único filtro que le faltaba era para filtrar los componentes que se usan en el tema actual (el filtro “Usado” en realidad mostraba todos los componentes usados en cualquier tema instalado). Pero por lo demás, era una interfaz que no requería mucha mejora, al menos no para administradores o desarrolladores experimentados.

9 Me gusta

Gracias por la historia.
Escuchar más sobre los tipos de problemas que la gente encuentra en diferentes escenarios es útil.

Gracias por compartir esto también.

5 Me gusta

Bueno, diría que cada aviso en este tema provino de intentar hacer algo, que era parte del flujo de trabajo :man_shrugging:

2 Me gusta

Acabo de notar que no hay ningún filtro actual, ni siquiera por nombre.

1 me gusta

Sugeriría que tu equipo intente usar esto en un escenario del mundo real… hay tanta funcionalidad que falta que ha desaparecido.

1 me gusta