Aprende Java Aprende Php Aprende C++ Aprende HTML 5 Aprende JavaScript Aprende JSON Aprende MySQL Aprende SQLServer Aprende Visual Basic 6 Aprende PostgreSQL Aprende SQLite Aprende Redis Aprende Kotlin Aprende XML Aprende Linux VSC Aprende Wordpress Aprende Laravel Aprende VueJS Aprende JQuery Aprende Bootstrap Aprende Netbeans Aprende Android
Sigueme en Facebook Sigueme en Twitter Sigueme en Instagram Sigueme en Youtube Sigueme en TikTok Sigueme en Whatsapp
Home / Noticias / Convierte tus dibujos web en Código HTML

Convierte tus dibujos web en Código HTML

Por jc mouse viernes, enero 3, 2020

Sketch2Code es un proyecto de Microsoft el cual usa IA (Inteligencia Artificial) para transformar el diseño de una interfaz de usuario dibujada a mano en un código de marcado HTML válido. El proyecto es de código abierto disponible en GitHub y que puedes descargar aquí. También tiene disponible una herramienta online en sketch2code.azurewebsites.net. Obviamente puedes descargar el código generado a tu computadora.

diseño web

Conoce el proceso

El proceso de transformación de un dibujo a HTML es la siguiente:

  1. Primero, el usuario carga una imagen.
  2. Un modelo de visión personalizado predice qué elementos HTML están presentes en la imagen y su ubicación.
  3. Un servicio de reconocimiento de texto escrito a mano lee el texto dentro de los elementos.
  4. Un algoritmo de diseño utiliza la información espacial de todos los cuadros delimitadores de los elementos predichos para generar una estructura de cuadrícula que se adapte a todos.
  5. Un motor de generación de HTML utiliza todos estos datos para generar un código de marcado HTML que refleja el resultado.

proceso de IA para maquetar webs

Conclusiones

maquetado web con IA

Es una buena iniciativa, pero aun la IA se encuentra en pañales como para poder sacar resultados satisfactorios y eso que lo probé con diseños semi complejos hasta los más sencillos usando imágenes fotografiadas e imágenes generadas con herramientas mockup y aún así el maquetado deja mucho que desear.

enjoy!!!

Tags

Artículos similares

Componente swing jcMousePanel v1.6.9

Agregar una imagen a un jpanel o a un jframe no es complicado pero para un programador novato puede convertirse en todo[...]

Tradukisto: Conversión de dinero en palabras

Tradukisto es una biblioteca para Java 8 creada para convertir números enteros o cantidades de dinero a sus equivalentes[...]

Crea tours interactivos para tus sistemas web

Driver.js es una librería Open Source de JavaScript ligera y altamente personalizable, esta escrita en TypeScript no tie[...]

Funny Sounds: Sonidos divertidos para celular

En este tutorial «Android Bolivia» construiremos nuestra propia aplicación para molestar a los amigos con sonidos divert[...]

¿Quieres llorar? conoce que es y como protegerse de WannaCry

Este 12 de Mayo de 2017 se produjo un ataque masivo mundial del ransomware WannaCry  el  que afecto a más de 200000 comp[...]

Crea tu lector de códigos QR

En este post desarrollaremos una aplicación que nos permitirá leer un código QR y capturar la información que contiene y[...]