<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Pixel Innova: Agencia de Marketing Digital y Desarrollo Web - UI archivos</title>
	<atom:link href="https://pixelinnova.com/etiquetas/ui/feed/" rel="self" type="application/rss+xml" />
	<link>https://pixelinnova.com/etiquetas/ui/</link>
	<description>La agencia de marketing y desarrollo web que te hará despegar en internet</description>
	<lastBuildDate>Fri, 12 Jan 2024 11:01:11 +0000</lastBuildDate>
	<language>es</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9.4</generator>

<image>
	<url>https://pixelinnova.com/wp-content/uploads/2023/09/bola-pixel.svg</url>
	<title>Pixel Innova: Agencia de Marketing Digital y Desarrollo Web - UI archivos</title>
	<link>https://pixelinnova.com/etiquetas/ui/</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Tendencias en el diseño web 2019: colores, tipografía y mucho más</title>
		<link>https://pixelinnova.com/tendencias-en-el-diseno-web/</link>
					<comments>https://pixelinnova.com/tendencias-en-el-diseno-web/#comments</comments>
		
		<dc:creator><![CDATA[admin]]></dc:creator>
		<pubDate>Thu, 22 Aug 2019 20:36:33 +0000</pubDate>
				<category><![CDATA[CMS]]></category>
		<category><![CDATA[Desarrollo web]]></category>
		<category><![CDATA[3D]]></category>
		<category><![CDATA[Animaciones]]></category>
		<category><![CDATA[Color]]></category>
		<category><![CDATA[Degradado]]></category>
		<category><![CDATA[desarrollo a medida]]></category>
		<category><![CDATA[Desarrollo Web]]></category>
		<category><![CDATA[diseño web]]></category>
		<category><![CDATA[tipografía]]></category>
		<category><![CDATA[UI]]></category>
		<category><![CDATA[UX]]></category>
		<guid isPermaLink="false">https://blog.pixelinnova.com/?p=1911</guid>

					<description><![CDATA[<p>Ya conocemos algunas tendencias en el diseño web que llevan presentes bastante tiempo y no parece que vayan a dejar de hacerlo en un futuro próximo, como los diseños one page (diseños que comparten toda la información en una única página), el mobile first (diseños centrados en la vista móvil que se adaptan a vistas&#8230;</p>
<p>La entrada <a href="https://pixelinnova.com/tendencias-en-el-diseno-web/">Tendencias en el diseño web 2019: colores, tipografía y mucho más</a> se publicó primero en <a href="https://pixelinnova.com">Pixel Innova: Agencia de Marketing Digital y Desarrollo Web</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p>Ya conocemos algunas <strong>tendencias en el diseño web</strong> que llevan presentes bastante tiempo y no parece que vayan a dejar de hacerlo en un futuro próximo, como los <strong>diseños </strong><em><strong>one page</strong></em> (diseños que comparten toda la información en <strong>una única página</strong>), el <em><strong>mobile first</strong></em> (diseños centrados en la <strong>vista móvil</strong> que se adaptan a vistas de mayores dimensiones), <strong>simplicidad</strong> (ya sabéis lo que dicen, <strong>menos es más</strong>, una web limpia y que haga un buen uso de los <strong>fondos</strong> y los <strong>espacios en blanco</strong> dará una mayor claridad sobre lo que quieres contar), <strong>gigantismo</strong> (el uso de elementos de gran tamaño que aporten impacto a la página), fondos de vídeo, asimetría…</p>



<p>Pero hoy os traemos otras tendencias que combinadas con las anteriores harán que vuestras páginas web y aplicaciones sean más <strong>modernas</strong> y <strong>se diferencien</strong> de las demás.</p>



<h2 class="wp-block-heading" id="colores-vivos-y-degradados">Colores vivos y degradados</h2>



<p>Una de las tendencias más importantes de este año. Los <strong>colores vivos</strong> llaman la atención de los usuarios y <strong>evocan emociones</strong>, por lo que son tan importantes como las imágenes que utilizamos para los fondos o para ilustrar nuestra página. Los <strong>degradados</strong> son la tendencia de color multiuso que sirven para prácticamente cualquier diseño, añaden <strong>interés</strong> y <strong>efusividad</strong>.</p>



<figure class="wp-block-image"><img fetchpriority="high" decoding="async" width="1024" height="495" src="https://pixelinnova.com/wp-content/uploads/2019/08/degradado-1024x495.jpg" alt="" class="wp-image-1930" srcset="https://pixelinnova.com/wp-content/uploads/2019/08/degradado-1024x495.jpg 1024w, https://pixelinnova.com/wp-content/uploads/2019/08/degradado-300x145.jpg 300w, https://pixelinnova.com/wp-content/uploads/2019/08/degradado-768x371.jpg 768w, https://pixelinnova.com/wp-content/uploads/2019/08/degradado-370x179.jpg 370w, https://pixelinnova.com/wp-content/uploads/2019/08/degradado-840x406.jpg 840w, https://pixelinnova.com/wp-content/uploads/2019/08/degradado-410x198.jpg 410w, https://pixelinnova.com/wp-content/uploads/2019/08/degradado.jpg 1080w" sizes="(max-width: 1024px) 100vw, 1024px" /><figcaption class="wp-element-caption"><a href="https://www.matserra.design/" target="_blank" rel="noreferrer noopener" aria-label="Mat Serra (abre en una nueva pestaña)">Mat Serra</a></figcaption></figure>



<h2 class="wp-block-heading" id="elementos-3d-realismo">Elementos 3D – Realismo</h2>



<p>El <strong>diseño UI/UX</strong> plano está perdiendo fuelle. Cada vez se ven más elementos de páginas web siendo <strong>rediseñados</strong> o recreados en modelos 3D, dando al usuario sensación de <strong>realismo</strong>.</p>



<figure class="wp-block-image aligncenter is-resized"><img decoding="async" width="582" height="654" src="https://pixelinnova.com/wp-content/uploads/2019/08/desarrollo-mockup-web.gif" alt="" class="wp-image-1912" style="width:421px;height:472px"/><figcaption class="wp-element-caption"><a href="https://pixelinnova.com" target="_blank" rel="noreferrer noopener" aria-label="Pixel Innova (abre en una nueva pestaña)">Pixel Innova</a></figcaption></figure>



<p>Un ejemplo que muchos conoceréis son los iconos de reacción de facebook, rediseñados para ser más tridimensionales.</p>



<figure class="wp-block-image aligncenter"><img decoding="async" width="319" height="118" src="https://pixelinnova.com/wp-content/uploads/2019/08/facebook-faces.gif" alt="" class="wp-image-1914"/><figcaption class="wp-element-caption"><a href="https://facebook.com" target="_blank" rel="noreferrer noopener" aria-label="Facebook (abre en una nueva pestaña)">Facebook</a></figcaption></figure>



<h2 class="wp-block-heading" id="animaciones">Animaciones</h2>



<p>Las animaciones en una página web o en una aplicación aportan <strong>dinamismo</strong> y guían al usuario a través de las mismas. Se usan principalmente para <strong>llamar la atención</strong> sobre ciertos elementos o para explicar la <strong>relación entre objetos</strong>.</p>



<figure class="wp-block-image"><img loading="lazy" decoding="async" width="920" height="440" src="https://pixelinnova.com/wp-content/uploads/2019/08/gema-martin-web-intro-resized.gif" alt="" class="wp-image-1927"/><figcaption class="wp-element-caption"><a href="https://gemamartinborgas.es/" target="_blank" rel="noreferrer noopener" aria-label="Gema Martín Borgas (abre en una nueva pestaña)">Gema Martín Borgas</a></figcaption></figure>



<figure class="wp-block-image"><img loading="lazy" decoding="async" width="920" height="440" src="https://pixelinnova.com/wp-content/uploads/2019/08/marry-monday-intro-resized.gif" alt="" class="wp-image-1928"/><figcaption class="wp-element-caption"><a href="https://veleyross.wedding/" target="_blank" rel="noreferrer noopener" aria-label="Veley/Ross Wedding (abre en una nueva pestaña)">Veley/Ross Wedding</a></figcaption></figure>



<h2 class="wp-block-heading" id="historias-visuales">Historias visuales</h2>



<p>Las <strong>ilustraciones</strong> son una excelente herramienta para explicar historias de forma más <strong>amena</strong> que poniendo un “pegote” de texto. </p>



<figure class="wp-block-image aligncenter"><img loading="lazy" decoding="async" width="796" height="327" src="https://pixelinnova.com/wp-content/uploads/2019/08/dribbble-kids.webp" alt="" class="wp-image-1917" srcset="https://pixelinnova.com/wp-content/uploads/2019/08/dribbble-kids.webp 796w, https://pixelinnova.com/wp-content/uploads/2019/08/dribbble-kids-300x123.webp 300w, https://pixelinnova.com/wp-content/uploads/2019/08/dribbble-kids-768x315.webp 768w, https://pixelinnova.com/wp-content/uploads/2019/08/dribbble-kids-370x152.webp 370w, https://pixelinnova.com/wp-content/uploads/2019/08/dribbble-kids-410x168.webp 410w" sizes="auto, (max-width: 796px) 100vw, 796px" /><figcaption class="wp-element-caption"><a href="https://dribbble.com/shots/7024359" target="_blank" rel="noreferrer noopener" aria-label="Dribbble (abre en una nueva pestaña)">Dribbble</a></figcaption></figure>



<p> Cada vez más y más <strong>páginas web</strong> y <strong>aplicaciones de móvil</strong> crean <strong>personajes propios</strong> que vayan con la plataforma para llevar a cabo esta función, como Duo, la mascota de la aplicación «Duolingo».</p>



<figure class="wp-block-image aligncenter is-resized"><img loading="lazy" decoding="async" width="920" height="581" src="https://pixelinnova.com/wp-content/uploads/2019/08/duolingo_nueva_imagen_animacion1.gif" alt="" class="wp-image-1915" style="width:372px;height:235px"/><figcaption class="wp-element-caption"><a href="https://es.duolingo.com/" target="_blank" rel="noreferrer noopener" aria-label="Duolingo (abre en una nueva pestaña)">Duolingo</a><a href="https://es.duolingo.com/"> </a>// Imagen de <a rel="noreferrer noopener" aria-label="Brandemia (abre en una nueva pestaña)" href="http://www.brandemia.org/duolingo-renueva-su-imagen-y-su-app" target="_blank">Brandemia</a></figcaption></figure>



<h2 class="wp-block-heading" id="tipografia-prominente">Tipografía prominente</h2>



<p>Y con prominente no queremos decir necesariamente grande, si no <strong>que resalte</strong>. Una <strong>tipografía atrevida y pegadiza</strong> llama la atención y pone contraste a la “monotonía” del resto del texto. Es simple, si pones más peso visual en un <strong>mensaje importante</strong>, aumentas las posibilidades de que el usuario lo lea.</p>



<figure class="wp-block-image"><img loading="lazy" decoding="async" width="1024" height="497" src="https://pixelinnova.com/wp-content/uploads/2019/08/unleash-the-beast-1024x497.jpg" alt="" class="wp-image-1931" srcset="https://pixelinnova.com/wp-content/uploads/2019/08/unleash-the-beast-1024x497.jpg 1024w, https://pixelinnova.com/wp-content/uploads/2019/08/unleash-the-beast-300x146.jpg 300w, https://pixelinnova.com/wp-content/uploads/2019/08/unleash-the-beast-768x373.jpg 768w, https://pixelinnova.com/wp-content/uploads/2019/08/unleash-the-beast-370x180.jpg 370w, https://pixelinnova.com/wp-content/uploads/2019/08/unleash-the-beast-840x408.jpg 840w, https://pixelinnova.com/wp-content/uploads/2019/08/unleash-the-beast-410x199.jpg 410w, https://pixelinnova.com/wp-content/uploads/2019/08/unleash-the-beast.jpg 1080w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /><figcaption class="wp-element-caption"><a href="https://www.dodge.com.mx/muscle" target="_blank" rel="noreferrer noopener" aria-label="Dodge (abre en una nueva pestaña)">Dodge</a></figcaption></figure>



<h2 class="wp-block-heading" id="experiencias-a-pantalla-completa">Experiencias a pantalla completa</h2>



<p>Las imágenes y los vídeos a pantalla completa pueden ser <strong>impactantes</strong> y funcionan genial para <strong>llamar la atención</strong>. Una vez que al usuario le llama algo la atención, <strong>pasa más tiempo en la aplicación</strong> o en la página y hay más posibilidades de que <strong>continúe navegando</strong> por la misma. Nosotros utilizamos este recurso en nuestra <strong><a href="https://pixelinnova.com" target="_blank" rel="noreferrer noopener" aria-label="página corporativa (abre en una nueva pestaña)">página corporativa</a></strong>, ¿aún no la has visto?</p>



<figure class="wp-block-image"><img decoding="async" src="https://pixelinnova.com/wp-content/uploads/2019/08/gif-pixel-web-resized-1.gif" alt="" class="wp-image-1926"/><figcaption class="wp-element-caption"><a href="https://pixelinnova.com" target="_blank" rel="noreferrer noopener" aria-label="Pixel Innova (abre en una nueva pestaña)">Pixel Innova</a></figcaption></figure>



<p>¿Quiere todo esto decir que para tener una <strong>página web / aplicación moderna</strong> hay que utilizar todos estos <strong>recursos</strong>? ¡Claro que no! Como siempre se ha dicho, <em>«para gustos, los colores»</em>. Puede que algunas de las tendencias que hemos comentado hoy no te gusten, o simplemente no peguen con <strong>tu marca</strong>. ¡No pasa nada! En <strong><a aria-label="Pixel Innova (abre en una nueva pestaña)" href="https://pixelinnova.com" target="_blank" rel="noreferrer noopener">Pixel Innova</a></strong> podemos aconsejarte y crearte una <strong>página o aplicación a tu gusto</strong>.</p>
<p>La entrada <a href="https://pixelinnova.com/tendencias-en-el-diseno-web/">Tendencias en el diseño web 2019: colores, tipografía y mucho más</a> se publicó primero en <a href="https://pixelinnova.com">Pixel Innova: Agencia de Marketing Digital y Desarrollo Web</a>.</p>
]]></content:encoded>
					
					<wfw:commentRss>https://pixelinnova.com/tendencias-en-el-diseno-web/feed/</wfw:commentRss>
			<slash:comments>1</slash:comments>
		
		
			</item>
	</channel>
</rss>
