Navegación básica: entender la interfaz

Entender la interfaz de MediaMonster es esencial para trabajar eficientemente con tus imágenes. La plataforma está diseñada para ser intuitiva, pero conocer cada área y sus funcionalidades te ayudará a aprovechar al máximo todas las características disponibles.

Esta guía te llevará por un tour completo de la interfaz, explicando cada sección y cómo usarla para navegar y gestionar tus proyectos e imágenes.

Estructura general de la interfaz

MediaMonster tiene una estructura de tres áreas principales:

• Sidebar izquierdo: Navegación de proyectos y carpetas
• Área central: Galería de imágenes y contenido principal
• Header superior: Búsqueda, acciones y controles

Esta disposición te permite acceder rápidamente a tus proyectos, ver tus imágenes y realizar acciones sin perder contexto.

Sidebar izquierdo

El sidebar es tu punto de acceso principal a todos tus proyectos y carpetas.

Lista de proyectos

En la parte superior del sidebar verás:

• Todos tus proyectos listados verticalmente
• Nombre y portada de cada proyecto para identificación visual
• Indicador visual del proyecto actualmente seleccionado

Funcionalidades:

• Clic en un proyecto: Abre el proyecto y muestra su contenido
• Hover: Muestra opciones adicionales (editar, eliminar, colaboradores)
• Scroll: Si tienes muchos proyectos, puedes desplazarte por la lista

Navegación de carpetas

Debajo de la lista de proyectos, cuando tienes un proyecto abierto, verás:

• Árbol de carpetas del proyecto actual
• Estructura jerárquica mostrando carpetas y subcarpetas
• Navegación expandible para explorar la estructura completa

Funcionalidades:

• Clic en una carpeta: Navega dentro de la carpeta
• Expandir/colapsar: Muestra u oculta subcarpetas
• Indicador visual: Muestra qué carpeta estás viendo actualmente

Perfil de usuario

En la parte inferior del sidebar:

• Tu foto de perfil y nombre
• Menú de usuario con opciones de configuración
• Acceso rápido a tu perfil y configuración

Área central: Galería

El área central es donde ves y trabajas con tus imágenes.

Vista de proyectos

Cuando estás en la vista principal de proyectos:

• Grid de proyectos mostrando todos tus proyectos
• Portadas de proyectos como miniaturas
• Información básica (nombre, descripción si está visible)

Vista de galería

Cuando estás dentro de un proyecto o carpeta:

• Galería de imágenes en formato grid o masonry
• Miniaturas de imágenes con información básica
• Paginación o scroll infinito según la vista seleccionada

Vistas disponibles

MediaMonster ofrece dos tipos de vista:

Vista Standard (Grid):

• Imágenes en cuadrícula uniforme
• Paginación tradicional
• Ideal para navegación precisa y organización

Vista Masonry:

• Diseño tipo Pinterest con alturas variables
• Scroll infinito
• Ideal para exploración visual y descubrimiento

Puedes cambiar entre vistas usando el menú en el header.

Header superior

El header contiene las herramientas principales para trabajar con tus imágenes.

Breadcrumbs (migas de pan)

En la parte izquierda del header:

• Ruta de navegación mostrando tu ubicación actual
• Enlaces clicables para volver a niveles anteriores
• Ejemplo: Proyectos > Mi Proyecto > Carpeta > Subcarpeta

Uso: Haz clic en cualquier parte del breadcrumb para navegar directamente a ese nivel.

Barra de búsqueda

En el centro del header (en desktop):

• Campo de búsqueda para encontrar imágenes
• Iconos de modo para cambiar entre búsqueda simple, semántica o avanzada
• Búsqueda inteligente que busca por contenido, no solo por nombre

Funcionalidades:

• Escribe y presiona Enter: Ejecuta la búsqueda
• Clic en iconos: Cambia el modo de búsqueda
• Búsqueda contextual: Busca dentro del proyecto/carpeta actual

Acciones y controles

En la parte derecha del header:

• Lista de colaboradores: Muestra quién tiene acceso al proyecto
• Menú de vista: Cambia entre Standard y Masonry
• Botón de añadir: Sube nuevas imágenes o crea carpetas
• Menú de opciones: Acceso a configuraciones adicionales

Navegación móvil

En dispositivos móviles, la interfaz se adapta:

Sidebar móvil

• Botón flotante en la esquina inferior izquierda
• Menú deslizable que se abre desde la izquierda
• Mismo contenido que el sidebar de desktop

Header móvil

• Búsqueda prominente en la parte superior
• Breadcrumbs compactos para ahorrar espacio
• Botones de acción accesibles pero optimizados

Atajos de navegación útiles

Navegación con teclado

• Flechas: Navega entre imágenes (cuando aplica)
• Escape: Cierra diálogos o vuelve atrás
• Ctrl/Cmd + K: Abre búsqueda rápida (si está disponible)

Navegación con mouse

• Clic izquierdo: Selecciona y navega
• Clic derecho: Menú contextual con opciones
• Drag & drop: Arrastra imágenes entre carpetas

Áreas adicionales

Vista de detalle

Cuando haces clic en una imagen:

• Vista completa de la imagen
• Panel lateral con información y análisis
• Navegación entre imágenes relacionadas
• Acciones como descargar, eliminar, mover

Diálogos y modales

Varios diálogos aparecen para acciones específicas:

• Subir imágenes: Diálogo para seleccionar y subir archivos
• Crear carpeta: Formulario para nueva carpeta
• Configuración: Panel de opciones del proyecto
• Colaboradores: Gestión de permisos y acceso

Consejos de navegación

Organiza tu sidebar

• Nombra proyectos claramente para encontrarlos rápido
• Usa portadas distintivas para identificación visual
• Mantén una estructura consistente de carpetas

Aprovecha los breadcrumbs

• Navega rápidamente haciendo clic en niveles anteriores
• Entiende tu ubicación en la estructura del proyecto
• Vuelve fácilmente a la raíz del proyecto

Usa la búsqueda eficientemente

• Busca por contenido en lugar de solo por nombre
• Cambia modos de búsqueda según lo que necesites encontrar
• Usa búsqueda contextual dentro de carpetas específicas

FAQ sobre navegación

¿Puedo personalizar el sidebar?
Actualmente el sidebar tiene una estructura fija, pero puedes organizar tus proyectos y carpetas para optimizar tu navegación.

¿Cómo cambio entre proyectos rápidamente?
Haz clic directamente en el proyecto en el sidebar, o usa los breadcrumbs para navegar.

¿Puedo ocultar el sidebar?
En algunas vistas, el sidebar puede colapsarse. Busca el botón de toggle en la interfaz.

¿Cómo vuelvo a la vista principal?
Haz clic en el logo de MediaMonster o en "Proyectos" en el breadcrumb para volver a la vista principal.

¿La interfaz es diferente en móvil?
La interfaz se adapta automáticamente a dispositivos móviles, manteniendo todas las funcionalidades pero optimizada para pantallas táctiles.

¿Puedo cambiar el tamaño de las miniaturas?
El tamaño de las miniaturas se ajusta automáticamente según la vista seleccionada (Standard o Masonry).

Conclusión

Entender la navegación de MediaMonster es fundamental para trabajar eficientemente. Con el sidebar para acceso rápido, la galería central para visualización y el header para acciones, tienes todo lo necesario al alcance.

Una vez que te sientas cómodo con la navegación básica, puedes explorar funcionalidades más avanzadas como subir imágenes o búsqueda semántica.

Próximos pasos

1. Explora el sidebar y familiarízate con tus proyectos
2. Navega entre carpetas para entender la estructura
3. Prueba las diferentes vistas (Standard y Masonry)
4. Usa los breadcrumbs para navegar rápidamente
5. Experimenta con la búsqueda para encontrar imágenes

¡Ya conoces los fundamentos de la navegación en MediaMonster!