• Saltar a la navegación principal
  • Saltar al contenido principal

Sebastián Thüer

Comunicación, diseño y tecnología

  • Acerca
  • Blog
  • Contacto
  • Show Search
Hide Search

diseño

5 tendencias para el diseño de sitios web en 2014

Sebastián Thüer · 06.01.2014 ·

5-web-trens-2014

Adelantar tendencias  requiere información, intuición y, por supuesto, algo de suerte. En diseño web, las múltiples retrospectivas del año que pasó muestran la consolidación de algunos recursos y estilos que estarán presentes con fuerza en este año: flat design, más movimiento, nuevas herramientas y la consolidación del reinado de WordPress como gestor de contenidos.

1. Flat design

flat-design

Fue la gran apuesta en interfaz de usuario que hizo Microsoft con Windows 8. Apple lo terminó de consolidar con iOS7 ¿De qué se trata esto? Básicamente, de desarrollar un sistema visual extremadamente simple, claro y con un diseño plano que pone el foco sobre aspectos como el color, la tipografía y los botones.

Es razonable esperar que este año sigamos viendo diseños en esta dirección pero con alguna vuelta de tuerca que le de algo de originalidad  como long shadow para realzar objetos o parallax scroll para agregar profundidad de campo. En todo caso, se trata de efectos y recursos refinados, sutiles y perfectamente integrados al conjunto del diseño.

2. Más movimiento

animation

El movimiento ha vuelto a la web. Sepultados los viejos GIFs animados que tanto dolores de cabeza provocaron ahora la tecnología está lo suficientemente madura como para ofrecer una animación más sofisticada, suave y controlada por parte del diseñador. El video, las transiciones, los gráficos en SVG y la extensión del CSS3 para las animaciones harán que veamos muchos sitios que hagan uso del movimiento para mostrar información.

Los iconos que giran sin sentido o palabras voladoras siguen estando totalmente vedadas. El movimiento se constituirá en un elemento perfectamente integrado al diseño visual para poner énfasis y proporcionar información útil.

3. Nuevas herramientas para el diseño web

macow

Hubo un tiempo en que bastaba instalarse Dreamweaver y Flash para tener a mano el mejor software disponible para el diseño web. Sin embargo, la evolución de estas herramientas ha sido bastante lenta en comparación con la cantidad de tecnologías y recursos que están disponibles hoy. No hay duda que el mundo del diseño web se ha ido complejizando y están emergiendo un conjunto de nuevas herramientas para ayudar a los diseñadores a estar al día. Sketch, Typecast, Codiqa o Macaw son algunas de ellas y veremos si logran despegar para alcanzar una amplia base de usuarios.

Adobe, por su parte, no se quedará de brazos cruzado. Su paquete Adobe Edge intenta llegar a algunos nichos determinados como las animaciones, el diseño responsivo para diferentes dispositivos, el testeo de sitios y la escritura de código, entre otros.

4. WordPress seguirá reinando

cms-trends

Miremos el gráfico de arriba y la conclusión es sencilla: el CMS más popular hoy en día es WordPress. Y en el 2014 también. Sus rivales tradicionales están declinando a pesar de que se trata de herramientas excelentes. Drupal tiene una curva de aprendizaje ardua y Joomla no logró sostener el nivel de penetración que tuvo años atrás.

Sin embargo, se están desarrollando algunos gestores de contenidos muchos más pequeños, sencillos y ágiles dirigidos a nichos específicos: blogs, sitios institucionales, tableros gráficos al estilo Pinterest, por ejemplo. No podrán en riesgo el reinado de WordPress, pero se presentarán como alternativas interesantes para usuarios que buscan productos sencillos y enfocados a una actividad concreta.

5. Personalidad

personality

Después de navegar mucho por la web, usar diferentes sistemas, plataformas y entornos son muy pocas aquellas interfaces que recordamos. En general, las interfaces de usuario buscan tan ser sencillas y fáciles de usar que evitan al máximo cualquier elemento que pueda provocar fricción en la interacción con el usuario. Así, terminan por pasar delante nuestro sin pena ni gloria.

Por ello algunos diseñadores han comenzando a incorporar algunos pequeños elementos distintivos para dotar de cierta distinción a la interfaz: colores, tipografía o alguna pequeña innovación en la disposición de los elementos son suficientes para sobresalir sin plantear un diseño revolucionario que ponga los pelos de punta a los jefes de desarrollo.

Tendencias en diseño visual para 2014 [infografía]

Sebastián Thüer · 13.12.2013 ·

No más mujeres perfectas ni fotografías retocadas hasta el detalle. La tendencia en imágenes para el próximo año es clara: imágenes reales. Mujeres reales y no modelos. Hombres retratados en su vida cotidiana. Imágenes con componentes étnicos para mostrar la diversidad global. Vectores que muestran las imperfecciones del dibujo a mano. Fotos con reflejos en el lente que ya no es un error técnico sino opera como una marca de autenticidad.

Esta es la infografía que el sitio iStock ha elaborado donde proyecta cuáles serán las tendencias en imagen y diseño visual para el 2014, un clásico a medida que avanza diciembre.

Tendencias en diseño visual para el 2014

Vía iStock

Recreando iOS 7 en Word y un viejo debate: diseño, ¿arte o ciencia?

Sebastián Thüer · 23.10.2013 ·

El video del diseñador Vaclav Krejci es increíble: recrea la interfaz de iOS 7, el nuevo sistema operativo para iPad y iPhone de Apple, usando Word. Y para que no queden dudas, ofrece en su página web el archivo docx para descargar.

Lo interesante de Vaclav no es solo su maestría para emplear herramientas cotidianas para producir diseños complejos, como este caso, sino su visión sobre el diseño:

Creo que el diseño gráfico es una ciencia, al igual que, por ejemplo, las matemáticas, los principios y normas a seguir definidas. Y al igual que cualquier otra cosa, se puede enseñar y aprender.

Más que un acto creativo, que sin duda lo es, el diseño es fruto de la información, del conocimiento y de la voluntad.  «La creatividad está sobrevalorada», dice Vaclav y agrega que se pueden hacer buenos diseños sin pasar por una escuela de arte o utilizar software caro. Su desafío es mostrar que es posible crear documentos de aspecto agradable con herramientas bastante limitadas -como es el caso de Word para el diseño- si tenemos en claro qué queremos y sabemos utilizar el software en nuestro provecho.

Para lo que quieran seguir su camino, Vaclav ofrece un libro (disponible en Issuu) donde nos muestra 7 efectos de texto bastante clásicos recreados todos con el software de oficina de Microsoft.

Branding disaster: El nuevo logo de Yahoo!

Sebastián Thüer · 05.09.2013 ·

yahoo

La cuenta regresiva llegó a su fin. Yahoo se presentó su nuevo logo y muchos ya hablan de un branding disaster. Y no es para menos.

Desde hace 30 días Yahoo venía presentando diferentes versiones de su logo, algunas de las cuales estuve viendo y me parecieron trabajos bastante amateurs. Pero como duraban poco, no pasaba nada. Ahora, que nos presentan la versión final el nuevo logo de Yahoo parece un viaje en el tiempo… 10 años atrás.

Cuando el minimalismo ha dejado de ser una moda para convertirse en una necesidad de las interfaces que apuntan a la máxima simplificidad. Una vez que Microsoft innova y apuesta por el flat design para dejar atrás sombras, degradados y efectos de luces Yahoo nos devuelve una imagen propia de fines de los ’90 con un intento por dale un toque de formalidad a su logo sin perder frescura.

Para empezar, las letras de Yahoo! están basadas en Optima, una tipgorafía humanística paloseco o sin serif que puede funcionar muy bien para un estudio de arquitectos o abogados, pero que en manos de una marca que quiere transmitir frescura, desenfado y que termina con un signo de exlamación queda un poco raro.

Además, si miramos el video veremos una especie de inspiración matemática para equilibrar las líneas del diseño. Un interesante pasatiempo para un ingeniero pero algo totalmente alejado de la práctica profesional del diseño. Es más, a simple vista el logotipo luce desequilibrado y no quedan rastros de las provocativas diagonales del diseño anterior.

Hace un tiempo Yahoo a comenzando un proceso de rediseño de algunas de sus páginas e interfaces donde se aprecia una preocupación por simplificar la lectura, despojar sus pantallas de elementos innecesarios y apostar por fotografías en gran tamaño para transmitir emociones y capturar la atención. El flamante logotipo va en dirección contraria y parece más el resultado de un capricho que el de un proceso de diseño. Moraleja: En diseño, a veces contratar profesionales externos que no tengan que quedar bien con su jefe es una buena idea.

Diseños web innovadores

Sebastián Thüer · 29.08.2013 ·

Un encabezado con logo y menú, un slide con una imagen bien grande, algunas columnas con información y el pie de página. Muchas veces parece que en diseño web no hay nada nuevo bajo el sol. Que todo se reduce a la misma grilla de siempre.

Original And Innovative Web Layouts es una interesante galería que recorre algunos diseños web que quiebran con este estándar y buscan soluciones originales para el mismo problema de siempre: crear sitios bonitos y fáciles de usar.

Abby Putinski

Abby-Putinski_tiny

Hackery, Maths & Design

Acko_tiny

Adam Hartwig

Adam-Hartwig_tiny

Amsterdam Dance Event

Amsterdam-Dance-Event_tiny

Anderw McCarthy

Anderw-McCarthy_tiny

Award

Award_tiny

Baumbastisch

Baumbastisch_tiny

Beurre & Sel

BeurreSel_tiny

Institut Choiseul

Choiseul_tiny

Contad

Contad_tiny

Cropp

Cropp_tiny

Designer’s Friend

Derigners-Friend_tiny

Impress

Do-You-Impress_tiny

Edward Carvalho Monaghan

Edward-Carvalho-Monaghan_tiny

Institute for Emerging Issues

Emmerging-Issues-Commons_tiny

Ende

Ende_tiny

Esquire

Esquire-1_tiny

Harry’s

Harrys_tiny

Hatched

hatched_tiny1

Huys

Huys_tiny

Into The Arctic

Into-The-Arctic_tiny

John Jacob

John-Jacob_tiny

Juliana Bicycles

Juliana-Bicycles-1_tiny

KathArt

KathArt_tiny

Lucas Nikitczuk

LucasNikitczuk_tiny

Mikael Edwards

Mikael_tiny

National Academy Museum

National-Academy_tiny (1)

National LGBT Museum

National-LGBT-Museum_tiny

Neue Yorke

Neue-Yorke_tiny

Newsweek

Newsweek_tiny

Norwich University of the Arts

Norwich-Univeristy-Of-The-Arts_tiny

Paper & Paint

Paper-and-Paint_tiny

Postable

Postable_tiny

The Drawing Room

The-Drawing-Room_tiny

Trask Industries

Trask-Industires_tiny

Wacom

Wacom_tiny

We Love Noise

We-Love-Noise_tiny

World Baking Day

World-Baking-Day_tiny

  • « Ir a la página anterior
  • Página 1
  • Página 2
  • Página 3
  • Página 4
  • Páginas intermedias omitidas …
  • Página 19
  • Ir a la página siguiente »

Sebastián Thüer

Creative Commons Atribución 4.0 Internacional © 2025 · Less Is More · Acceder