<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head><meta name="viewport" content="width=device-width,initial-scale=1.0" /><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Concreta Capacitación</title>
</head>
<body bgcolor="#FFFFFF" style="cursor: auto;margin: 0 auto;padding: 0;-webkit-font-smoothing: antialiased;-webkit-text-size-adjust: none;height: 100%;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif; line-height: 1.65; "><!-- HEADER --><!--header-->
<table style="margin:0 auto" width="100%">
<tbody>
<tr>
<td> </td>
<td align="left" style="border-bottom: solid #FFA73B 1px;" width="600"><img alt="Concreta Capacitación" height="64" src="http://concreta.uy/image/pepe.jpg?id=2b1a4648e484a0cfb9afda7b01e7aaa2" /><a href="http://concreta.uy/cursos-en-linea/?utm_source=elastic&utm_medium=mailing&utm_campaign=PSUX20210120&utm_content=La falacia de la Guía de Estilos" style="color: #2BA6CB;"> </a></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td align="center" style="padding:10px;" width="600">Teoría y aplicación práctica de la Accesiblidad, basado en WCAG 2.1<br />
<strong><a href="https://concreta.uy/curso-accesibilidad-herramientas-de-evaluacion-wcag-2-2/?utm_source=elastic&utm_medium=mailing&utm_campaign=ACEV20211027&utm_content=La falacia de la Guía de Estilos">Curso de Accesibilidad: Herramientas de evaluación WCAG 2.1</a></strong><br />
Próximo comienzo: <strong>27 de octubre </strong>- <span style="font-size: 16px; margin-top: 24px"><a href="https://concreta.uy/curso-accesibilidad-herramientas-de-evaluacion-wcag-2-2/?utm_source=elastic&utm_medium=mailing&utm_campaign=ACEV20211027&utm_content=La falacia de la Guía de Estilos#wpcf7-f1248-p4164-o1">Hablá con un docente</a></span></td>
<td> </td>
</tr>
</tbody>
</table>
<!--contendio-->
<p style="margin-bottom: 10px;font-weight: normal;font-size: 18px;line-height: 0.2;"> </p>
<table style="margin:0 auto" width="100%">
<tbody>
<tr>
<td> </td>
<td align="left" width="600"><div class="newsletters_content"><br />
<h1 class="Landing-title" style="font-size: 36px;margin-top: .25rem;margin-bottom: .25em;line-height: 1.15;letter-spacing: -1px;font-weight: 500;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;text-transform: none;text-align: center">La falacia de la Guía de Estilos</h1>
<p class="Landing-description" style="font-size: 20px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 1.5rem;line-height: 1.5;font-weight: 400;color: #333;text-align: center">La Guía de Estilos, concebida como un manual de imagen corporativa pero para la Web, tiene en muchos ámbitos, sobre todo informáticos, un valor casi de fetiche que resolverá todos los problemas de interacción.</p>
<p><a href="https://concreta.uy/biblioteca/la-falacia-de-la-guia-de-estilos/?utm_source=elastic&utm_medium=mailing&utm_campaign=ACEV20211027&utm_content=La falacia de la Guía de Estilos"><img src="https://concreta.uy/wp-content/uploads/evolucion-del-logo-de-coca-cola600.png" alt="Evolución del logo de Coca Cola" style="margin-top: 0.7rem;margin-bottom: 0.7rem;border: 0;width: 100%"></a></p>
<p style="font-size: 20px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px">En muchas oportunidades hemos escuchado una frase por el estilo de ésta: “… entonces la gente de Concreta nos da la Guía de Estilos, y ahí sabemos si los botones van a la derecha o a la izquierda, cómo son las opciones del menú, el tipo de letra y todas esas cosas, y con eso ya nos manejamos para hacer todas las pantallas”. Esta forma de pensamiento mágico que reduce el Diseño de la Interacción a un conjunto de reglas de tamaño, color, tipografía y ubicación, es más común de lo que debería. En nuestra experiencia, es el primer intento de mejora de los equipos informáticos después de darse algún porrazo con una interfaz.</p>
<p style="font-size: 20px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px">Hay un problema de fondo en los conceptos: se traslada mecánicamente el paradigma del ubicuo manual de marca utilizado en marketing, sin percibir que el corazón del problema no es la presentación sino la interacción, y de esta una guía de estilos clásica no dice absolutamente una palabra.</p>
<p><img src="https://concreta.uy/wp-content/uploads/llamadas-en-un-samsung-S4-antes-de-material-design600.png" alt="Llamadas en samsung S4 antes de material design" style="margin-top: 0.7rem;margin-bottom: 0.7rem;border: 0;width: 100%"> </p>
<p class="has-small-font-size has-text-align-center" style="font-size: 16px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px;text-align: center">Llamadas recientes, contactos y favoritos en el Samsung Galaxy S4</p>
<p><img src="https://concreta.uy/wp-content/uploads/registro-en-samsung-S4-despues-de-material-design600.png" alt="Llamadas en samsung S4 después de material design" style="margin-top: 0.7rem;margin-bottom: 0.7rem;border: 0;width: 100%"> </p>
<p class="has-small-font-size has-text-align-center" style="font-size: 16px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px;text-align: center">Los mismos componentes, después de la aplicación de Material Design</p>
<p style="font-size: 20px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px">El ejemplo tomado del Samsung Galaxy S4, un celular que la prensa especializada solía llamar “iPhone killer”, muestra cómo una guía de estilos es insuficiente para el Diseño de Interacciones. Ambas imágenes, antes y después de Material Design, son estilísticamente perfectas pero interactivamente muy pobres, ya que cada uno de los componentes tiene un comportamiento distinto: </p>
<ul>
<li style="font-size: 20px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px">El de arriba soporta swipe a la izquierda para llamar, a la derecha para SMS y click para más información. </li>
<li style="font-size: 20px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px">El del medio llama o manda SMS con click.</li>
<li style="font-size: 20px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px">El tercero abre un diálogo con click, desde el que nuevamente con click se llama. </li>
</ul>
<p style="font-size: 20px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px">Estas acciones se conservan intactas a pesar del cambio de estilo. Vale aclarar que toda la responsabilidad es de los diseñadores de Samsung, que utilizaron Material Design como una mera guía de estilos.</p>
<h2 style="font-size: 30px;margin-top: 1.625em;margin-bottom: .25em;line-height: 1.25;font-weight: 500;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif"><em><a href="https://es.wikipedia.org/wiki/Cum_hoc_ergo_propter_hoc">Cum hoc ergo propter hoc</a></em></h2>
<p style="font-size: 20px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px">Cum hoc ergo propter hoc (en latín «con esto, por tanto a causa de esto») es el nombre que lleva la falacia de confundir correlación (que dos eventos suceden juntos) con causalidad (que uno causa el otro). Y es precisamente la explicación de la falacia de las guías de estilo.</p>
<p style="font-size: 20px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px">Las interfaces de gran calidad tienen siempre un estilo de presentación cuidado y consistente. Sin embargo el hecho de que se den juntos (correlación) no implica que el cuidado del estilo de presentación producirá per se interfaces de calidad (causalidad).</p>
<p style="font-size: 20px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px">Es la falta de experiencia, y sobre todo la incapacidad de captar en toda su dimensión que el problema central es ese intangible tan elusivo que representa el ir y venir de un usuario con la interfaz, lo que hace tentadora la falacia. Si en vez del culto latín prefieren el dicho criollo, pues vale que «aunque la mona se vista de seda, mona queda».</p>
<h2 style="font-size: 30px;margin-top: 1.625em;margin-bottom: .25em;line-height: 1.25;font-weight: 500;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif">Guías para la interacción</h2>
<p style="font-size: 20px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px">Para el Diseño de la Interacción existen herramientas específicas en esta categoría que caen bajo el paraguas de la idea de <strong>sistema de diseño</strong>. La que nos parece más sofisticada y potente es la de <a href="https://concreta.uy/biblioteca/el-lenguaje-de-interaccion/?utm_source=elastic&utm_medium=mailing&utm_campaign=ACEV20211027&utm_content=La falacia de la Guía de Estilos"><strong>Lenguaje de Interacción</strong>.</a> Vale aclarar que el problema no es la discusión de términos, y si el cliente llama Guía de Estilos a nuestra propuesta, eso no va a generar ningún inconveniente, mientras los conceptos estén en orden.</p>
<p style="font-size: 20px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px">Un Lenguaje de Interacción especifica cómo construir una interfaz desde sus componentes elementales, incluyendo la representación en la pantalla, el comportamiento y la relación con el resto de los componentes. Define una forma de expresar la interacción desde la pantalla y su aplicación genera una interfaz coherente y consistente. </p>
<p style="font-size: 20px;font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin-bottom: 20px">La definición de un Lenguaje de Interacción o cualquier otra forma de sistema de diseño es un gran paso, porque nutre al equipo de diseño de la materia prima imprescindible para diseñar interfaces consistentes. Pero lejos está de resolver completamente el problema: aún falta la investigación dedicada y la iteración en bocetos, maquetas y diseños para depurar cada uno de los detalles, hasta llegar a una gran interfaz.</p>
</div></td>
<td> </td>
</tr>
</tbody>
</table>
<!--inscripcion-->
<p style="margin-bottom: 10px;font-weight: normal;font-size: 18px;line-height: 1.6;"> </p>
<table style="margin:0 auto" width="100%">
<tbody>
<tr>
<td> </td>
<td align="left" width="600">
<table align="left" class="column" style="background-color: #ebebeb; float: left;min-width: 279px;">
<tbody>
<tr>
<td style="padding: 15px;"><small><strong><span style="background: #FFA500; padding: 5px 10px;">Nuevo!!!</span></strong></small>
<h3 style="font-family: Montserrat,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height: 1.1;margin-bottom: 8px;margin-top: 18px;color: #000;font-weight: 400;font-size: 27px;"><a href="https://concreta.uy/curso-accesibilidad-herramientas-de-evaluacion-wcag-2-2/?utm_source=elastic&utm_medium=mailing&utm_campaign=ACEV20211027&utm_content=La falacia de la Guía de Estilos">Curso de accesibilidad: Herramientas de evaluación WCAG 2.1</a></h3>
<p style="margin-bottom: 8px;font-weight: normal;font-size: 18px;line-height: 1.6;">Un curso que te permitirá comprender qué es la Accesibilidad, conocer las <a href="https://www.w3.org/TR/WCAG22/">WCAG 2.1, publicadas por la W3C</a> que son el estándar internacional de accesibilidad y conocer herramientas para aplicarlas y evaluarlas.</p>
<p style="margin-bottom: 20px;font-weight: normal;font-size: 18px;line-height: 1.6;">Próximo comienzo <strong>27 de octubre </strong>- Cupos limitados</p>
<p style="margin-bottom: 20px;font-weight: normal;font-size: 18px;line-height: 1.6;">(Ahora pagos en pesos argentinos para Argentina)</p>
</td>
</tr>
</tbody>
</table>
<table cellpadding="10" cellspacing="20" style="background-color: #ebebeb; width: 100%;">
<tbody>
<tr>
<td align="center" bgcolor="#1947a1" height="27" style="padding:10px; -webkit-border-radius: 27px; -moz-border-radius: 27px; border-radius: 27px; color: #1947a1; display: block;" width="250"><a class="concreta" href="https://concreta.uy/curso-accesibilidad-herramientas-de-evaluacion-wcag-2-2/?utm_source=elastic&utm_medium=mailing&utm_campaign=ACEV20211027&utm_content=La falacia de la Guía de Estilos" style="color: #FFFFFF;font-size: 18px;font-weight: bold;font-family: sans-serif;text-decoration: none;line-height: 27px;width: 100%;display: inline-block;background-color: #1947a1!important;">Ver programa y detalles </a></td>
</tr>
</tbody>
</table>
</td>
<td> </td>
</tr>
</tbody>
</table>
<!--desuscribirse-->
<p style="margin-bottom: 10px;font-weight: normal;font-size: 18px;line-height: 1.6;"> </p>
<table style="margin:0 auto" width="100%">
<tbody>
<tr>
<td> </td>
<td align="center" width="600">
<p style="margin-bottom: 10px;font-weight: normal;font-size: 14px;line-height: 1.25;"><a href="http://tracking.concreta.uy/tracking/unsubscribe?d=NqHgUOp43jDybPpR5zsF1rz03-x7EsgkU-j_IEOoiNOjB8AisqIkH74GXSLabNRIcykSwTw89zmgXN1PBevjy_eMGlaUuVwn2UBt_b_IsRmdZayYuTfTbUl85X0D-rixJWfbMSmy8VY0imdac4hR0pm8QrW_XpF2eGTNsauZwl5AJqqBRuZD9jvt9NEDCnkJgeDm1fza6d_JYm3mFFmZT-jmIyPlg7bKBxY3sUJRWKOJRsMmI315BxwIC-ybDQWuobIGF10xSCOPtsXlp3HeDFN5ifPq-pN1jUxkmAepDWmNJDcW2Ihui5PNSy-GeZg8BV9V9-Nd-Px3BLUL6EHf1FM4aUbAbTkyidGgOSJwOTwjhc5OUtz59WdeTtr7uOroNw2" style="color:#666666;">No quiero recibir información sobre cursos de Concreta<br />
<img alt="" src="https://www.google-analytics.com/collect?v=1&tid=UA-88473526-1&cid=698082699.1434679781&t=event&ec=ElasticEmail&ea=La+falacia+de+la+Gu%C3%ADa+de+Estilos&el=698082699.1434050727&cs=newsletter&cm=email&cn=062413&cm1=1" style="width: 1px; height: 1px;" /></a></p>
</td>
<td> </td>
</tr>
</tbody>
</table>
<p style="margin-bottom: 10px;font-weight: normal;font-size: 18px;line-height: 1.6;"> </p>
<div style="text-align:center; background-color:#fff;padding-top:10px;padding-bottom:10px;font-size:8pt;font-family:sans-serif;"><p style="text-align:center;text-decoration:none;color:#666;">Concreta, Soriano 903 of 501, Montevideo, Montevideo, 11100, Uruguay, concreta.com.uy</p></div></body>
</html>