Community post

Tutorial Dibujando a Willy Wonka

Hola Stemians Espero estén muy bien, en este post quiero traerles el proceso de creación de este dibujo del personaje de Willy Wonka, la finalidad de este y quizá próximos vídeos es que todos podamos aprender a usar herramientas como html y css, asi que espero que puedas disfrutar del proceso donde explico como crear este dibujo.

Quiero agregar que hacer este dibujo me tomo bastante trabajo realizarlo, por lo que el vídeo original demora mucho y he decidido acelerarlo para que puedas disfrutar del proceso.

Proceso.

Tamaño del lienzo.

https://cdn.steemitimages.com/DQmZYtdB2nZaKCjdN5n6GRBtgMFrvFBM5t3AUQPa2oEnXKL/image.png

Como explico en el vídeo lo primero que debo tener son las herramientas para trabajar y crear mi dibujo en este caso son un editor de texto yo utilize Visual Studio Code, recomiendo que en el escritorio de tu maquina crees una carpeta, yo le he puesto por nombre willywonka y inicio importes ese carpeta.

Una ves creada la carpeta debes crear los archivos, como puedes apreciar en parte inferior del capture allí puedes crear los nuevos archivos index.html y style.css, debes linkear los estilos como lo explico en el vídeo.

Teniendo ya los archivos y la estructura creada con los div correspondientes los valores que he utilizado para darle el tamaño al lienzo es width: 350px;, height: 500px;.

El Sombrero.

https://cdn.steemitimages.com/DQmaTMcF7CJ3wcuKcBofkciYWTMTrJVHnX76kKhwRBEuJTe/image.png

Luego de aplicar el reset, procedo a comenzar por el la parte superior dando los estilos correspondientes para que tome la forma correcta y la posición en que centrare el dibujo.

Para Cada contenedor le doy el tamaño que requiere y el color correspondiente para que todas las partes concuerden esos mismos valores hay que tenerlos en cuenta para ir dándole proporciones iguales a el resto del cuerpo y no quede deforme.

El rostro

Luego de tener lista la zona del sombrero lo mas difícil es el rostro ya que hay que cuidar los detalles, como puedes ver las proporciones son similares a las del sombrero.

https://cdn.steemitimages.com/DQmeao3nSQrZfiEqEhqRuy8t1ZA25otgHHhx4pnzZ4nvvEt/image.png

El Cuerpo.

Lo siguiente que me todo literal un día realizar fue el cuerpo ya que hay muchos detalles también, por lo que es necesario ir probando valores he ir corrigiendo.

https://cdn.steemitimages.com/DQmRpTQ67EwKwWaDjdg3fVTTFwTTCPW9XgRBEGcv9KZbs7n/image.png

Final

Lo ultimo es la parte inferior y agregar detalles en la ropa para que todo finalizara como se esperaba.

![](![](https://cdn.steemitimages.com/DQmWfmeDBBaC67epicqrK5vmUKky9bB7tzX9gaZKfw85n4e/image.png)) ## Mira El Proyecto Aquí...!!!

Gracias Por haber llegado al final del vídeo y del post en general espero te halla gustado y disfrutado del proceso de creación de este dibujo que aunque es con código y de manera digital también requiere de esfuerzo y conocimiento déjame tu apoyo votando mi post, me ayudaría bastante a seguir motivado y no dejes de seguirme para ver mas contenido similar.

https://cdn.steemitimages.com/DQmRs35Ha3eMHq4RjxA6xxo6kdqye1pd1zZiTtjNPQEspXT/bloggif_5c74175d96014.gif

Información Sobre el Vídeo.

✅ Repositorio: Ir al Repositorio.
✅ Descargar Archivos: Descargar Aquí

Herramientas Utilizadas

✅ https://i.imgur.com/8F7ToMc.pngTecnología: HTML
✅ https://i.imgur.com/UduNhCt.pngTecnología: CSS
✅ https://i.imgur.com/LHBuGAw.pngEditor: Visual Studio Code.
✅ https://i.imgur.com/l1C8XiX.png Para grabar y editar: Cantasia Studio
✅ https://i.imgur.com/KTWCUoH.png GIT

Musica de fondo

✅ Janji - Heroes Tonight (feat. Johnning) [NCS Release]
✅ Elektronomia - Sky High [NCS Release]
✅ Different Heaven - Nekozilla [NCS Release]

https://i.imgur.com/VG4FaL9.png@JuanJose_xDD https://i.imgur.com/07JLMGk.png @JuanJosexDD *

Nota: El autor del Código es @JuanJosexDD7 El materia lo puedes descargar En mi Repositorio de GITHUB, es completamente Open Source Initiative (OSI) por que el material puede ser Usado por terceros, Estudiado, Copiado y Distribuir las Copias Modificadas de igual manera la música de fondo no tienen derecho de autor pero se reconoce sus creadores.

Espero hayas disfrutado de este material, hazme saber tu opinión en los comentarios, no olvides votar Así podre conocerte y visitar tu blog y me ayudaría a seguir compartiendo más material de utilidad.

https://steemitimages.com/0x0/https://i.imgur.com/sce5p7N.gif Fuente

▶️ DTube
▶️ IPFS