En esta descripción general, se le explicará cada tendencia y hermosos ejemplos que lo inspirarán para su próximo proyecto.
1. Diseño extraordinario
Figura 1
2. Diseño de página única
Figura 2
3. Diseño de varias columnas
Figura 3
4. Ilustraciones gigantes y gráficos vibrantes
Figura 4
5. Más espacios en blanco que antes
Figura 5
6. Elementos de diseño social
Figura 6
7. Navegación conversacional
Figura 7
8. Pestaña Dinámica
Figura 8
9. Cuadro de búsqueda grande
Figura 9
10. Agregar efectos visuales a la clasificación
Figura 10
11. Avatar del autor
Figura 11
12. Íconos y señales visuales
Figura 12
13. Índice de etiquetas (reemplazando la nube de etiquetas)
Figura 13
14. Utilice ilustraciones en blogs
Figura 14
15. Pintura de acuarela.
Figura 15
16. Escritura a mano
Figura 16
17. Retro
Figura 17
18. Utilice materiales orgánicos, ladrillos y fotografías como fondo.
Figura 18
19. Sello de marcado
Figura 19
20. Etiqueta de precio
Figura 20
21. Cinta
Figura 21
Diseño extraordinario
Como se demostró en 40 diseños innovadores: Diseño extraordinario hace unos meses, estamos observando una fuerte tendencia hacia diseños más personalizados e innovadores. En lugar de utilizar diseños tradicionales en forma de caja, los diseñadores están experimentando con nuevas formas de estructurar, presentar y expresar información.
En estos extraordinarios diseños de diseño, la creatividad general suele ser más importante y memorable que el contenido específico. Aún así, la usabilidad, la tipografía y el diseño visual rara vez se pasan por alto y se ejecutan con cuidado. El diseño innovador es especialmente popular en grandes proyectos, agencias de diseño de sitios web y sitios web promocionales (como actividades comerciales de grandes empresas), pero también es popular en blogs.
Figura 22
Cuando se trata de creatividad, la línea entre diseño utilizable e inutilizable es muy borrosa, por lo tanto, las pruebas de usabilidad son particularmente importantes, porque una nueva idea puede romper las cosas existentes en el sitio web; A menudo es una buena idea tener un equilibrio entre diseños creativos, clásicos y tradicionales, lo que significa tratar de encontrar un equilibrio entre un diseño utilizable "indestructible" (o incluso aburrido) y un diseño creativo pero inutilizable. Recuerde, las ideas necesitan tiempo para crecer: repensadas, revisadas, modificadas, refinadas y, en última instancia, integradas en su diseño.
Se recomienda encarecidamente a los diseñadores que rompan con las convenciones de los diseños de cajas tradicionales y prueben nuevos enfoques y sus propias ideas audaces y locas. ¡Muestra tus talentos!
Figura 23
Figura 24
Figura 25
Figura 26
Figura 27
Figura 28
Diseño de una sola página
Otra forma que los diseñadores suelen utilizar para impresionar a los visitantes es el llamado diseño de una sola página: este diseño utiliza una sola página para presentar el contenido del sitio web. No significa necesariamente que estos diseños sean minimalistas (siguiendo el principio de "menos es más"). Por el contrario, este tipo de diseño suele ser muy complejo, contiene imágenes ricas y efectos de animación vívidos y, por lo tanto, tarda un poco en cargarse.
Figura 32
Cuando el usuario hace clic en una opción de navegación, la página cambia (cambia parcialmente) y el nuevo contenido de http://www.knowsky.com aparece en el área donde se muestra el contenido anterior. Los efectos de navegación deslizante y desplazamiento en este diseño son compatibles con bibliotecas públicas de JavaScript.
La principal ventaja para los usuarios proviene del simple hecho de que se necesitan menos movimientos y clics del mouse para obtener la información que desean. Dado que este enfoque es tan nuevo, es una gran oportunidad para los usuarios que pueden confundirse al utilizar la navegación no tradicional. Hay algunas situaciones en las que una versión "estática" puede resultar útil o incluso ser necesaria, por ejemplo, tendrá que proporcionar otra versión para los motores de búsqueda y los usuarios que hayan desactivado JavaScript.
Figura 33
Figura 34
Figura 35
Diseño de varias columnas
Varias columnas (más de 3 columnas) no necesariamente significan un diseño complejo. Por otro lado, si se diseñan correctamente, varias columnas pueden ser muy útiles para los visitantes porque brindan una mejor descripción general de las opciones de navegación visibles, lo que permite a los usuarios encontrar rápidamente la información que buscan.
En los últimos años, hemos sido testigos de una explosión de contenido de sitios web, lo que ha reducido la atención y el tiempo que los usuarios invierten en el sitio web (consulte ReadWriteWeb para obtener más detalles). Por lo tanto, no es de extrañar que los diseñadores estén tratando de encontrar formas más concisas de presentar la información, para que los visitantes puedan permanecer en el sitio web el mayor tiempo posible y encontrar el contenido más fácilmente.
Figura 36
Una forma de lograr esto es utilizar un diseño con múltiples columnas adyacentes. Esta idea tiene mucho sentido. Las resoluciones de pantalla han aumentado en los últimos años (sin embargo, esto puede cambiar si las netbooks como la Asus Eee PC se vuelven ampliamente disponibles), brindando a los usuarios más espacio horizontal y brindando a los diseñadores espacio adicional para completar el contenido.
Los resultados muestran que cada vez más diseñadores utilizan cada vez más columnas en sus diseños. Nuestra investigación encontró una fuerte tendencia hacia los llamados diseños de múltiples columnas, típicamente con un ancho fijo de 850 píxeles en una pantalla de 1000 píxeles. A menudo se utilizan varias columnas en diseños de revistas y proyectos grandes. En estos diseños, las cuadrículas se utilizan a menudo para garantizar el equilibrio, la jerarquía y el orden estructurales.
Cuando se utiliza un diseño de varias columnas, no se puede subestimar la importancia del espacio en blanco activo y entre columnas individuales. (El espacio en blanco activo se deja intencionalmente en blanco para representar mejor la estructura de la página y enfatizar diferentes áreas de contenido).
Con este fin, los diseñadores suelen utilizar el "mantra de Shneiderman" ("Muestre el panorama general primero, muestre los detalles después"). , primero brinde al usuario una descripción general de la funcionalidad y luego proporcione detalles a pedido, más tarde, cuando se haga clic en un enlace (Mozilla Labs es un excelente ejemplo).
Figura 37
Figura 38
Figura 39
Figura 29
Figura 30
Figura 31