Menu, Pestañas o Arbol

[Carlex]

Hola compañeros.

Estoy retomando la programación y me incline por Unigui para reutilizar los conocimientos de Delphi y no complicarme con las nuevas herramientas. En este proceso estoy migrando una vieja aplicación de seguimiento de correspondencia hecho en Delphi y MySQL. La duda que tengo es que recomiendan para la navegación dentro de la aplicación, Menú (Horizontal/Vertical), Pestañas, Ventanas, un Árbol de opciones u otro.

Busco mas que todo, en base a su experiencia, pros y contras de cada una de ellas, cual es mas optimo y amigable al usuario a la vez.

Gracias!!
Saludos.

[Neftali [Germán.Estévez]]

Yo en el último proyecto que estoy haciendo, estoy probando los formularios en pestañas (emulando los navegadores)
Pare ello en VCL uso el componente TChromeTabs, aunque se pueden usar las estandard.


El menú, en la parte superior, como siempre, aunque uso uno lateral para las opciones más comunes, tipo al que se usa en dispositivos móviles (Multiview).

[Ñuño Martínez]

Yo diría que depende. Si hay pocas "pantallas" entonces las pestañas son suficientes. Si hay muchas y están gerarquizadas de alguna forma, entonces un menú. El árbol también es una opción muy válida en este segundo caso, y yo lo aprendí viendo el diálogo de configuración de Lazarus.

[mamcx]

Empezado por Carlex

Busco mas que todo, en base a su experiencia, pros y contras de cada una de ellas, cual es mas optimo y amigable al usuario a la vez.

Eso es dificil de responder porque la web no tiene un "tamaño" natural. Asi que realmente tienes que diseñar asumiendo todas las combinaciones imaginables, no solo de tamño de pantalla (lo que la mayoria cree que es "responsive design") sino incluyendo muchos otros factores como combinacion de colores, fuentes, etc.

Un recurso que recoje bastante del tema es https://refactoringui.com. Pero ya que me acorde que cuando sale el tema de la web me dicen que cuento sobre un monton de cosas, en terminos muy simples:

Las mejores interfaces en cuanto a usabilidad se inventaron hace años y se olvidaron: Masomenos tal como fue windows 2000/OSX Leopard.

Empieza diseñando desde la perpestiva de un "movil", como un iPhone. Luego brincas a iPAD y luego a una pantalla grande desktop.

Menus de UN solo nivel es lo MEJOR en terminos de usabilidad. Luego tabs. Luego menus desplegables y/o arboles

Es MEJOR usar textos que iconos. Esta bien iconos ademas de un texto. El texto debe ser corto y directo: Textos como "Aceptar" "Cancelar" tienden a ser malos. Es mejor que digan la accion concreta "Guardar", "Regresar", "Facturar", "Deshacer".

Piensa en jerarquias: De mas importante/relevante a menos importante. Todo fluye de arriba/abajo, izq a derecha (en nuestra familia de idiomas). Usa espacio, relacion y flujo para destacarlo y SECUNDARIAMENTE colores y tamaños.

Todo lo relacionado debe estar "agrupado".

Idealmente, ninguna tarea (incluendo desplegar un menu e ir a submenu) debe ser de una "profundidad" mayor a 3.


P.D: Es dificil determinar que esta relativamente bien diseñado cuando tanto color y bonito distrae. Pero esta es una pagina de componentes que muestra en gran medida:

https://tailwindui.com/components

que hace parte de TailwindCSS que es un framework css bien pensado.

[Ñuño Martínez]

Empezado por mamcx

Las mejores interfaces en cuanto a usabilidad se inventaron hace años y se olvidaron: Masomenos tal como fue windows 2000/OSX Leopard.

El UI más cómodo que he usado es el de OS X Tiger (justo la versión anterior a Leopard). Windows 2000 no lo he usado, pero OS/2 Warp era muy cómodo también.

[mamcx]

Empezado por Ñuño Martínez

El UI más cómodo que he usado es el de OS X Tiger (justo la versión anterior a Leopard). Windows 2000 no lo he usado, pero OS/2 Warp era muy cómodo también.

Windows 2000 era de lo mejor que ha existido. Era rápido (no solo al arrancar sino al operar) y estable como el solo.

[Carlex]

Empezado por mamcx

Eso es dificil de responder porque la web no tiene un "tamaño" natural. Asi que realmente tienes que diseñar asumiendo todas las combinaciones imaginables, no solo de tamño de pantalla (lo que la mayoria cree que es "responsive design") sino incluyendo muchos otros factores como combinacion de colores, fuentes, etc.

El tema del tamaño es algo muy importante que estoy tomando en cuenta ya que si bien el reponsive design ayuda mucho para en algunos casos evitar crear una aplicacion movil, complica para determinados componentes.

Empezado por mamcx

Menus de UN solo nivel es lo MEJOR en terminos de usabilidad. Luego tabs. Luego menus desplegables y/o arboles.....

Piensa en jerarquias: De mas importante/relevante a menos importante. Todo fluye de arriba/abajo, izq a derecha (en nuestra familia de idiomas). Usa espacio, relacion y flujo para destacarlo y SECUNDARIAMENTE colores y tamaños.

Este consejo al igual que el que dio Neftali es muy util para mi, creo que como puto medio optare por las tabs o pestañas ya que mi proyecto no tiene muchas opciones y apoyarme en un menu vertical.Gracias por sus comentarios !!