He estado mirando las pautas de Google para esta cosa llamada "diseño de material" , y la he seguido un poco. Sin embargo, también veo muchos sitios que usan diseño plano: Twitter , Codecademy y Gitter , y esos son solo algunos. Luego están los que hacen uso de gradientes CSS3, sombras, etc. e imágenes detalladas para diseñar un sitio que se vea real (corrígeme si me equivoco, pero ¿no es esto lo que es el esceptomorfismo?), Como la página de inicio para Twitter Bootstrap 2 .
Por lo que entiendo, el diseño plano reduce la carga en el tráfico móvil.
¿Qué ventajas (en términos de velocidad / UX / etc., especialmente) ofrecen cada una sobre la otra?
website-design
css
DᴀʀᴛʜVᴀᴅᴇʀ
fuente
fuente
Respuestas:
El skeuomorfismo es realmente lo contrario del diseño plano . El "Diseño de materiales" de Google es simplemente su nombre de marca para sus interpretaciones específicas del diseño plano. Sin embargo, sigue siendo un diseño plano. "FLat Design" fue acuñado por Apple cuando lanzaron iOS7. Se dio cuenta porque era el primer término utilizado, podría haberse llamado fácilmente "Diseño de materiales" si Google lo hubiera hecho primero.
La práctica del esqueuomorfismo es agregar elementos visuales que esperaría ver si el objeto fuera físicamente real en lugar de proyectado en una pantalla. Un ejemplo sería sombras y reflejos. Existen en todo en el mundo real pero en nada en el mundo digital. Agregar estos elementos skeuomorphic está diseñado para hacer que los humanos se sientan más familiarizados con los elementos digitales.
El diseño plano es lo opuesto a esto. En el "diseño plano" no hay consideración para la física y la iluminación del "mundo real". Sin embargo, los elementos digitales están hechos, sin embargo, el diseñador desea hacerlos sin preocuparse por lo que la "realidad" le haría al elemento si el objeto fuera físico.
La página de inicio de bootstrap no es un ejemplo de esceptomorfismo. Es un ejemplo de diseño plano en general. Aunque se podría argumentar que el rectángulo insertado en el medio con el efecto de "relieve" insertado también es skeuomorphic. Entonces, quizás un "híbrido" puede ser la mejor descripción.
En términos de ventajas / desventajas técnicamente, no hay razonamientos sólidos para elegir uno sobre el otro.
A menudo, para lograr imágenes de efectos skeuomorphic creíbles de alta calidad. Las imágenes aumentarán naturalmente las solicitudes HTTP y la carga del navegador. Si renuncia a imágenes a favor de CSS skeuomorphic, el CSS puede ser extremadamente complicado y grande. Si bien disminuir las solicitudes de imágenes HTTP requeriría, el tamaño adicional (kb) de un archivo CSS con elementos skeuomorphic puede superar la reducción en las solicitudes HTTP (desde el punto de vista de los usuarios).
El diseño plano generalmente se realiza fácilmente con CSS3 básico. Si se necesita una imagen en un diseño plano, lo más probable es que se necesite la misma imagen también en un diseño skeuomorphic. Por lo tanto, se compensan entre sí en términos de ventajas / desventajas. Flat Design CSS es habitualmente menos complejo y más fácil de editar, pero no tiene por qué serlo. Es muy posible crear un diseño plano con propiedades CSS muy complejas. La mayoría de los diseños planos contienen gradientes, simplemente no gradientes del "mundo real" según lo que haría la luz si el objeto fuera real. Todos los iconos iOS7-8 o Windows 8 de Apple usan degradados. Simplemente gradientes muy sutiles en lugar de "hacer que parezca que son pendientes" pendientes.
Al final, no hay una razón difícil por la que el diseño plano pueda ser técnicamente mejor o peor que el esceptomorfismo. Todo se reduce a una cuestión de preferencia por parte del diseñador. Tanto el esceptomorfismo como el diseño plano son meras tendencias de diseño sin ninguna base en razonamiento técnico.
es similar a preguntar "¿Qué es técnicamente mejor un sitio web rojo o un sitio web azul?" - no hay otra respuesta que no sea "Lo que prefieras".
fuente