{"id":613,"date":"2023-08-24T21:10:00","date_gmt":"2023-08-25T00:10:00","guid":{"rendered":"https:\/\/www.catedracosgaya.com.ar\/tipoblog\/2023\/?p=613"},"modified":"2023-08-24T21:10:00","modified_gmt":"2023-08-25T00:10:00","slug":"nostalgia-moderna-en-interfaces-digitales","status":"publish","type":"post","link":"https:\/\/www.catedracosgaya.com.ar\/tipoblog\/2023\/nostalgia-moderna-en-interfaces-digitales\/","title":{"rendered":"Nostalgia moderna en interfaces digitales"},"content":{"rendered":"\n

Esta interfaz digital e interactiva corresponde al sitio web de un estudio creativo que combina pasado y presente en su estructura y estilo.<\/strong><\/h4>\n\n\n\n

<\/p>\n\n\n\n

La web tiene un estilo contempor\u00e1neo que puede incluirse dentro del brutalismo, el cual se caracteriza por la carencia de texturas, el uso del blanco y negro y alg\u00fan color para resaltar detalles, tipograf\u00edas grandes que llaman la atenci\u00f3n y elementos que recuerdan a los inicios de los sitios web. Esto se puede ver en el uso de una llamativa tipograf\u00eda expandida que destaca r\u00e1pidamente de lo dem\u00e1s por su cuerpo, peso y contraste de color con el fondo; tambi\u00e9n en las miscel\u00e1neas y la tipograf\u00eda monoespaciada correspondiente a los elementos de navegaci\u00f3n, la cual da un clima tecnol\u00f3gico y digital que se ve reforzado por el uso del verde vibrante para resaltar elementos. Esta monoton\u00eda se rompe \u00fanicamente con las im\u00e1genes que ilustran los proyectos, las cuales ganan protagonismo crom\u00e1tico al momento de navegar entre ellos.<\/p>\n\n\n\n

\"\"
Captura tomada del sitio web studiofreight.com<\/sub><\/figcaption><\/figure>\n\n\n\n

La interfaz se compone principalmente de tipograf\u00eda. Esta, adem\u00e1s de ser un elemento de lectura y navegaci\u00f3n, funciona estructurando la interfaz. Es acompa\u00f1ada por miscel\u00e1neas que ayudan a reforzar la grilla de la web, que se organiza en m\u00f3dulos horizontales y verticales que sectorizan la informaci\u00f3n.<\/p>\n\n\n\n

Su navegaci\u00f3n puede compararse con una lectura tradicional de formatos impresos, debido a que el recorrido es lineal hacia abajo y de izquierda a derecha y est\u00e1 dividida en columnas bien delimitadas. Sin embargo, no deja de tener bastante relevancia la interacci\u00f3n, ya que es la que permite cambiar entre proyectos y acceder a la informaci\u00f3n de los mismos.<\/p>\n\n\n\n

Esta estructuraci\u00f3n del espacio en columnas y la posibilidad de visualizar la totalidad del sitio en una sola pantalla, recuerda a los sitios web de los a\u00f1os 90 y comienzos del 2000. Los primeros, desarrollados en HTML y JavaScript, utilizaban marcos, generalmente del lado izquierdo o en la parte superior, que conten\u00edan un listado de opciones de men\u00fa que al clickearlas se abr\u00edan en otro marco que abarcaba la mayor parte de la p\u00e1gina. M\u00e1s tarde, gracias a las posibilidades del Flash (desarrollado inicialmente por Macromedia) y a la velocidad mayor de internet que permiti\u00f3 la banda ancha, comenzaron a realizarse webs completamente en Flash, que se caracterizaban principalmente por incluir todo el contenido en un peque\u00f1o espacio central, el cual, generalmente, tambi\u00e9n estaba modulado en columnas con alguna tabla de contenido interactiva que permit\u00eda explorar las distintas secciones de la web.<\/p>\n\n\n\n

\"\"
Captura del sitio web de Microsoft del 2002<\/sub><\/figcaption><\/figure>\n\n\n\n
\"\"
Captura del sitio web de Universal Pictures del 2004 en Flash <\/sub><\/figcaption><\/figure>\n\n\n\n

Con el avance de la tecnolog\u00eda, hoy en d\u00eda los sitios web cuentan con el uso de lenguajes inform\u00e1ticos m\u00e1s innovadores, como el CS3 y el HTML5, que a diferencia de los anteriores, permiten una mayor rapidez a la hora de crear los sitios y m\u00e1s dinamismo al interactuar con ellos. Por un lado, la tecnolog\u00eda del CS3 permite definir la est\u00e9tica, mientras que el HTML5 permite gestionar y estructurar los contenidos de la interfaz.<\/p>\n\n\n\n

Usualmente las webs contempor\u00e1neas dividen el contenido en diversas pantallas, generalmente de manera vertical, a las que se accede mediante un men\u00fa o haciendo scroll<\/em> con el mouse<\/em>. Esto permite adaptarlas f\u00e1cilmente a un dise\u00f1o responsive<\/em> que permite la correcta visualizaci\u00f3n en cualquier tama\u00f1o de pantalla.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n
\"\"
Capturas del sitio web scrolleable traffbraza.com<\/sub><\/figcaption><\/figure>\n\n\n\n

En el caso de la web de Studio Freight, sin embargo, a pesar de mostrar todo su contenido en una pantalla, es una p\u00e1gina web responsive<\/em> y completamente funcional en formatos de pantalla angostos como el de los celulares, debido a que su divisi\u00f3n en columnas desaparece en estas proporciones.<\/p>\n\n\n\n

En este sitio se aprovechan las capacidades actuales del CSS para mostrar la informaci\u00f3n de una forma diferente que incorpora lo actual y moderno y al mismo tiempo recupera una tipolog\u00eda pasada que utiliza para mostrar toda la informaci\u00f3n del estudio en un solo pantallazo, dejando la interacci\u00f3n \u00fanicamente para cambiar entre proyectos y otorgando a la web una identidad llamativa y \u00fanica.<\/p>\n\n\n\n

<\/p>\n\n\n\n

Bibliograf\u00eda consultada<\/h5>\n\n\n\n

<\/p>\n\n\n\n