Wireframe de sitio web online
Agrega los bloques en el orden de la página, arrástralos a su lugar y tira de la esquina para cambiar el tamaño. Haz clic en un bloque para cambiar el texto.
Cómo usarEl boceto de la página, bloque por bloque
Disponible en: 
Wireframe de sitio web online: para qué sirve
Arma el boceto de la página con bloques listos (encabezado, banner, título, texto, imagen, botón, tarjetas, formulario, video, pie de página y caja libre), arrástralos a su lugar y tira de la esquina para cambiar el tamaño, con alineación de 10 en 10 píxeles.
Elige el ancho de computadora (1200 px) o de celular (390 px) y descarga el wireframe en PNG o SVG para aprobarlo con el cliente.
Cómo usar
- Elige el ancho de la página.
- Agrega y arrastra los bloques.
- Descarga el wireframe en PNG o SVG.
Cuándo usar
- Aprobar el diseño con el cliente.
- Planificar una landing page.
- Clase de UX y diseño.
Preguntas frecuentes
¿Qué es un wireframe?
Es el boceto de la estructura de una página, en gris, sin colores, fotos ni textos finales. Muestra dónde va cada cosa (menú, banner, llamados, formulario) para acordar el diseño con el cliente o el equipo antes de dedicar tiempo al diseño visual.
¿Cómo cambio el tamaño de un bloque?
Haz clic en el bloque y arrastra el cuadradito azul de la esquina de abajo a la derecha. Los bloques se alinean de 10 en 10 píxeles para que sea fácil dejar todo derecho. La tecla Supr borra el bloque seleccionado.
¿Puedo hacer una versión para celular?
Sí. Cambia el ancho a Celular antes de empezar: la página queda con 390 píxeles de ancho, como la pantalla de un celular común, y los bloques nuevos ya entran en el tamaño correcto.
¿Es gratis de verdad?
Sí, 100% gratis. Sin registro, sin suscripción y sin límite de uso. Todas las herramientas de Tools123 son gratuitas y funcionan directo en tu navegador.