¿Cuál es el nombre de este diseño de GUI?

Perdón por hacer esa pregunta, debo confesar que no tengo un dispositivo portátil, pero deseo hablar sobre las opciones de diseño para la aplicación de escritorio que desarrollo.

ingrese la descripción de la imagen aquí

¿Podría decirme el nombre de este tipo de diseño?

¿Tú... no tienes un hh-handheld?...
Sí, me gusta ser inalcanzable de vez en cuando (con una buena razón)... y estoy seguro: tener uno sería mucho más molesto que SO ;)
¡Pero con un teléfono inteligente puede obtener la aplicación SE! <3 :3

Respuestas (2)

Me parece simplemente un menú de diseño receptivo : cuando un sitio se reduce al tamaño de un dispositivo móvil, el menú generalmente superior (global) "migra" para estar en la parte superior del sitio móvil.

Puede probar esto tomando un sitio y reduciendo la ventana del navegador (esto no es lo suficientemente bueno para el desarrollo, pero le dará una idea. Para el desarrollador, existen herramientas que lo ayudarán a cambiar el tamaño correctamente).

Editar: aquí hay una visualización simple de cómo funciona el diseño receptivo:

ingrese la descripción de la imagen aquí

Los objetos se reorganizan. Lo que parece volverse cada vez más común es en realidad tomar un menú superior "ordinario" y comprimirlo en un símbolo en el que se puede hacer clic, lo que popularmente se conoce como la "hamburguesa:

ingrese la descripción de la imagen aquí

También te recomendaré que comiences a mirar el diseño receptivo a través de marcos como bootstrap. Ellos han hecho la mayor parte del trabajo pesado por usted.

Aquí hay un ejemplo de diseño receptivo; esto del sitio de Bootstraps. Ancho completo:

ingrese la descripción de la imagen aquí

Y aquí en vista móvil. Tenga en cuenta que el menú superior ahora se ha "ocultado" detrás de la hamburguesa:

ingrese la descripción de la imagen aquí

En estos días, los sitios web se construyen lo que se llama "móvil primero". Significa que los marcos y el diseño de back-end se diseñaron primero para dispositivos móviles. La gran mayoría de los surfistas del mundo utilizan teléfonos móviles. Haga algo fácil de usar a pequeña escala, hacerlo a gran escala no es un problema.

Después de probar con la reducción del navegador (experiencia interesante, de hecho) y repensar: esta no es la respuesta que estoy buscando. Tenemos que mostrar datos reales en estos cuadros.
Se aplica el mismo principio: el contenido de las casillas es irrelevante. Y puede reducir diferentes sitios, y tendrán una estructura receptiva más o menos funcional. Este sitio, por ejemplo, no tiene remedio en este sentido.
Gracias, entiendo que pedir un solo diseño probablemente subestime el problema real. Pero por ahora tuve un problema de comunicación, que parece ser resuelto por la respuesta de Zacharia

Esto se conoce como diseño receptivo Twitter Bootstrap tiene un montón de herramientas para ayudar con la web, puede ver su sitio para ver un sistema receptivo en uso.

Esto lo ayudaría a diseñar un sitio web de escritorio receptivo que podría implementarse en un dispositivo móvil o tableta.

Esto se puede emular a través de Chrome> Inspeccionar elementos> Emulación> Emular.

Si desea hacer esto sin el uso de un marco prefabricado, las consultas de medios para css (hojas de estilo en cascada) serían su mejor manera de hacerlo.

Hay algunos buenos tutoriales en línea que podrían ayudarte.

Diseño receptivo con consultas de medios css3

EDITAR: El diseño en la imagen sería un "Diseño de pila".

Espero eso ayude :)

Esto también ayuda, pero este no es el nombre del diseño específico. ¿Es simplemente un "diseño de flujo" vertical?
Si se refiere a que es solo el diseño que ha mostrado, se conocería como un diseño de pila.
¡Genial, tan sencillo! ¿Qué hay de reelaborar la respuesta: el punto después de EDITAR se encuentra con la pregunta;)
¿Cuál es el nombre de este diseño de GUI?
RespuestasAquíPolítica de privacidad1y, 0v