1<!DOCTYPE html><html lang="es" class="no-js"> <head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# website: http://ogp.me/ns/website#"><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Servicios de Diseño UX, UI y Desarrollo Web â Barcelona | Atico³</title><meta name="description" content="Diseño de identidad, UX/UI, webs y desarrollo para startups y scale-ups. Entregamos a tu equipo de desarrollo o directamente en producción. Barcelona, clientes globales."><meta name="keywords" content="UX, Experiencia de Usuario, Diseño, UI, Agencia UX, Diseño digital, Barcelona"><meta name="author" content="Atico3"><meta name="robots" content="index, follow"><link rel="canonical" href="https://atico3.com/p/services/"><link rel="alternate" href="https://atico3.com/p/services/" hreflang="x-default"><link rel="alternate" href="https://atico3.com/p/services/" hreflang="es"><link rel="alternate" href="https://atico3.com/en/p/services/" hreflang="en"><link rel="alternate" href="https://atico3.com/ca/p/services/" hreflang="ca"><style>@font-face{font-family:"General Sans-2f32b1c8e90960cb";src:url("/_astro/fonts/ff46cff49931ceb6.woff2") format("woff2");font-display:swap;font-weight:400;font-style:normal;}@font-face{font-family:"General Sans-2f32b1c8e90960cb";src:url("/_astro/fonts/cc8767cc2a2aa049.woff2") format("woff2");font-display:swap;font-weight:500;font-style:normal;}@font-face{font-family:"General Sans-2f32b1c8e90960cb";src:url("/_astro/fonts/075a552937a42280.woff2") format("woff2");font-display:swap;font-weight:600;font-style:normal;}@font-face{font-family:"General Sans-2f32b1c8e90960cb";src:url("/_astro/fonts/330fee7f31994490.woff2") format("woff2");font-display:swap;font-weight:700;font-style:normal;}@font-face{font-family:"General Sans-2f32b1c8e90960cb fallback: Arial";src:local("Arial");font-display:swap;font-weight:400;font-style:normal;size-adjust:100.9419%;ascent-override:100.0575%;descent-override:23.776%;line-gap-override:9.9067%;}@font-face{font-family:"General Sans-2f32b1c8e90960cb fallback: Arial";src:local("Arial");font-display:swap;font-weight:500;font-style:normal;size-adjust:100.9419%;ascent-override:100.0575%;descent-override:23.776%;line-gap-override:9.9067%;}@font-face{font-family:"General Sans-2f32b1c8e90960cb fallback: Arial";src:local("Arial");font-display:swap;font-weight:600;font-style:normal;size-adjust:100.9419%;ascent-override:100.0575%;descent-override:23.776%;line-gap-override:9.9067%;}@font-face{font-family:"General Sans-2f32b1c8e90960cb fallback: Arial Bold";src:local("Arial Bold");font-display:swap;font-weight:700;font-style:normal;size-adjust:93.7538%;ascent-override:107.7289%;descent-override:25.599%;line-gap-override:10.6662%;}:root{--font-general-sans:"General Sans-2f32b1c8e90960cb","General Sans-2f32b1c8e90960cb fallback: Arial","General Sans-2f32b1c8e90960cb fallback: Arial Bold",sans-serif;}</style> <link rel="preload" href="/_astro/fonts/075a552937a42280.woff2" as="font" type="font/woff2" crossorigin><style>@font-face{font-family:Inter-8bcb3b6a2e57bcc5;src:url("/_astro/fonts/3659874296952b59.woff2") format("woff2");font-display:swap;font-weight:400;font-style:normal;}@font-face{font-family:Inter-8bcb3b6a2e57bcc5;src:url("/_astro/fonts/86aa531181a71dcc.woff2") format("woff2");font-display:swap;font-weight:500;font-style:normal;}@font-face{font-family:Inter-8bcb3b6a2e57bcc5;src:url("/_astro/fonts/99f8d880cd289748.woff2") format("woff2");font-display:swap;font-weight:600;font-style:normal;}@font-face{font-family:Inter-8bcb3b6a2e57bcc5;src:url("/_astro/fonts/847b6310bfa69c2e.woff2") format("woff2");font-display:swap;font-weight:700;font-style:normal;}@font-face{font-family:"Inter-8bcb3b6a2e57bcc5 fallback: Arial";src:local("Arial");font-display:swap;font-weight:400;font-style:normal;size-adjust:107.1194%;ascent-override:90.4365%;descent-override:22.518%;line-gap-override:0%;}@font-face{font-family:"Inter-8bcb3b6a2e57bcc5 fallback: Arial";src:local("Arial");font-display:swap;font-weight:500;font-style:normal;size-adjust:107.1194%;ascent-override:90.4365%;descent-override:22.518%;line-gap-override:0%;}@font-face{font-family:"Inter-8bcb3b6a2e57bcc5 fallback: Arial";src:local("Arial");font-display:swap;font-weight:600;font-style:normal;size-adjust:107.1194%;ascent-override:90.4365%;descent-override:22.518%;line-gap-override:0%;}@font-face{font-family:"Inter-8bcb3b6a2e57bcc5 fallback: Arial Bold";src:local("Arial Bold");font-display:swap;font-weight:700;font-style:normal;size-adjust:99.4914%;ascent-override:97.3703%;
1descent-override:24.2444%;line-gap-override:0%;}:root{--font-inter:Inter-8bcb3b6a2e57bcc5,"Inter-8bcb3b6a2e57bcc5 fallback: Arial","Inter-8bcb3b6a2e57bcc5 fallback: Arial Bold",sans-serif;}</style> <link rel="preload" href="/_astro/fonts/3659874296952b59.woff2" as="font" type="font/woff2" crossorigin><link rel="icon" type="image/png" href="/images/icons/fav/icon-32x32.png" sizes="32x32"><link rel="icon" type="image/png" href="/images/icons/fav/icon-96x96.png" sizes="96x96"><link rel="apple-touch-icon" href="/images/icons/fav/apple-icon-120x120.png"><link rel="apple-touch-icon" sizes="180x180" href="/images/icons/fav/apple-icon-180x180.png"><link rel="apple-touch-icon" sizes="152x152" href="/images/icons/fav/apple-icon-152x152.png"><link rel="apple-touch-icon" sizes="167x167" href="/images/icons/fav/apple-icon-167x167.png"><meta property="og:type" content="website"><meta property="og:url" content="https://atico3.com/p/services/"><meta property="og:title" content="Servicios de Diseño UX, UI y Desarrollo Web â Barcelona | Atico³"><meta property="og:description" content="Diseño de identidad, UX/UI, webs y desarrollo para startups y scale-ups. Entregamos a tu equipo de desarrollo o directamente en producción. Barcelona, clientes globales."><meta property="og:image" content="https://atico3.com/images/atico3-share-image.png"><meta name="twitter:card" content="summary_large_image"><meta name="twitter:site" content="@atico3studio"><meta name="twitter:title" content="Servicios de Diseño UX, UI y Desarrollo Web â Barcelona | Atico³"><meta name="twitter:description" content="Diseño de identidad, UX/UI, webs y desarrollo para startups y scale-ups. Entregamos a tu equipo de desarrollo o directamente en producción. Barcelona, clientes globales."><meta name="twitter:image" content="https://atico3.com/images/atico3-share-image.png"><meta name="twitter:url" content="https://atico3.com/p/services/"><link rel="preload" href="/css/cookieconsent.css" as="style" onload="this.onload=null;this.rel='stylesheet'"><noscript><link rel="stylesheet" href="/css/cookieconsent.css"></noscript>
1<script src="https://analytics.ahrefs.com/analytics.js" data-key="VEtVPMwwWeKmVcyAs4TZgg" async></script>
1<script> 2 window.dataLayer = window.dataLayer || []; 3 function gtag(){dataLayer.push(arguments);} 4 gtag('consent', 'default', { 5 analytics_storage: 'denied', 6 ad_storage: 'denied', 7 ad_user_data: 'denied', 8 ad_personalization: 'denied', 9 wait_for_update: 500, 10 }); 11 gtag('js', new Date()); 12 gtag('config', 'G-6TJ1LJB942', { send_page_view: true }); 13 gtag('config', 'AW-852156308'); 14 </script>
14<script> 15 (function () { 16 function loadGtag() { 17 var s = document.createElement('script'); 18 s.async = true; 19 s.src = 'https://www.googletagmanager.com/gtag/js?id=G-6TJ1LJB942'; 20 document.head.appendChild(s); 21 } 22 var schedule = window.requestIdleCallback || function (cb) { return setTimeout(cb, 1); }; 23 if (document.readyState === 'complete') { 24 schedule(loadGtag); 25 } else { 26 window.addEventListener('load', function () { schedule(loadGtag); }); 27 } 28 })(); 29 </script>
29<script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":["Organization","LocalBusiness"],"@id":"https://atico3.com/#organization","name":"Atico³","url":"https://atico3.com","logo":{"@type":"ImageObject","url":"https://atico3.com/images/a3-icon.png"},"email":"[email protected]","address":{"@type":"PostalAddress","addressLocality":"Barcelona","addressRegion":"Catalonia","addressCountry":"ES"},"areaServed":["ES","GB","US","DE","FR","NL"],"description":"Agencia de diseño UX/UI en Barcelona. Productos digitales para startups y scale-ups. Suscripción mensual de diseño.","sameAs":["https://twitter.com/atico3studio"],"knowsAbout":["UX Design","UI Design","Product Design","Web Development","Mobile App Design"]},{"@type":"WebSite","@id":"https://atico3.com/#website","url":"https://atico3.com","name":"Atico³","publisher":{"@id":"https://atico3.com/#organization"}},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Inicio","item":"https://atico3.com/"},{"@type":"ListItem","position":2,"name":"Servicios","item":"https://atico3.com/p/services/"}]}]}</script>
29<script type="application/ld+json">{"@context":"https://schema.org","@type":"Service","name":"Servicios","description":"Diseño de identidad, UX/UI, webs y desarrollo para startups y scale-ups. Entregamos a tu equipo de desarrollo o directamente en producción. Barcelona, clientes globales.","serviceType":"UX/UI Design, Web Design, Branding & Development","provider":{"@id":"https://atico3.com/#organization"},"areaServed":[{"@type":"Country","name":"Spain"},{"@type":"City","name":"Barcelona"}],"url":"https://atico3.com/p/services/"}</script>
29<link rel="stylesheet" href="/_astro/styles.CSX8-mIj.css"> 30<style>#services-typewriter[data-astro-cid-an4l64q3]{min-height:24rem}@media(width<=767px){#services-typewriter[data-astro-cid-an4l64q3]{min-height:18rem}}@media(width<=620px){#services-typewriter[data-astro-cid-an4l64q3]{min-height:14rem}}.services-pp-note[data-astro-cid-an4l64q3]{margin-top:2rem;& p{font-size:.95rem;color:#0000008c;margin-bottom:1rem}} 31</style></head> <body class="is-page is-services">
31<script type="module" src="/js/cookieconsent-config.js"></script>
31<div id="content"> 32 33 <nav class="navbar is-light" role="navigation" aria-label="main navigation"> <a class="nav-logo" href="/" aria-label="Atico3"> <svg width="120" height="50" viewBox="0 0 170 50" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 34 <g id="p1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> 35 <g class="atico3-logo" fill="#ffffff"> 36 <polygon class="a" points="30.618 50.371 18.696 22.155 6.774 50.37 0.064 50.37 15.85 13.012 21.543 13.012 37.328 50.372 30.619 50.372"></polygon> 37 <path d="M43.263,9.889 L43.263,22.907 C43.2630001,28.8683333 43.2630001,34.8296667 43.263,40.791 C43.263,44.845 45.176,47.714 48.216,49.234 C49.226,49.739 50.276,50.054 51.321,50.228 C51.686,50.288 52.029,50.328 52.344,50.351 C52.553,50.366 52.721,50.371 52.843,50.371 L55.933,50.371 L55.933,44.191 L52.843,44.191 C52.863,44.191 52.841,44.19 52.783,44.186 C52.6335648,44.1745534 52.4847391,44.1562004 52.337,44.131 C51.8662459,44.0567597 51.4090012,43.9135548 50.98,43.706 C49.964,43.198 49.443,42.416 49.443,40.791 L49.443,26.124 L49.443,22.907 L49.443,13.805 L49.443,6.799 L43.263,6.799 L43.263,9.889 L43.263,9.889 Z M37.083,19.16 L55.623,19.16 L55.623,12.98 L37.083,12.98 L37.083,19.16 Z" class="t" fill-rule="nonzero"></path> 38 <polygon class="i" points="64.894 12.98 71.074 12.98 71.074 50.37 64.894 50.37"></polygon> 39 <path d="M97.65,12.361 C97.456,12.361 97.152,12.371 96.753,12.4 C96.121,12.445 95.426,12.525 94.68,12.65 C92.549,13.005 90.412,13.646 88.389,14.657 C82.451,17.626 78.8,23.103 78.8,31.212 C78.8,39.321 82.451,44.797 88.389,47.766 C90.412,48.778 92.549,49.419 94.68,49.774 C95.426,49.898 96.121,49.978 96.753,50.024 C97.153,50.052 97.456,50.062 97.651,50.062 L97.651,43.882 L97.651,46.972 C97.654,43.882 97.628,43.882 97.577,43.88 C97.471,43.876 97.342,43.87 97.194,43.859 C96.692125,43.8219808 96.1922489,43.7615819 95.696,43.678 C94.134,43.418 92.576,42.95 91.153,42.238 C87.24,40.282 84.981,36.893 84.981,31.212 C84.981,25.53 87.24,22.142 91.153,20.185 C92.577,19.473 94.133,19.006 95.696,18.745 C96.1922647,18.6617531 96.6921407,18.6016879 97.194,18.565 C97.342,18.554 97.471,18.547 97.577,18.544 L97.651,18.542 L97.651,12.362 L97.65,12.361 Z" class="c"></path> 40 <path d="M121.445,50.062 C111.205,50.062 102.904,41.761 102.904,31.521 C102.904,21.281 111.205,12.979 121.445,12.979 C131.685,12.979 139.987,21.28 139.987,31.521 C139.987,41.761 131.685,50.062 121.445,50.062 Z M121.445,43.882 C128.272,43.882 133.806,38.348 133.806,31.521 C133.806,24.694 128.272,19.16 121.446,19.16 C114.619,19.16 109.084,24.694 109.084,31.52 C109.084,38.348 114.619,43.882 121.445,43.882 Z" class="o" fill-rule="nonzero"></path> 41 <path d="M158.672068,16.0695 C160.145855,14.4678018 161,12.2882259 161,9.58 C161,5.527 159.087,2.657 156.047,1.137 C155.038,0.633 153.987,0.318 152.942,0.143 C152.577,0.083 152.234,0.043 151.92,0.02 C151.71,0.006 151.542,0 151.42,0 L148.33,0 L148.33,6.181 L151.42,6.181 C151.399,6.181 151.422,6.181 151.479,6.185 C151.62877,6.19641594 151.77793,6.21476897 151.926,6.24 C152.396754,6.31424034 152.853999,6.45744521 153.283,6.665 C154.299,7.173 154.82,7.955 154.82,9.58 C154.82,11.205 154.299,11.986 153.283,12.494 C152.873,12.7 152.402,12.84 151.926,12.92 C151.759,12.948 151.608,12.965 151.479,12.974 C151.472314,12.9744611 151.466106,12.9749222 151.460389,12.9801749 C151.446411,12.9800563 151.432947,12.98 151.42,12.98 L151.42,12.979 L148.33,12.979 L148.33,16.0695 L148.33,19.16 L151.42,19.16 C151.399,19.16 151.422,19.16 151.479,19.164 C151.62877,19.1754159 151.77793,19.193769 151.926,19.219 C152.396807,19.2935574 152.854053,19.4370998 153.283,19.645 C154.299,20.152 154.82,20.934 154.82,22.559 C154.82,24.184 154.299,24.965 153.283,25.473 C152.873,25.679 152.402,25.819 151.926,25.899 C151.759,25.927 151.608,25.944 151.479,25.953 L151.479,25.953 C151.451,25.955 151.421,25.958 151.111,25.958 L151.42,25.958 L148.33,25.958 L148.33,32.138 L151.42,32.138 C151.542,32.138 151.71,32.133 151.919,32.118 C152.234,32.095 152.577,32.056 152.942,3
411.995 C153.987,31.821 155.037,31.506 156.047,31.001 C159.087,29.481 161,26.612 161,22.559 C161,19.8507741 160.145855,17.6711982 158.672068,16.0695 Z" class="n3" fill-rule="nonzero"></path> 42 </g> 43 </g> 44</svg> 45 </a> <div id="siteNav" class="nav-menu"> <div class="nav-links"> <a href="/" class="nav-link">Inicio</a> <a href="/#work" class="nav-link" data-work-link>Trabajos</a> <a href="/p/services/" class="nav-link is-active">Servicios</a> <a href="/p/subscription/" class="nav-link">Precios</a> <a href="/p/about/" class="nav-link">Nosotros</a> <a href="/blog/" class="nav-link nav-link--mobile-only">Blog</a> </div> <div class="nav-actions"> <div class="nav-lang"> <button class="nav-lang-btn" aria-label="language"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="20" height="20"><path d="M256,0C114.841,0,0,114.841,0,256S114.841,512,256,512,512,397.159,512,256,397.159,0,256,0ZM32,256a223.492,223.492,0,0,1,7.868-58.88h79.585a476.089,476.089,0,0,0,0,117.76H39.868A223.492,223.492,0,0,1,32,256Zm115.8,0a438.984,438.984,0,0,1,3.908-58.88H240V314.88H151.706A438.984,438.984,0,0,1,147.8,256ZM272,34.724c20.983,7.072,41.33,27.726,57.544,59.059,10.775,20.821,19.208,45,25.061,71.337H272Zm-32,0v130.4H157.4c5.853-26.336,14.286-50.516,25.061-71.337C198.671,62.45,219.017,41.8,240,34.724Zm0,312.156v130.4c-20.983-7.072-41.329-27.726-57.544-59.059-10.775-20.821-19.208-45-25.061-71.337Zm32,130.4V346.88h82.605c-5.853,26.336-14.286,50.516-25.061,71.337C313.33,449.55,292.983,470.2,272,477.276Zm0-162.4V197.12h88.294A438.984,438.984,0,0,1,364.2,256a438.984,438.984,0,0,1-3.908,58.88ZM392.548,197.12h79.584a224.248,224.248,0,0,1,0,117.76H392.548A471.238,471.238,0,0,0,396.2,256,471.238,471.238,0,0,0,392.548,197.12Zm68.169-32H387.3c-6.476-31.755-16.371-61-29.332-86.044a215.821,215.821,0,0,0-19.64-31.4A225.3,225.3,0,0,1,460.717,165.12ZM173.677,47.672a215.823,215.823,0,0,0-19.641,31.4c-12.961,25.045-22.856,54.289-29.332,86.044H51.283A225.3,225.3,0,0,1,173.677,47.672ZM51.283,346.88H124.7c6.476,31.755,16.371,61,29.332,86.044a215.823,215.823,0,0,0,19.641,31.4A225.3,225.3,0,0,1,51.283,346.88ZM338.324,464.328a215.821,215.821,0,0,0,19.64-31.4c12.961-25.045,22.856-54.289,29.332-86.044h73.421A225.3,225.3,0,0,1,338.324,464.328Z"></path></svg> </button> <div class="nav-lang-dropdown"> <a href="/en/" class="nav-lang-item">English</a> <a href="/" class="nav-lang-item">Castellano</a> <a href="/ca/" class="nav-lang-item">Catalan</a> </div> </div> <a href="/p/contact/" class="button is-small is-white">Contacto</a> </div> </div> <button class="nav-burger" aria-label="menu" aria-expanded="false" data-target="siteNav"> <span aria-hidden="true"></span> <span aria-hidden="true"></span> <span aria-hidden="true"></span> </button> </nav>
45<script type="module">function l(e,t){t.classList.add("is-active"),e.classList.add("is-nav-opening"),e.addEventListener("transitionend",()=>{e.classList.remove("is-nav-opening"),e.classList.add("is-active")},{once:!0})}function o(e){e.querySelector(".nav-burger")?.classList.remove("is-active"),e.classList.add("is-closing"),e.addEventListener("animationend",()=>{e.classList.remove("is-active","is-closing"),e.classList.add("is-returning"),requestAnimationFrame(()=>requestAnimationFrame(()=>{e.classList.remove("is-returning")}))},{once:!0})}document.querySelectorAll(".nav-burger").forEach(e=>{e.addEventListener("click",()=>{const t=e.closest(".navbar");t.classList.contains("is-active")?o(t):l(t,e)})});document.querySelectorAll('.nav-links a[href*="#"]').forEach(e=>{e.addEventListener("click",()=>{const t=e.closest(".navbar");t?.classList.contains("is-active")&&o(t)})});document.querySelectorAll("[data-work-link]").forEach(e=>{e.addEventListener("click",t=>{const n=document.getElementById("work"),c=document.querySelector(".masthead")!==null;if(!n||!c)return;t.preventDefault();const s=e.closest(".navbar");s?.classList.contains("is-active")&&o(s),n.scrollIntoView({behavior:"smooth"})})});document.querySelectorAll(".nav-lang-item").forEach(e=>{e.addEventListener("click",t=>{if(t.preventDefault(),e.dataset.override){window.location.href=e.dataset.override;return}const n=window.location.pathname,c=e.getAttribute("href")??"/";let s=n.replace(/^\/(en|ca)(\/|$)/,"/");c!=="/"&&(s=c+s),s=s.replace(/\/{2,}/g,"/"),s.startsWith("/")||(s="/"+s),window.location.href=s})});const i=document.querySelector(".navbar"),a=document.getElementById("container");let r=window.scrollY;window.addEventListener("scroll",()=>{const e=window.scrollY;i&&(e<=80?i.classList.remove("is-scrolled-away"):e>r&&window.innerWidth<1024?i.classList.add("is-scrolled-away"):i.classList.remove("is-scrolled-away"),r=e,a&&i.classList.toggle("is-light",e>=a.offsetHeight))},{passive:!0});</script>
45 46 <section class="page-content" data-astro-cid-an4l64q3> <div class="container" data-astro-cid-an4l64q3> <div class="flex flex-wrap" data-astro-cid-an4l64q3> <div class="col" data-astro-cid-an4l64q3> <h1 id="services-typewriter" class="title is-gigantic" style="max-width: none;" data-astro-cid-an4l64q3>Design<br data-astro-cid-an4l64q3>Prototype<br data-astro-cid-an4l64q3>Build<br data-astro-cid-an4l64q3>Launch</h1> <button class="services-scroll-btn" aria-label="Scroll to services" data-astro-cid-an4l64q3> <svg id="fi_2951202" enable-background="new 0 0 100 100" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><g data-astro-cid-an4l64q3><path d="m48 28v36.17l-14.31-14.31-2.83 2.83 19.14 19.14 19.14-19.14-2.83-2.83-14.31 14.31v-36.17z" data-astro-cid-an4l64q3></path></g></svg> </button> </div> </div> </div> <div class="container case-text" data-astro-cid-an4l64q3> <div id="services-first-section" class="flex flex-wrap flex-col-reverse md:flex-row scroll-reveal" data-astro-cid-an4l64q3> <div class="col w-full md:w-1/2" data-astro-cid-an4l64q3> <h2 class="title" style="max-width: 7em;" data-astro-cid-an4l64q3>Diseño de Identidad</h2> <p data-astro-cid-an4l64q3>Una identidad inconsistente pierde credibilidad con cada nueva persona que la ve. Construimos sistemas de identidad para startups que todavÃa no pueden apoyarse en la reputación: logotipo, lenguaje visual y guÃas que cualquier diseñador puede seguir.</p> <ul class="service-list" data-astro-cid-an4l64q3> <li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Logo y variantes</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Logotipo principal, versión horizontal, monocromática y en negativo. Preparado para web, impresión y redes sociales.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Sistema de color y tipografÃa</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Paleta de color con valores hex, RGB y CMYK, y escala tipográfica completa para web y print.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Manual de Marca (Brand Book)</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>GuÃa de uso de la marca que cualquier diseñador, desarrollador o agencia puede aplicar sin preguntarte.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Kit de Componentes</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Todos los elementos visuales organizados en un único kit: botones, tarjetas, iconos y patrones con variantes y estados documentados.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Assets y plantillas</span>
46 <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Plantillas de presentaciones, redes sociales y documentos con la marca aplicada para el uso diario del equipo.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>IconografÃa personalizada</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Conjunto de iconos diseñados desde cero para mantener coherencia visual con la identidad. Solo para proyectos que lo requieran.</p> </div> </li> </ul> </div> <div class="col w-full md:w-1/2" data-astro-cid-an4l64q3> <div class="image-container is-overflowing overflow-right" data-astro-cid-an4l64q3> <img src="/_astro/services-branding_2x.Crtp6Twx_gtI3K.webp" alt="Diseño de identidad y marca para startups â Atico³ Barcelona" loading="lazy" decoding="async" data-astro-cid-an4l64q3="true" width="2392" height="2392"> </div> </div> </div> <div id="services-second-section" class="flex flex-wrap scroll-reveal" data-astro-cid-an4l64q3> <div class="col w-full md:w-1/2" data-astro-cid-an4l64q3> <div class="image-container is-overflowing overflow-left" data-astro-cid-an4l64q3> <img src="/_astro/services-ux-ui-product-02_2x.DiYSQXeK_ZYj7fT.webp" alt="Diseño UX/UI para producto digital â agencia en Barcelona" loading="lazy" decoding="async" data-astro-cid-an4l64q3="true" width="2180" height="1840"> </div> </div> <div class="col w-full md:w-1/2" data-astro-cid-an4l64q3> <h2 class="title" data-astro-cid-an4l64q3>Diseño UX/UI</h2> <p data-astro-cid-an4l64q3>La mayorÃa de los problemas de conversión tienen su origen en decisiones de diseño tomadas demasiado rápido. Mapeamos la experiencia antes de que empiece el diseño visual: flujos y arquitectura de información que el equipo de desarrollo puede ejecutar sin ambigüedades.</p> <ul class="service-list" data-astro-cid-an4l64q3> <li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Investigación y flujos de usuario</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Análisis de comportamiento, mapas de navegación y flujos que definen cómo se mueve el usuario por el producto.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Arquitectura de Información</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Estructura de contenidos y jerarquÃa que determina qué ve el usuario primero y cómo llega a donde necesita ir.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Prototipos Interactivos</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Prototipos navegables. Los usamos para validar con usuarios reales antes de invertir en desarrollo.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Diseño UI de Alta Fidelidad</span>
46 <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Pantallas listas para producción con todos los estados, variantes y casos de error definidos.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Sistema de Diseño</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>LibrerÃa de componentes con tokens de diseño, variantes y documentación. Nuevo componente, nueva pantalla: los estilos ya están definidos.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Handoff para Desarrollo</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Medidas, espaciados, comportamientos y estados de componente anotados para el handoff. No hay reuniones de clarificación entre diseño y desarrollo.</p> </div> </li> </ul> </div> </div> <div class="flex flex-wrap flex-col-reverse md:flex-row scroll-reveal" data-astro-cid-an4l64q3> <div class="col w-full md:w-1/2" data-astro-cid-an4l64q3> <h2 class="title" data-astro-cid-an4l64q3>Webs & Landing Pages</h2> <p data-astro-cid-an4l64q3>Un sitio de marketing mal diseñado no convierte aunque el producto sea bueno. Diseñamos webs y landing pages con jerarquÃa visual clara y archivos listos para tu equipo de desarrollo, o lo lanzamos nosotros mismos en Astro.</p> <ul class="service-list" data-astro-cid-an4l64q3> <li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Landing Pages de Conversión</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Páginas optimizadas para un objetivo: captar leads, vender un producto o validar una propuesta. La estructura y la jerarquÃa visual hacen el trabajo.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Webs Corporativas y de Producto</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Sitios web que explican qué haces, para quién y por qué importa. Con arquitectura de contenidos que reduce el tiempo hasta el primer contacto.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Diseño UI de Marketing</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Secciones, banners y componentes visuales para campañas: email headers, ads, og-images y assets de producto.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Desarrollo en Astro</span>
46 <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Webs de marketing listas para producción en Astro. Lighthouse al máximo, SEO-friendly y fáciles de mantener.</p> <p class="service-desc-link" data-astro-cid-an4l64q3><a href="/blog/astro-para-webs-de-marketing/" data-astro-cid-an4l64q3>Por qué recomendamos Astro para webs de marketing →</a></p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>SEO y Performance</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>HTML semántico, Core Web Vitals optimizados y arquitectura técnica limpia. Sin configuración posterior al lanzamiento.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Optimización de Conversión (CRO)</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Análisis del recorrido del usuario, ajustes de estructura y copy para mejorar la tasa de conversión de páginas existentes.</p> </div> </li> </ul> </div> <div class="col w-full md:w-1/2" data-astro-cid-an4l64q3> <div class="image-container is-overflowing overflow-right" data-astro-cid-an4l64q3> <img src="/_astro/services-web-design-03_2x.DN4fjbf0_pAJEQ.webp" alt="Diseño y desarrollo de webs y landing pages â Barcelona" loading="lazy" decoding="async" data-astro-cid-an4l64q3="true" width="2154" height="1496"> </div> </div> </div> <div class="flex flex-wrap scroll-reveal" data-astro-cid-an4l64q3> <div class="col w-full md:w-1/2" data-astro-cid-an4l64q3> <div class="image-container is-overflowing overflow-left" data-astro-cid-an4l64q3> <img src="/_astro/services-no-code-development_2x.B_VJdMM1_1MFuog.webp" alt="Desarrollo web con Astro, React y Next.js â Atico³" loading="lazy" decoding="async" data-astro-cid-an4l64q3="true" width="2236" height="1628"> </div> </div> <div class="col w-full md:w-1/2" data-astro-cid-an4l64q3> <h2 class="title" data-astro-cid-an4l64q3>Desarrollo Front-end</h2> <p data-astro-cid-an4l64q3>El diseño que nadie implementa no vale nada. Construimos lo que diseñamos: webs de marketing de principio a fin con React y Astro, y front-ends listos para producción para apps web con Next.js. Tu equipo lleva el backend; nosotros, la interfaz.</p> <ul class="service-list" data-astro-cid-an4l64q3> <li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>React & Next.js</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Front-ends listos para producción: SSR, rutas dinámicas, pantallas de autenticación y estado global. El stack estándar para productos que crecen sin reescribir la base.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Astro</span>
46 <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>La prueba más cercana es esta misma web, construida por nosotros con Astro. Cero JavaScript innecesario, carga instantánea.</p> <p class="service-desc-link" data-astro-cid-an4l64q3><a href="/blog/astro-para-webs-de-marketing/" data-astro-cid-an4l64q3>Por qué recomendamos Astro para webs de marketing →</a></p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Datos en el Front-end</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Construimos la UI que consume tu backend: pantallas de autenticación, data fetching, estados de carga y error, y vistas en tiempo real conectadas a Supabase o tu API.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Integraciones y APIs</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Stripe, HubSpot, Intercom, OpenAI, Zapier. Cualquier API externa que el producto necesite conectar.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>CMS & Contenido</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Sanity, Contentful o Astro Content Collections. El equipo de contenido edita sin tocar código ni pedir ayuda.</p> </div> </li><li data-astro-cid-an4l64q3> <button class="service-item-toggle" aria-expanded="false" data-astro-cid-an4l64q3> <span class="service-name" data-astro-cid-an4l64q3>Deploy y Mantenimiento</span> <svg class="toggle-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" data-astro-cid-an4l64q3><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" data-astro-cid-an4l64q3></path></svg> </button> <div class="service-desc" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>Vercel, Netlify o servidor propio. CI/CD configurado, monitorización activa y actualizaciones recurrentes.</p> </div> </li> </ul> <div class="services-pp-note" data-astro-cid-an4l64q3> <p data-astro-cid-an4l64q3>¿Necesitas diseño y front-end bajo el mismo techo? Asà es como trabajamos en proyectos más largos.</p> <a href="/p/contact/" class="button is-small" data-astro-cid-an4l64q3>Hablemos</a> </div> </div> </div> </div> </section> <section id="work" class="work"> <div class="work-grid"> <div class="work-card is-tall"> <img data-src="/_astro/scoop.By1BwQVM_2qwFqO.webp" data-srcset="/_astro/scoop.By1BwQVM_Zx8QJq.webp 400w, /_astro/scoop.By1BwQVM_2qwFqO.webp 700w, /_astro/scoop.By1BwQVM_ZjhGWJ.webp 1400w" sizes="(max-width: 900px) 50vw, 25vw" width="1868" height="2640" alt="UX & UI, Mobile App - Scoop" loading="lazy" decoding="async"> <span class="work-label">Scoop</span> <span class="work-meta">UX & UI, Mobile App</span> </div><div class="work-card"> <img data-src="/_astro/anything-app-icon.BMdFiZWV_1fJ926.webp" data-srcset="/_astro/anything-app-icon.BMdFiZWV_Z1Ovh1m.webp 400w, /_astro/anything-app-icon.BMdFiZWV_1fJ926.webp 700w, /_astro/anything-app-icon.BMdFiZWV_1gpwYg.webp 1400w" sizes="(max-width: 900px) 50vw, 25vw" width="1868" height="1304" alt="Icon Design, Branding - Anything" loading="lazy" decoding="async"> <span class="work-label">Anything</span> <span class="work-meta">Icon Design, Branding</span> </div><div class="work-card"> <img data-src="/_astro/chatripp-icon.BXXkxByz_Z25YHTV.webp" data-srcset="/_astro/chatripp-icon.BXXkxByz_1kg7br.webp 400w, /_astro/chatripp-icon.BXXkxByz_Z25YHTV.webp 700w, /_astro/chatripp-icon.BXXkxByz_2x1C8.webp 1400w" sizes="(max-width: 900px) 50vw, 25vw" width="1868" height="1304" alt="Branding, Icon Design - Chatripp" loading="lazy" decoding="async"> <span class="work-label">Chatripp</span> <span class="work-meta">Branding, Icon Design</span> </div><div class="work-card is-tall"> <img data-src="/_astro/membersfy-site.BfGrCLC9_1gBnQh.webp" data-srcset="/_astro/membersfy-site.BfGrCLC9_1HCvjV.webp 400w, /_astro/membersfy-site.BfGrCLC9_1gBnQh.webp 700w, /_astro/membersfy-site.BfGrCLC9_1JjwGh.webp 1400w" sizes="(max-width: 900px) 50vw, 25vw" width="1868" height="2636" alt="UX & UI, Web - Membersfy" loading="lazy" decoding="async"> <span class="work-label">Membersfy</span> <span class="work-meta">UX & UI, Web</span> </div><div class="work-card"> <img data-src="/_astro/minka.BPFJmAVW_f12rb.webp" data-srcset="/_astro/minka.BPFJmAVW_Z1OKu6P.webp 400w, /_astro/minka.BPFJmAVW_f12rb.webp 700w, /_astro/minka.BPFJmAVW_Z1uroyU.webp 1400w" sizes="(max-width: 900px) 50vw, 25vw" width="1868" height="1304" alt="UX & UI - Minka" loading="lazy" decoding="async"> <span class="work-label">Minka</span> <span class="work-meta">UX & UI</span> </div><div class="work-card"> <img data-src="/_astro/simbria-logo.fczdtCXg_ZIHMOu.webp" data-srcset="/_astro/simbria-logo.fczdtCXg_Z1GY2Ki.webp 400w, /_astro/simbria-logo.fczdtCXg_ZIHMOu.webp 700w, /_astro/simbria-logo.fczdtCXg_Z1WreGr.webp 1400w" sizes="(max-width: 900px) 50vw, 25vw" width="1868" height="1304" alt="Branding, Identity - Simbria" loading="lazy" decoding="async"> <span class="work-label">Simbria</span> <span class="work-meta">Branding, Identity</span> </div> </div> </section>
46<script type="module" src="/_astro/Work.astro_astro_type_script_index_0_lang.DsFNCqjB.js"></script>
46 <section class="cta cta--sub" data-astro-cid-an4l64q3> <div class="cta-sub-bg" data-astro-cid-an4l64q3> <img src="/_astro/ux-ui-work-02_2x.CNuvJg8K_Z2crID1.webp" alt loading="lazy" decoding="async" data-astro-cid-an4l64q3="true" width="5712" height="1935" class="cta-sub-bg-img"> </div> <div class="container text-center scroll-reveal" data-astro-cid-an4l64q3> <span class="service-pill" data-astro-cid-an4l64q3>Design & Product Partner</span> <h2 class="title" data-astro-cid-an4l64q3>Tu equipo de diseño. Listo mañana.</h2> <p class="cta-sub-tagline" data-astro-cid-an4l64q3>Sin permanencia · Entregas en 1â2 dÃas · Cancela cuando quieras</p> <a href="/p/subscription/" class="button is-large is-white" data-astro-cid-an4l64q3>Ver precios</a> <a href="/p/contact/" class="cta-secondary-link" data-astro-cid-an4l64q3>o envÃanos un mensaje</a> </div> </section> <div class="article-floating-cta" id="js-article-floating-cta" aria-hidden="true" data-trigger="#services-second-section"> <button class="floating-cta-dismiss" id="js-floating-dismiss" aria-label="Dismiss"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12"></path> </svg> </button> <div class="floating-cta-slides" aria-hidden="true"> <div class="floating-slide is-active" data-index="0"> <img src="/_astro/soundsmarket-banner.D0yqHChI_w8qjY.webp" alt="Diseño de marca plataforma musical Soundsmarket" loading="lazy" decoding="async" width="480" height="280"> </div><div class="floating-slide" data-index="1"> <img src="/_astro/sheldonn-ui.jVHdbaX0_Y6Qyb.webp" alt="Diseño UI app Sheldonn" loading="lazy" decoding="async" width="480" height="280"> </div><div class="floating-slide" data-index="2"> <img src="/_astro/nanowallet.B9f-9y8H_2oLmKe.webp" alt="Diseño UI wallet de criptomonedas Nanowallet" loading="lazy" decoding="async" width="480" height="280"> </div><div class="floating-slide" data-index="3"> <img src="/_astro/minka.BPFJmAVW_Z24L94B.webp" alt="Diseño UI app Minka" loading="lazy" decoding="async" width="480" height="280"> </div><div class="floating-slide" data-index="4"> <img src="/_astro/simbria.5_AMp49-_ZWd0zN.webp" alt="Diseño UI app Simbria" loading="lazy" decoding="async" width="480" height="280"> </div><div class="floating-slide" data-index="5"> <img src="/_astro/leka-ipad-app.Ci5dp4-r_ZPRzl7.webp" alt="Diseño UX/UI app Leka para iPad" loading="lazy" decoding="async" width="480" height="280"> </div> <div class="floating-slides-overlay"></div> </div> <div class="floating-cta-body"> <p class="floating-cta-eyebrow">Design & Product Partner</p> <h3 class="floating-cta-title">Equipo de diseño instantáneo</h3> <p class="floating-cta-text">Accede a dos diseñadores sénior con entregas en 1â2 dÃas. Sin permanencia, cancela cuando quieras.</p> <a href="/p/subscription/" class="button is-primary is-small"> Ver precio </a> </div> </div>
46<script type="module">const e=document.getElementById("js-article-floating-cta"),f=document.getElementById("js-floating-dismiss");if(!e)throw new Error("no card");const m="floating-cta-dismissed";localStorage.getItem(m)&&e.remove();const o=Array.from(e.querySelectorAll(".floating-slide"));let r=0,a=!1,l=null;o.forEach((i,t)=>{t!==0&&i.classList.add("is-next")});function u(i){if(a||i===r)return;a=!0;const t=o[r],s=o[i];s.classList.remove("is-next"),s.classList.add("is-entering"),s.getBoundingClientRect(),t.classList.add("is-leaving"),t.classList.remove("is-active"),s.classList.remove("is-entering"),s.classList.add("is-active"),r=i,setTimeout(()=>{t.classList.remove("is-leaving"),t.classList.add("is-next"),a=!1},700)}function v(){l||(l=setInterval(()=>{u((r+1)%o.length)},3e3))}let d=!1;function g(){d||(d=!0,setTimeout(()=>{e&&(e.classList.add("is-visible"),e.removeAttribute("aria-hidden"),v())},600))}const c=e.dataset.trigger?document.querySelector(e.dataset.trigger):null,n=()=>{if(d){window.removeEventListener("scroll",n);return}if(c){const i=c.getBoundingClientRect(),t=c.offsetHeight*.5;-i.top+window.innerHeight>t&&(window.removeEventListener("scroll",n),g())}else window.scrollY>window.innerHeight*.6&&(window.removeEventListener("scroll",n),g())};window.addEventListener("scroll",n,{passive:!0});n();f?.addEventListener("click",()=>{e.classList.remove("is-visible"),e.classList.add("is-dismissed"),l&&clearInterval(l),localStorage.setItem(m,"1")});</script>
46
46<script type="module" src="/_astro/Services.astro_astro_type_script_index_0_lang.B67Zl6Np.js"></script>
46<footer class="footer"> <div class="container"> <div class="footer-grid"> <!-- Col 1: Logo + slogan + copyright --> <div class="footer-brand"> <a href="/" class="footer-logo" aria-label="Atico3"> <svg width="120" height="50" viewBox="0 0 170 50" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 47 <g id="p1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> 48 <g class="atico3-logo" fill="#ffffff"> 49 <polygon class="a" points="30.618 50.371 18.696 22.155 6.774 50.37 0.064 50.37 15.85 13.012 21.543 13.012 37.328 50.372 30.619 50.372"></polygon> 50 <path d="M43.263,9.889 L43.263,22.907 C43.2630001,28.8683333 43.2630001,34.8296667 43.263,40.791 C43.263,44.845 45.176,47.714 48.216,49.234 C49.226,49.739 50.276,50.054 51.321,50.228 C51.686,50.288 52.029,50.328 52.344,50.351 C52.553,50.366 52.721,50.371 52.843,50.371 L55.933,50.371 L55.933,44.191 L52.843,44.191 C52.863,44.191 52.841,44.19 52.783,44.186 C52.6335648,44.1745534 52.4847391,44.1562004 52.337,44.131 C51.8662459,44.0567597 51.4090012,43.9135548 50.98,43.706 C49.964,43.198 49.443,42.416 49.443,40.791 L49.443,26.124 L49.443,22.907 L49.443,13.805 L49.443,6.799 L43.263,6.799 L43.263,9.889 L43.263,9.889 Z M37.083,19.16 L55.623,19.16 L55.623,12.98 L37.083,12.98 L37.083,19.16 Z" class="t" fill-rule="nonzero"></path> 51 <polygon class="i" points="64.894 12.98 71.074 12.98 71.074 50.37 64.894 50.37"></polygon> 52 <path d="M97.65,12.361 C97.456,12.361 97.152,12.371 96.753,12.4 C96.121,12.445 95.426,12.525 94.68,12.65 C92.549,13.005 90.412,13.646 88.389,14.657 C82.451,17.626 78.8,23.103 78.8,31.212 C78.8,39.321 82.451,44.797 88.389,47.766 C90.412,48.778 92.549,49.419 94.68,49.774 C95.426,49.898 96.121,49.978 96.753,50.024 C97.153,50.052 97.456,50.062 97.651,50.062 L97.651,43.882 L97.651,46.972 C97.654,43.882 97.628,43.882 97.577,43.88 C97.471,43.876 97.342,43.87 97.194,43.859 C96.692125,43.8219808 96.1922489,43.7615819 95.696,43.678 C94.134,43.418 92.576,42.95 91.153,42.238 C87.24,40.282 84.981,36.893 84.981,31.212 C84.981,25.53 87.24,22.142 91.153,20.185 C92.577,19.473 94.133,19.006 95.696,18.745 C96.1922647,18.6617531 96.6921407,18.6016879 97.194,18.565 C97.342,18.554 97.471,18.547 97.577,18.544 L97.651,18.542 L97.651,12.362 L97.65,12.361 Z" class="c"></path> 53 <path d="M121.445,50.062 C111.205,50.062 102.904,41.761 102.904,31.521 C102.904,21.281 111.205,12.979 121.445,12.979 C131.685,12.979 139.987,21.28 139.987,31.521 C139.987,41.761 131.685,50.062 121.445,50.062 Z M121.445,43.882 C128.272,43.882 133.806,38.348 133.806,31.521 C133.806,24.694 128.272,19.16 121.446,19.16 C114.619,19.16 109.084,24.694 109.084,31.52 C109.084,38.348 114.619,43.882 121.445,43.882 Z" class="o" fill-rule="nonzero"></path> 54 <path d="M158.672068,16.0695 C160.145855,14.4678018 161,12.2882259 161,9.58 C161,5.527 159.087,2.657 156.047,1.137 C155.038,0.633 153.987,0.318 152.942,0.143 C152.577,0.083 152.234,0.043 151.92,0.02 C151.71,0.006 151.542,0 151.42,0 L148.33,0 L148.33,6.181 L151.42,6.181 C151.399,6.181 151.422,6.181 151.479,6.185 C151.62877,6.19641594 151.77793,6.21476897 151.926,6.24 C152.396754,6.31424034 152.853999,6.45744521 153.283,6.665 C154.299,7.173 154.82,7.955 154.82,9.58 C154.82,11.205 154.299,11.986 153.283,12.494 C152.873,12.7 152.402,12.84 151.926,12.92 C151.759,12.948 151.608,12.965 151.479,12.974 C151.472314,12.9744611 151.466106,12.9749222 151.460389,12.9801749 C151.446411,12.9800563 151.432947,12.98 151.42,12.98 L151.42,12.979 L148.33,12.979 L148.33,16.0695 L148.33,19.16 L151.42,19.16 C151.399,19.16 151.422,19.16 151.479,19.164 C151.62877,19.1754159 151.77793,19.193769 151.926,19.219 C152.396807,19.2935574 152.854053,19.4370998 153.283,19.645 C154.299,20.152 154.82,20.934 154.82,22.559 C154.82,24.184 154.299,24.965 153.283,25.473 C152.873,25.679 152.402,25.819 151.926,25.899 C151.759,25.927 151.608,25.944 151.479,25.953 L151.479,25.953 C151.451,25.955 151.421,25.958 151.111,25.958 L151.42,25.958 L148.33,25.958 L148.33,32.138 L151.42,32.138 C151.542,32.138 151.71,32.133 151.919,32.118 C152.234,32.095 152.577,32.056 152.942,3
541.995 C153.987,31.821 155.037,31.506 156.047,31.001 C159.087,29.481 161,26.612 161,22.559 C161,19.8507741 160.145855,17.6711982 158.672068,16.0695 Z" class="n3" fill-rule="nonzero"></path> 55 </g> 56 </g> 57</svg> 58 </a> <p class="footer-slogan">Agencia de diseño UX/UI en Barcelona. Productos digitales para startups y marcas globales. +15 años de experiencia.</p> <p class="footer-copyright">2013â2026 © Atico3 S.C.P<br>Todos los derechos reservados.</p> <p class="footer-legal-links"> <a href="/p/privacy/">PolÃtica de privacidad</a> <span aria-hidden="true"> · </span> <a href="/p/cookies/">Cookies</a> </p> </div> <!-- Col 2: Main pages --> <div class="footer-col footer-col--nav"> <ul> <li><a href="/">Inicio</a></li> <li><a href="/p/services/">Servicios</a></li> <li><a href="/p/subscription/">Precios</a></li> <li><a href="/p/about/">Nosotros</a></li> <li><a href="/p/contact/">Contacto</a></li> </ul> </div> <!-- Col 3: Work (case studies) --> <div class="footer-col"> <p class="footer-col-heading">Proyectos</p> <ul> <li><a href="/case-study/amex/">American Express</a></li><li><a href="/case-study/axa/">AXA</a></li><li><a href="/case-study/nanowallet/">Nanowallet</a></li><li><a href="/case-study/qustodio-kids-ux-ui/">Qustodio</a></li><li><a href="/case-study/startup-genome-ux-ui/">Startup Genome</a></li> </ul> </div> <!-- Col 4: Articles --> <div class="footer-col"> <p class="footer-col-heading"> <a href="/blog/">ArtÃculos</a> </p> <ul> <li> <a href="/blog/astro-para-webs-de-marketing/">Por qué recomendamos Astro para webs de marketing (y cuándo no)</a> </li><li> <a href="/blog/suscripcion-diseno-ux-vs-agencia/">Suscripción de diseño UX/UI vs agencia tradicional: qué modelo rinde más</a> </li><li> <a href="/blog/roi-diseno-ux/">ROI del diseño UX: lo que realmente recuperas al invertir en diseño</a> </li><li> <a href="/blog/diseno-ux-b2b-saas/">Diseño UX para B2B SaaS: por qué es diferente</a> </li><li> <a href="/blog/diseno-ux-ui-startups-saas/">Diseño UX/UI para startups SaaS: qué necesitas en cada etapa</a> </li> </ul> </div> </div> </div> </footer> 59 <a href="/p/contact/" class="float-cta float-cta--dark" id="pageFloatCta">¿Hablamos?</a> </div>
59<script type="module" src="/_astro/Base.astro_astro_type_script_index_0_lang.CzCwk3z-.js"></script>
59</body> </html>
59<script type="module">const e=document.getElementById("pageFloatCta");if(e){let i=function(){const t=document.getElementById("work")||document.querySelector(".page-content");t&&new IntersectionObserver(([s])=>{s.isIntersecting&&e.classList.add("is-visible")},{threshold:.1}).observe(t)},a=function(){const n=e.getBoundingClientRect(),t=n.top+n.height/2;let o=!1;l.forEach(s=>{const c=s.getBoundingClientRect();t>=c.top&&t<=c.bottom&&(o=!0)}),e.classList.toggle("float-cta--dark",!o),e.classList.toggle("float-cta--light",o)};document.getElementById("js-article-floating-cta")&&!localStorage.getItem("floating-cta-dismissed")?document.getElementById("js-floating-dismiss")?.addEventListener("click",()=>i()):i();const l=document.querySelectorAll(".work, .testimonials-section--dark, .cta, [data-dark]");window.addEventListener("scroll",a,{passive:!0}),a()}</script>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.