{"id":4712,"date":"2021-01-29T11:26:54","date_gmt":"2021-01-29T16:26:54","guid":{"rendered":"https:\/\/www.certus.edu.pe\/blog\/?p=4712"},"modified":"2021-09-23T13:30:40","modified_gmt":"2021-09-23T18:30:40","slug":"estilos-grafico-diseno","status":"publish","type":"post","link":"https:\/\/www.certus.edu.pe\/blog\/estilos-grafico-diseno\/","title":{"rendered":"Descubre los estilos gr\u00e1ficos m\u00e1s usados en dise\u00f1o"},"content":{"rendered":"<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Si deseas seguir la <\/span><a href=\"https:\/\/www.certus.edu.pe\/carrera\/diseno-grafico\/\"><span style=\"font-weight: 400;\">carrera de dise\u00f1o gr\u00e1fico<\/span><\/a><span style=\"font-weight: 400;\">, debes planearlo todo con un poco de anticipaci\u00f3n. La verdad es que nos encontramos en la era digital en la que la innovaci\u00f3n tecnol\u00f3gica cambia constantemente el panorama de esta profesi\u00f3n. Muchos de los efectos, estilos y t\u00e9cnicas que se han usado en los \u00faltimos 5 a\u00f1os han sido reemplazados por alternativas m\u00e1s modernas.<\/span><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Entonces, a fin de mantenerte delante de la competencia necesitas identificar y dominar los <strong>estilos gr\u00e1ficos<\/strong><\/span><span style=\"font-weight: 400;\"> que son relevantes ahora y se proyectan a seguir si\u00e9ndolo en el futuro inmediato. En el siguiente art\u00edculo te mostraremos los m\u00e1s importantes. Aseg\u00farate de conocerlos y dominarlos.<\/span><\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_69_1 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Tabla de Contenidos:<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-69f8743ff0fb8\" class=\"ez-toc-cssicon-toggle-label\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-69f8743ff0fb8\"  aria-label=\"Toggle\" \/><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.certus.edu.pe\/blog\/estilos-grafico-diseno\/#1-Doble-exposicion\" title=\"1.- Doble exposici\u00f3n\">1.- Doble exposici\u00f3n<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.certus.edu.pe\/blog\/estilos-grafico-diseno\/#2-Efecto-hover\" title=\"2.- Efecto hover\">2.- Efecto hover<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.certus.edu.pe\/blog\/estilos-grafico-diseno\/#3-Fondo-desenfocado\" title=\"3.- Fondo desenfocado\">3.- Fondo desenfocado<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.certus.edu.pe\/blog\/estilos-grafico-diseno\/#4-Duplex\" title=\"4.- D\u00faplex\">4.- D\u00faplex<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.certus.edu.pe\/blog\/estilos-grafico-diseno\/#5-Estilo-vintage-y-retro\" title=\"5.- Estilo vintage y retro\">5.- Estilo vintage y retro<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.certus.edu.pe\/blog\/estilos-grafico-diseno\/#6-Animacion-y-desplazamiento\" title=\"6.- Animaci\u00f3n y desplazamiento\">6.- Animaci\u00f3n y desplazamiento<\/a><\/li><\/ul><\/nav><\/div>\n<h2 style=\"text-align: justify;\"><span class=\"ez-toc-section\" id=\"1-Doble-exposicion\"><\/span><span style=\"font-weight: 400;\">1.- Doble exposici\u00f3n<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Esta es un t\u00e9cnica muy utilizada en fotograf\u00eda, cinematograf\u00eda y dise\u00f1o gr\u00e1fico. B\u00e1sicamente, consiste en unir de forma fluida dos im\u00e1genes diferentes obteniendo un resultado muy interesante. Aquello se lleva a cabo por medio de la superposici\u00f3n de dos o m\u00e1s exposiciones.<\/span><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Si bien los elementos que se toman para superponer y combinar pueden ser todos los que dicte tu imaginaci\u00f3n, lo m\u00e1s com\u00fan es utilizar im\u00e1genes de personas junto con paisajes naturales para obtener un efecto minimalista.<\/span><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">En general, la doble exposici\u00f3n es uno de los m\u00e1s inusuales y populares <\/span><strong>estilos de dise\u00f1o gr\u00e1fico<\/strong><span style=\"font-weight: 400;\">. Es probable que ya hayas visto los resultados de la doble exposici\u00f3n en muchas fotos de revistas, publicidad y cubiertas de m\u00fasica.<\/span><\/p>\n<h2 style=\"text-align: justify;\"><span class=\"ez-toc-section\" id=\"2-Efecto-hover\"><\/span><span style=\"font-weight: 400;\">2.- Efecto hover<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-4787\" src=\"https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/01\/efecto-hover.jpg\" alt=\"efecto hover\" width=\"720\" height=\"340\" srcset=\"https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/01\/efecto-hover.jpg 720w, https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/01\/efecto-hover-300x142.jpg 300w, https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/01\/efecto-hover-600x283.jpg 600w, https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/01\/efecto-hover-20x9.jpg 20w\" sizes=\"(max-width: 720px) 100vw, 720px\" \/><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Este es uno de los <\/span><strong>efectos de dise\u00f1o gr\u00e1fico<\/strong><span style=\"font-weight: 400;\"> m\u00e1s interesantes que podr\u00edas aplicar en una p\u00e1gina web. Permite que el cursor del p\u00fablico interact\u00fae de forma especial con ciertos elementos de una web. Como resultado, tales componentes pueden cambiar su estilo o su color.<\/span><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Estos efectos suelen aplicarse a puntos espec\u00edficos de la p\u00e1gina como botones o segmentos. Por ejemplo, un cursor podr\u00eda tomar la forma de una peque\u00f1a mano al desplazarlo sobre el bot\u00f3n de contacto de una web. De igual forma, un enlace puede ser subrayado o cambiar de color al posar el mouse sobre este.<\/span><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Ahora bien, es importante tener en mente que este efecto debe ser utilizado con sutileza. Un exceso de elementos que cambian apenas se mueve el cursor puede ser irritante para el p\u00fablico. Intenta usarlo solo sobre los elementos m\u00e1s importantes de la p\u00e1gina.<\/span><\/p>\n<h2 style=\"text-align: justify;\"><span class=\"ez-toc-section\" id=\"3-Fondo-desenfocado\"><\/span><span style=\"font-weight: 400;\">3.- Fondo desenfocado<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Las fotograf\u00edas que tienen un fondo desenfocado poseen una apariencia m\u00e1s art\u00edstica y profesional. El mismo principio se aplica en el dise\u00f1o web. \u00bfCu\u00e1l es su ventaja? Bien, debes saber que aproximadamente, el 60% de las p\u00e1ginas est\u00e1n saturadas de informaci\u00f3n.<\/span><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Si visitas sitios web modernos, notar\u00e1s que la mayor\u00eda de estos hacen uso de im\u00e1genes llamativas, fuentes vistosas, y otros elementos que buscan llamar la atenci\u00f3n. Como resultado, al visitar la p\u00e1gina, el p\u00fablico se enfoca en tales detalles y pasa por alto el producto o las ofertas.<\/span><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Hacer uso del fondo desenfocado permite que el p\u00fablico se enfoque en los elementos m\u00e1s importantes de tu web (descripciones de productos, sus caracter\u00edsticas, ofertas especiales, etc.). Adem\u00e1s, este efecto a\u00f1ade un toque de calidez y cercan\u00eda al sitio.<\/span><\/p>\n<p style=\"text-align: justify;\"><strong>Te puede interesar:<\/strong> <a href=\"https:\/\/www.certus.edu.pe\/blog\/perfil-disenador-grafico\/\"><span style=\"font-weight: 400;\">\u00bfCu\u00e1l es el perfil de un dise\u00f1ador gr\u00e1fico?<\/span><\/a><\/p>\n<h2 style=\"text-align: justify;\"><span class=\"ez-toc-section\" id=\"4-Duplex\"><\/span><span style=\"font-weight: 400;\">4.- D\u00faplex<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Se trata de un <strong>efecto<\/strong> <\/span><strong>de dise\u00f1o<\/strong><span style=\"font-weight: 400;\"> que consiste en utilizar dos colores y sus medios tonos sobre una imagen. A pesar de que crear este efecto es super r\u00e1pido y sencillo, con la selecci\u00f3n de los colores adecuados, puede ser bastante llamativo.<\/span><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Este efecto es muy \u00fatil cuando se tiene que hacer rebranding en un periodo de tiempo corto y, al mismo tiempo, no se afecta todo el concepto y estructura del elemento. Con un cambio tan peque\u00f1o puedes actualizar toda una web.<\/span><\/p>\n<h2 style=\"text-align: justify;\"><span class=\"ez-toc-section\" id=\"5-Estilo-vintage-y-retro\"><\/span><span style=\"font-weight: 400;\">5.- Estilo vintage y retro<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-4788\" src=\"https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/01\/estilo-retro.jpg\" alt=\"web estilo retro\" width=\"720\" height=\"340\" srcset=\"https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/01\/estilo-retro.jpg 720w, https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/01\/estilo-retro-300x142.jpg 300w, https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/01\/estilo-retro-600x283.jpg 600w, https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/01\/estilo-retro-20x9.jpg 20w\" sizes=\"(max-width: 720px) 100vw, 720px\" \/><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Actualmente, el dise\u00f1o web que transmite un estilo vintage es muy popular. La mejor parte es que puede cambiar temporalmente la apariencia de una marca durante una campa\u00f1a determinada. No te preocupes que, de realizarlo de forma correcta, se mantiene en todo momento la identidad de la empresa.<\/span><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Adem\u00e1s, el estilo retro no es uno unificado, sino que abarca diferentes per\u00edodos. Tienes la posibilidad de elegir entre diferentes d\u00e9cadas desde los a\u00f1os 20s (con paletas de color monocrom\u00e1ticas y en sepia) hasta los 80s (con colores saturados y tonos ne\u00f3n).<\/span><\/p>\n<h2 style=\"text-align: justify;\"><span class=\"ez-toc-section\" id=\"6-Animacion-y-desplazamiento\"><\/span><span style=\"font-weight: 400;\">6.- Animaci\u00f3n y desplazamiento<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">La verdadera tendencia de los \u00faltimos consiste en crear layouts con desplazamientos largos y secciones divididas. No se trata de la disposici\u00f3n de una sola p\u00e1gina, sino de contenido dividido en diferentes partes. Tales sitios hacen uso de muchas animaciones que aparecen durante el desplazamiento, lo cual hace m\u00e1s atractiva la <\/span><a href=\"https:\/\/www.certus.edu.pe\/blog\/que-es-ux\/\"><span style=\"font-weight: 400;\">experiencia de usuario<\/span><\/a><span style=\"font-weight: 400;\">.<\/span><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Ahora bien, debes tener en mente que el prop\u00f3sito de cualquier elemento din\u00e1mico es mejorar la usabilidad de la web. Entonces, aqu\u00ed tambi\u00e9n es recomendable hacer uso de esta t\u00e9cnica a fin de atraer al p\u00fablico hacia puntos como llamadas a la acci\u00f3n, suscripci\u00f3n, formularios y ofertas.<\/span><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Los dise\u00f1adores hoy en d\u00eda deben ser profesionales flexibles y polifac\u00e9ticos que puedan desempe\u00f1arse de forma efectiva en diferentes campos y, para ello, es imprescindible dominar la mayor cantidad de t\u00e9cnicas efectos y estilos posible.<\/span><\/p>\n<p style=\"text-align: center;\"><strong><i>Si deseas saber m\u00e1s, d\u00e9janos tus datos y nuestros asesores personalizados se contactar\u00e1n contigo.<\/i><\/strong><\/p>\n<p style=\"text-align: center;\"><a href=\"https:\/\/www.certus.edu.pe\/carrera\/diseno-grafico\/\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-4939\" src=\"https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/02\/banner-2021-dise\u00f1o-grafico.jpg\" alt=\"\" width=\"720\" height=\"220\" srcset=\"https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/02\/banner-2021-dise\u00f1o-grafico.jpg 720w, https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/02\/banner-2021-dise\u00f1o-grafico-300x92.jpg 300w, https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/02\/banner-2021-dise\u00f1o-grafico-600x183.jpg 600w, https:\/\/www.certus.edu.pe\/blog\/wp-content\/uploads\/2021\/02\/banner-2021-dise\u00f1o-grafico-20x6.jpg 20w\" sizes=\"(max-width: 720px) 100vw, 720px\" \/><\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Si deseas seguir la carrera de dise\u00f1o gr\u00e1fico, debes planearlo todo con un poco de anticipaci\u00f3n. La verdad es que nos encontramos en la era digital en la que la innovaci\u00f3n tecnol\u00f3gica cambia constantemente el [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":4786,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"rank_math_lock_modified_date":false,"footnotes":""},"categories":[432],"tags":[424],"class_list":["post-4712","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-diseno-grafico","tag-diseno-grafico"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.certus.edu.pe\/blog\/wp-json\/wp\/v2\/posts\/4712"}],"collection":[{"href":"https:\/\/www.certus.edu.pe\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.certus.edu.pe\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.certus.edu.pe\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.certus.edu.pe\/blog\/wp-json\/wp\/v2\/comments?post=4712"}],"version-history":[{"count":0,"href":"https:\/\/www.certus.edu.pe\/blog\/wp-json\/wp\/v2\/posts\/4712\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.certus.edu.pe\/blog\/wp-json\/wp\/v2\/media\/4786"}],"wp:attachment":[{"href":"https:\/\/www.certus.edu.pe\/blog\/wp-json\/wp\/v2\/media?parent=4712"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.certus.edu.pe\/blog\/wp-json\/wp\/v2\/categories?post=4712"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.certus.edu.pe\/blog\/wp-json\/wp\/v2\/tags?post=4712"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}