De Figma a web o aplicación móvil
Sus diseños de Figma convertidos en código limpio y responsive: HTML y CSS, React, Next.js o un tema de CMS.
Características principales
- Páginas o componentes desarrollados
- Código en un repositorio de su propiedad
- Resultados de pruebas responsive y de navegadores
- Readme con notas de instalación y despliegue
- Aquí no se paga nadaPrimero recibe un presupuesto por escrito. Sin pago, sin compromiso.
- Vendido y entregado por GRADAXUn contrato y un equipo, quienquiera que haga el trabajo.
- Sus datos se quedan en la UENada se traslada fuera de la unión para su tratamiento.
Sobre este servicio
Tiene los diseños terminados y necesita que se implementen exactamente. Convertimos archivos de Figma en código front-end responsive que coincide con el diseño en cada punto de ruptura, con el stack que elija: HTML y CSS puros, React, Next.js o un tema de WordPress o Shopify. Los componentes se construyen para reutilizarse y los huecos del diseño se señalan antes de suponer nada.
Donde los diseños no dicen nada
Los archivos de Figma muestran cómo se ve una página en unos pocos anchos fijos, normalmente escritorio y móvil. Rara vez muestran qué ocurre entre medias, qué hace un botón al pasar el cursor, cómo queda una tarjeta con un título muy largo, qué aparece cuando un formulario da error o mientras carga el contenido. Esas lagunas son donde la implementación se aleja del diseño.
Revisamos el archivo antes de construir y enumeramos cada carencia que encontramos. Algunas las resolvemos con valores por defecto sensatos que siguen la lógica del diseño. Por otras preguntamos, porque equivocarse y rehacer cuesta más que una pregunta breve. El resultado es un desarrollo que coincide con el diseño donde este es explícito y respeta su intención donde no lo es.
Primero componentes, después páginas
Los buenos archivos de diseño se construyen con componentes: botones, tarjetas, navegación, campos de formulario. El buen código también debería. Construir página a página, copiando y retocando elementos sobre la marcha, produce un sitio donde cada botón es ligeramente distinto y un cambio de diseño obliga a editar decenas de sitios.
Construimos primero los componentes compartidos, igualándolos a los componentes de Figma, y luego ensamblamos las páginas a partir de ellos. Un cambio en el estilo del botón actualiza todos los botones. Se pueden crear páginas nuevas a partir de piezas existentes. El marcado es semántico y accesible, las imágenes están optimizadas y las fuentes cargan de forma eficiente, porque una página perfecta al píxel que tarda seis segundos en cargar en un móvil no es una buena construcción.
Especificaciones
- Categoría
- Automatización y datos
- Precio
- 290 € a 1050 €
- Tamaños
- Pequeña (Página de aterrizaje), Mediana (Desarrollo multipágina), Grande (Desarrollo con CMS)
- Plazo de entrega
- 3 días a 5 semanas
- Facturado
- Pago único
- Qué obtiene
- 4 elementos, todo incluido en el precio
- Qué necesitamos de usted
- Archivo de Figma con acceso de visualización y Dev Mode, Su stack preferido y dónde se alojará, Diseños para móvil, o permiso para adaptarlos con criterio
- Lo compran sobre todo
- SaaS, Agencias y estudios, Startups, Comercio electrónico
- Vendido y entregado por
- GRADAX, un contrato y un solo equipo
- Dónde se tratan sus datos
- Unión Europea
Qué obtiene
Todo lo que aparece abajo está incluido en el precio. Nada de esto es una mejora.
- Páginas o componentes desarrollados
- Código en un repositorio de su propiedad
- Resultados de pruebas responsive y de navegadores
- Readme con notas de instalación y despliegue
Qué cambia
- Páginas que coinciden con el diseño de Figma en anchos de escritorio, tableta y móvil
- Componentes reutilizables que reflejan los componentes del archivo de diseño
- Marcado accesible: HTML semántico, navegación por teclado, texto alternativo
- Páginas de carga rápida, con imágenes optimizadas y fuentes cargadas de forma eficiente
Compare los planes
El precio estándar de cada tamaño. Los extras se presupuestan al lado, no escondidos tras una llamada.
| Incluido | Página de aterrizaje290 €3 a 5 días laborables | Desarrollo multipágina500 €2 a 3 semanas | Desarrollo con CMS1050 €3 a 5 semanas |
|---|---|---|---|
| Una página, responsive | Incluido | Incluido | Incluido |
| HTML y CSS o un framework | Incluido | Incluido | Incluido |
| Formularios conectados | Incluido | Incluido | Incluido |
| Pruebas en navegador | Incluido | Incluido | Incluido |
| Todo lo de Página de aterrizaje, hasta seis plantillas | No incluido | Incluido | Incluido |
| Biblioteca de componentes | No incluido | Incluido | Incluido |
| Animaciones e interacciones a partir del diseño | No incluido | Incluido | Incluido |
| Comprobación de accesibilidad | No incluido | Incluido | Incluido |
| Todo lo de Desarrollo multipágina, hasta doce plantillas | No incluido | No incluido | Incluido |
| CMS conectado: WordPress, Shopify, Sanity o similar | No incluido | No incluido | Incluido |
| Carga de contenido para las páginas de lanzamiento | No incluido | No incluido | Incluido |
| Despliegue y 14 días de correcciones | No incluido | No incluido | Incluido |
| Añadir al presupuesto |
Añada lo que necesite
Choose the size
Añada lo que necesite
Su total€500
El precio estándar, más lo que usted añada. Confirmado por escrito antes de empezar; no se cobra nada hasta que lo acepte.
Cómo funciona
Revisión
Diseño revisado en busca de estados ausentes y puntos de ruptura antes de la implementación.
Componentes
Piezas compartidas construidas primero: botones, tarjetas, navegación, formularios.
Páginas
Páginas montadas a partir de componentes y ajustadas al diseño.
Prueba
Comprobado en navegadores y dispositivos, y después entregado.
Preguntas
¿Puede maquetar a partir de un diseño que no tiene versión móvil?
Sí. Adaptamos con criterio y le mostramos las pantallas móviles clave antes de construir todas.
¿Será pixel-perfect?
Se ajustará fielmente al diseño en los anchos para los que se diseñó. Entre esos anchos, las maquetas fluyen como pretende el diseño; le avisamos de cualquier punto ambiguo.
¿Utilizan herramientas automáticas de diseño a código?
Escribimos el código a mano. Las exportaciones automáticas tienden a generar código inflado y difícil de mantener, que resulta caro de modificar después.
Búsquedas relacionadas
Trabajos relacionados
Pago únicoCreación de sitio web en WebflowUn sitio Webflow de diseño personalizado con un CMS que su equipo puede editar e interacciones que se mantienen rápidas.from 420 €
ScopedSprint de diseño de UIPantallas diseñadas y prototipadas en dos semanas, listas para construir.from 1800 €según alcance
Pago únicoApp web full-stackUna aplicación web a medida con su propia base de datos, inicios de sesión y panel de administración, creada y desplegada.from 420 €
Pago únicodesarrollo de apps AndroidAplicaciones Android nativas en Kotlin, desarrolladas según las directrices de Google y publicadas en Google Play.from 420 €
Pago únicoDesarrollo de apps para iOSUna app nativa para iPhone en Swift, desarrollada según las directrices de Apple y presentada a la revisión del App Store.from 830 €
Pago únicoDesarrollo de plantilla de email HTMLCorreos HTML codificados a mano que se muestran correctamente en Outlook, Gmail, Apple Mail y modo oscuro.from 290 €
¿Ningún plan encaja?
Algunos trabajos tienen forma propia. Primero los analizamos y los presupuestamos por escrito; la llamada de análisis no tiene coste.