Menú de cuadrícula receptivo
El menú de cuadrícula en Navi+ está diseñado con un enfoque móvil primero. Esto significa que configuras y optimizas el menú en móvil primero, y la versión de escritorio se escalará automáticamente desde el diseño móvil en lugar de ser reconstruida desde cero.
Los menús de cuadrícula se utilizan típicamente para resaltar características clave o categorías importantes, generalmente con 8 a 12 elementos. En móvil, la cuadrícula se muestra comúnmente en 2 a 3 filas, con 4 a 5 elementos por fila. Para lograr esto, puedes usar la configuración de diseño de ancho, como 3/12 o 2/10, para controlar cómo se ajusta la cuadrícula en pantallas más pequeñas.
En escritorio, el ancho de pantalla disponible es mucho mayor (a menudo equivalente a 2–3 pantallas móviles). Si la cuadrícula aún muestra solo 4–5 elementos por fila, puede parecer demasiado escasa. Para resolver esto, Navi+ proporciona la configuración de relación de visualización de escritorio/móvil. Por ejemplo, cuando estableces una relación de 2x, el número de elementos mostrados por fila de escritorio se duplicará en comparación con móvil, resultando en 8–10 elementos por fila, lo que crea un diseño más equilibrado en pantallas grandes.
En móvil, los menús de cuadrícula se pueden mostrar de dos maneras. La primera opción es de ancho completo, donde la cuadrícula llena todo el ancho de la pantalla, haciendo que los elementos sean fáciles de ver y tocar. La segunda opción es una cuadrícula desplazable horizontalmente, donde los tamaños de los elementos permanecen fijos y los usuarios pueden deslizarse hacia la izquierda o derecha para explorar más contenido. Ambas opciones funcionan bien en móvil, y puedes elegir la que mejor se adapte a tu contenido y caso de uso.
| En escritorio, los gestos de deslizamiento no son comunes, por lo que el menú de cuadrícula se muestra con un ancho fijo del 100%. Al combinar la relación de visualización de escritorio/móvil con configuraciones de tamaño específicas del dispositivo (usando el formato 8 | 16, lo que significa 8 en móvil y 16 en escritorio), puedes asegurarte de que la cuadrícula se vea clara, llena y bien proporcionada en pantallas más grandes. |
Este enfoque mantiene tu menú de cuadrícula consistente en móvil y escritorio, fácil de gestionar y simple de actualizar, sin mantener dos sistemas de menú separados. Solo necesitas diseñar el menú de cuadrícula una vez en móvil, y Navi+ se encarga del resto.