Mobile first... que opinais?
Iniciado por Silvia77 · 7 mar 2015 · 12 respuestas · 10.924 visitas
Silvia77 Hola a todos
llevo ya tiempo leyendo acerca de esto y me apetecía comentarlo con vosotros.
Resulta que hay una corriente que dice que la forma ideal de diseñar y maquetar un sitio web no es hacer la version de escritorio primero y despues adaptarlo para movil, si no al reves: comenzar diseñando para la pantalla mas pequeña y a partir de ahi ir haciendola crecer. De esta forma en lugar de enfrentarnos a la problematica de "y ahora donde meto esto" no encontramos con que comenzamos con lo justo y necesario y segun tenemos sitio nos podemos "ir gustando". De la misma forma, los estilos se definen , por medio de las media querys, de menor tamaño de pantalla a mayor.
Que opinais? Utilizais esta metodología o seguis haciendolo de la forma "tradicional"? Yo reconozco que aun lo hago de mayor a menor, es un vicio adquirido porque cuando comencé no habia moviles... pero para el proximo proyecto voy a probar a hacerlo de esta manera.Rhazz La opción "No habia oido hablar de esto hasta ahora xD" es perfecta para mí, con eso ya te digo todo xD
Es muy interesante plantearse el diseño así... aunque no termina de gustarme (aunque solo soy de toquetear el código, no crear cosas desde cero) :pMiguel2008 yo igual, yo programo pero rara vez diseño, así que no está dentro de mi circulo de trabajo. Cuando diseño solo adapto cosas.Silvia77 Aaah suertudos vosotros, que podeis hacerlo "en feo" y ya otro arereglará el aspecto visual. Yo me curro la programacion y el diseño (bueno, si puedo, solo la maquetacion, que diseñar, lo que se dice diseñar, se me da como el culo), aunque sea solo de las pantallas de uso. Desde hace un tiempo para clientes lo unico que hago son aplicaciones web, asi que el aspecto visual solo necesita que sea limpio y manejable, pero aun asi, requiere un "diseño" y por supuesto una maquetacion.chicoperro Yo lo hago como tú, es que además no sé cómo se hace de la otra manera, no le veo sentidoSilvia77 chicoperro escribió:Yo lo hago como tú, es que además no sé cómo se hace de la otra manera, no le veo sentido
pues la idea es plantear la disposicion de los elementos primeramente en una pantalla pequeña, una vez los tienes ahi, la vas agrandando hasta que veas que "sobra espacio" entonces puedes meter otros elementos o distribuirlos de otra forma, hacelos mas grandes... es una forma de asegurate que se va a ver bien en cualquier dispositivo y que no vas a cargar nada innecesario en las pantallas pequeñas (porque lo cargarás solo si la pantalla es mayor). Mas o menos :P
googleando por "mobile fisrt" salen muchas explicaciones mas completas que la mia (en ingles, of course. aunque alguna en español creo que tambien hay).chicoperro No si entiendo el planteamiento pero no le veo sentido, para mi es como empezar la casa por el tejado, yo lo que hago es primero la página y luego pisar los estilos necesarios para que se vea bien a cualquier resolución, no sé hacerlo de otra manera.Silvia77 Ppero es que precisamente hacer primero la version desktop es comenzar la casa por el tejado... piensa que una web diseñada para movil se va a ver bien (aunque con mucho espacio sin utilizar) y se va a poder utilizar en un ordenador de escritorio, pero una version de escritorio malamente se ve ni medio bien ni se puede muchas veces utilizar (esos eventos de raton tan chulos que cuando te los llevas al movil, wop! dejan de funcionar porque no hay raton).
Un par de ejemplo: visita desde un pc la version movil de facebook o la wikipedia (m.facebook.com o m.wikipedia.org) . Son utilizables, verdad? Ahora fuerza a utilizar la version desktop de ambas plataformas desde un movil (o incluso tablet). La expereincia de usuario es pauperrima. Es más efectivo ir de menor a mayor que de mayor a menor.chicoperro Pero, a ver... que me estás poniendo ejemplos que no valen, eso no es diseño responsive, son dos páginas pensadas y diseñadas para distintos dispositivos, y en esos casos concretos te da igual por donde empieces (en su caso por desktop que ya tienen unos cuantos añitos) porque son desarrollos distintos.
Yo lo pienso de cara a un trabajo para un cliente, que los proyectos personales cada uno se los hace como quiere, si le quieres hacer una web a un cliente lo primero que le tienes que pasar son los wireframes y el diseño para que te lo apruebe o te lo cambie, no me veo presentándole un diseño para móvil y luego si le gusta le hago el de escritorio, no tiene ningún sentido, en todo caso habría que presentarle todos los diseños pero en una primera fase es trabajar a lo tonto.
Yo lo que creo es que cuando dicen mobile first lo que quieren es que pienses en el móvil a la hora de diseñar y programar, para que luego no te encuentres con problemas, porque empezar por la versión móvil, al menos a mí, me parece muy complicado.Silvia77 te he puesto esos ejemplos porque son los que se pueden probar tanto desde movil como desde escritorio ( o sea, ver en el movil el tamaño grande y en el escritorio el tamaño pequeño), con una web responsive no vas a poder comparar porque... es responsive.
Pero vamos, que evidentemente cado auno trabaja como quiere, sabe o puede. Yo personalmente con los clientes prefiero hacer los diseños preliminares (todos, desde movil a desktop a tamaño gigante) con ellos. Y cuando es para mi, trato de seguir un workflow lo mas similar posible, asi no tengo que desprenderme de malos vicios cuando trato con clientes.tuitero Tengo 3 años desarrollando proyectos personales y desde hace 1 año empece con esta metodologia, no solo va a diseño si no inclusive a programacion y desarrollo, siguiendo el ejemplo de la casa, supongamos que en lugar de comprar la casa y meter los muebles, lo hacemos de forma contraria, primero escogemos los muebles que nos gusta, los que son necesarios y nos sirven mas y despues construimos la casa a su alrededor.
Esta corriente esta tomando mas fuerza y va o no de la mano del responsive ya que puedes hacer diseño "Full responsive" para todos que todos los elementos se adapten o "Mid-Responsive", este termino me lo acabo de inventar, que no es otra cosa que hacer los elementos al 70-80% de su tamaño solo para que se adapten de desktop a tablet y hacer una plantilla adicional para mobiles.
El metodo mobile first te ayuda a tener una idea clara y limpia de los elementos que se requieren, en lugar de cmo decia silvia "ahora donde meto esto" y lo terminamos desaparesiendo con media querys y display:none :)
Su impacto ha sido tanto que google siempre ha ayudado a los diseños menos cargados (una de las bases de esta metodoslogia) y ahora ayudara mas a los que soporten plataformas moviles, asi que la regla de 2 es sencilla con mobile first, si los sigues no tienes otra cosa mas que ganar o ganar.
*Nota Mental .-Hubiera escrito esto en tu blog personal y estuvieras ganando pasta idiota!
*Nota Mental 2.- No tienes blog personal idiota.Arroyo Según lo veo yo existe un lado romántico que te hace diseñar desktop (básicamente por que lo haces delante del monitor en tu casa-trabajo) y otro practico que debería devolverte a los años de programación cuando aprendías PHP y que deberías enfocar a una web en dimensión mobile. Sobre todo porque como diseñador web estas obligado a seguir las tendencias y estar al día. Te equivocaras mucho menos y estarás acertando si piensas en una web mobile. La tendencia desmarcará el desktop en un futuro. La gente usa mas la tablet y el móvil en casa que el pc.
Mobile first y después corregir para desktop.
Saludos a dislikeit ;)terkone la verdad que hasta ahora no.
pero viendo tu explicacion tiene toda su lógica
en el proximo proyecto lo pondre en marcha
Este hilo pertenece al archivo del foro y ya no admite respuestas.
Otros hilos de esta sección
- Diseña tu propia portada de Facebookvirtuoso · 12 jul 201414 respuestas · 27.628 visitasÚltimo mensaje: 1 mar 2017
- Fotografías gratis para tus landing pagesSauron · 29 may 201613 respuestas · 24.683 visitasÚltimo mensaje: 8 abr 2021
- COMO APLICAR TEXTURAS A PLANOS EN PHOTOSHOPdropc · 26 oct 20176 respuestas · 23.636 visitasÚltimo mensaje: 19 may 2021
- 5 páginas que te ayudarán a diseñarrikko · 16 ene 20159 respuestas · 19.262 visitasÚltimo mensaje: 22 jun 2019
- ¿Cómo recuperar fotos borradas?Azevedo34 · 2 mar 20169 respuestas · 18.572 visitasÚltimo mensaje: 13 abr 2020
- Vídeos gratis para añadir en tus diseños de sitios websSauron · 29 may 20167 respuestas · 16.225 visitasÚltimo mensaje: 21 abr 2021
- Web con cientos de recursos gratis para After EffectSauron · 4 feb 20145 respuestas · 16.000 visitasÚltimo mensaje: 27 oct 2015
- Frameworks que siguen Material DesignSauron · 17 mar 201519 respuestas · 15.881 visitasÚltimo mensaje: 26 mar 2015

