Saltar al contenido principal

Actualizar en la vista de tarjetas

Descripción general​

Los patrones de actualización/edición desde una vista de tarjetas se habilitan con los siguientes métodos. Elija un modo de visualización que se adapte al caso de uso y que sea coherente en todas las filas de la tabla.

  • Vista de cajón: Utilícela cuando los detalles de un objeto se puedan editar sin recurrir al desplazamiento y el contexto sea importante durante la edición, o cuando la interacción con la fila de origen sea importante.

  • Modales: Utilícelos cuando sea necesario centrar la atención en un objeto mientras se realizan ediciones o actualizaciones.

  • Transferencia de páginas: Use una nueva página para editar un objeto si el usuario debe ingresar detalles que sean complejos o si hay un número más grande de celdas que las que se pueden mostrar cómodamente en un modal o cajón. Por ejemplo, ediciones de varios pasos que implican el uso de flujos de asistente o formularios largos.

Puede usar objetos como enlaces para abrir la vista de edición, a fin de que el acceso sea más rápido. Cada uno de estos mecanismos de transferencia puede activarse desde un enlace, una acción o un control integrado mediante un ícono de detalles o un elemento de menú Editar. El modo de edición se puede activar desde un modo de detalles si es necesario ver los detalles antes de actualizarlos. Los usuarios vuelven a la tarjeta cuando guardan o cancelan la vista de edición.

Actualizar detalles mediante el cajón​

Utilice el cajón para actualizar detalles en estas situaciones:

  • Los detalles que se mostrarán caben sin necesidad de que los usuarios se desplacen hacia abajo en el panel.
  • No es necesario centrar la atención del usuario en un objeto.

Flujo de interacción del cajón​

Flujo de interacción del cajón de vista de tarjetas

Pautas para el uso del cajón​

Desencadenador

  • La vista de cajón normalmente se activa desde una acción de edición como un botón, ícono o en un menú de desbordamiento.
  • El modo de edición se puede activar desde un modo de detalles si es necesario ver los detalles antes de actualizarlos.

Validación y mensajería

  • Utilice patrones de validación y mensajería adecuados para informar a los usuarios sobre los cambios de estado.
  • Muestre una notificación del sistema con los mensajes adecuados para mantener informados a los usuarios, tanto cuando se actualiza un objeto como cuando se produce un error en el proceso.
  • Utilice la validación de formularios junto con los mecanismos de mensajería en el cajón cuando se produzcan errores.

Flujos de acción correcta/error

  • Regrese a los usuarios a la interfaz de usuario original desde donde se activó el flujo de edición.
  • Entregue un mensaje de acción correcta mediante mensajes del sistema.

Flujos de cancelación

  • Proporcione a los usuarios los medios para cancelar o cerrar la vista de cajón.

Actualizar detalles mediante una ventana modal​

Las ventanas modales son útiles cuando se requiere centrar la atención en un objeto mientras se realizan actualizaciones y cuando es necesario editar detalles mínimos.

Flujo de interacción de modal de vista de tarjetas

Pautas para el uso de modales​

Desencadenador

  • La vista de modal normalmente se activa desde una acción de edición como un botón, ícono o en un menú de desbordamiento.
  • El modo de edición se puede activar desde un modo de detalles si es necesario ver los detalles antes de actualizarlos.

Validación y mensajería

  • Utilice patrones de validación y mensajería adecuados para informar a los usuarios sobre los cambios de estado.
  • Muestre una notificación del sistema con los mensajes adecuados para mantener informados a los usuarios, tanto cuando se actualiza un objeto como cuando se produce un error en el proceso.
  • Muestre mensajes de validación apropiados en el modal si se producen errores.

Flujos de acción correcta/error

  • Regrese a los usuarios a la interfaz de usuario original desde donde se activó el flujo de actualización o edición.
  • Entregue un mensaje de acción correcta mediante mensajes del sistema.

Flujos de cancelación

  • Proporcione a los usuarios los medios para cancelar o cerrar la ventana modal.

Actualizar detalles mediante transferencia de páginas​

Utilice la transferencia de páginas para mostrar y editar detalles cuando estos no quepan en un cajón o modal. Estas páginas pueden tener estructuras complejas (por ejemplo, pestañas o asistentes), visualizaciones de datos como gráficos o acciones que pueden requerir su propia interfaz de usuario de cajón.

Flujo de interacción de transferencia de páginas​

Flujo de interacción de transferencia de páginas en vista de tarjetas

Pautas para el uso de la transferencia de páginas​

Desencadenador

  • La transferencia de páginas normalmente se activa desde una acción de edición como un botón, ícono o en un menú de desbordamiento.
  • El modo de edición se puede activar desde un modo de detalles si es necesario ver los detalles antes de actualizarlos.

Validación y mensajería

  • Utilice patrones de validación y mensajería adecuados para informar a los usuarios sobre los cambios de estado.
  • Muestre notificaciones del sistema con los mensajes adecuados para mantener informados a los usuarios, tanto cuando se actualiza un objeto como cuando se produce un error en el proceso.
  • Utilice la validación de formularios junto con los mecanismos de mensajería en la página cuando se produzcan errores.

Flujos de acción correcta/error

  • Regrese a los usuarios a la interfaz de usuario original desde donde se activó el flujo de actualización o edición.
  • Entregue un mensaje de acción correcta mediante mensajes del sistema.

Flujos de cancelación

  • Proporcione a los usuarios los medios para retroceder o cancelar la vista de edición.