Componentes

📄️ Botón

Un botón activa un evento o una acción y permite que los usuarios sepan qué sucederá a continuación.

Los campos de entrada permiten a los usuarios ingresar texto en una interfaz de usuario. Por lo general, aparecen en formularios y cuadros de diálogo. Los campos de entrada en dispositivos móviles deben tener un tamaño de texto de al menos 16 píxeles para evitar el zoom automático en los navegadores móviles.

📄️ Checkbox & Radio

Las casillas de verificación permiten a los usuarios seleccionar uno o más elementos de un conjunto, mientras que los botones de opción permiten a los usuarios seleccionar solo una opción de un conjunto. Ambos también se pueden utilizar para activar o desactivar una opción.

📄️ Etiquetas

Las etiquetas (también conocidas como “chips”) son elementos compactos que permiten a los usuarios ingresar información, hacer selecciones, filtrar contenido o activar acciones. Son similares a las badges, pero se usan más comúnmente en entradas para permitir que los usuarios seleccionen varios elementos a la vez.

📄️ Menu desplegable

Los menús desplegables de entrada se utilizan para agrupar acciones en una subvista. Son útiles para permitir a los usuarios seleccionar entre una gran cantidad de opciones o incluso buscar opciones dentro del campo de entrada antes de seleccionarlas.

📄️ Modales

Un modal es una ventana secundaria que comunica o proporciona una acción dentro del mismo proceso. Son increíblemente útiles para comunicar información adicional, recopilar información o dirigir a los usuarios sin obligarlos a abandonar la página. Cuando los modales se usan innecesariamente, pueden volverse intrusivos y molestos para el usuario. A nadie le gustan los pop-ups.

📄️ Tablas

Las tablas de datos muestran información en un formato de cuadrícula de filas y columnas. Organizan la información de una manera que sea fácil de analizar para que los usuarios puedan buscar patrones y desarrollar conocimientos a partir de los datos.

📄️ Paginación

La paginación proporciona navegación horizontal entre fragmentos (páginas) de un conjunto de datos.

📄️ Indicadores de progreso

Las barras de progreso indican el porcentaje completado de una tarea. Pueden resultar útiles para solicitar al usuario que complete una acción o proceso.

📄️ Carrusel

Los carruseles se utilizan para mostrar múltiples piezas de contenido en el mismo espacio de la interfaz de usuario, permitiendo al usuario navegar entre ellas de manera interactiva. Son útiles en las siguientes situaciones:

📄️ Alertas

Las alertas son un método importante para comunicarse con usuarios importantes y proporcionar comentarios. Las alertas pueden servir como mensajes informativos, donde brindan información adicional a los usuarios que puede no estar vinculada a su acción o tarea actual. También se pueden utilizar para proporcionar comentarios directos a los usuarios y las acciones.