Cristalab |
- Fotomontaje estilo cine de terror en Photoshop
- Uso de redistribute en enrutamiento EIGRP
- Character Set y animación dividida en Maya
- Dibujar y animar Mangekyou Sharingan Izuna con CSS3
| Fotomontaje estilo cine de terror en Photoshop Posted: 11 Jul 2012 08:30 AM PDT Aprende a crear este montaje con Photoshop, donde podrás crear una escena de miedo como si fuera una portada de película de terror. Aquí les dejo una muestra del resultado final: 
|
| Uso de redistribute en enrutamiento EIGRP Posted: 11 Jul 2012 08:15 AM PDT De igual forma que aprendimos en un videotutorial anterior de Redes a redistribuir información de enrutamiento estático dentro de Rip, seguiremos trabajando con redistribute, para comprobar cómo se puede usar esta misma funcionalidad con otros protocolos dinámicos, como EIGRP, inyectando en sus actualizaciones las rutas de Rip y viceversa, gracias a la inclusión de un router fronterizo, que manejará ambos sistemas, en una porción nueva de topología sobre la que añadiremos el direccionamiento adicional. Saludos.
|
| Character Set y animación dividida en Maya Posted: 13 Jun 2012 08:45 AM PDT En un videotutorial anterior de 3D Maya, hicimos una introducción al uso de la herramienta Character Set, que nos ofrecía la posibilidad de unificar canales en un grupo personalizado para agilizar la asignación de animación a través de keyframes, pero dejamos de lado la verdadera potencia de este modulo, usado para dividir los clips de animación en bloques independientes, que podremos posteriormente mezclar y ajustar como mejor nos convenga. Para el ejemplo, comprobaremos el resultado de la creación de clips separados en nuestro personaje, haciendo uso del módulo Trax y las herramienta disponibles, para edición de cada canal y sus asignaciones dentro del nodo. Saludos.
|
| Dibujar y animar Mangekyou Sharingan Izuna con CSS3 Posted: 13 Jun 2012 07:43 AM PDT Como había dicho al final de mi tutorial anterior, hoy diseñaremos un Mangekyō Sharingan con CSS3, específicamente el de Izuna. Para realizar esto necesitan el código HTML y CSS del articulo anterior y añadir prefixfree. A continuación una imagen de lo que que se desea lograr:  Código HTML: Código : <!DOCTYPE html> <html lang="es"> <head> <meta charset="utf-8"/> <title>Mangekyou Sharingan Izuna CSS3</title> <!--Hoja de estilos del artículo anterior--> <link rel="stylesheet" type="text/css" media="all" href="sharingan.css"/> <!--Hoja de estilos para crear el Mangekyou Sharingan de izuna--> <link rel="stylesheet" type="text/css" media="all" href="izuna.css"/> <script type="text/javascript" src="prefixfree.min.js"></script> <body> <!--Borde negro exterior--> <div id="sharingan"> <!--Iris --> <ul> <!--Pupila--> <li> </li> <!-- Anillo que completa al iris--> <li class="ring"> </li> <!--Aspas del Mangekyō Sharingan --> <li class="aspa sup"> <p> </p></li> <li class="aspa der"> <p> </p></li> <li class="aspa izq"> <p> </p></li> </ul> </div> </body> </html> Ahora el CSS,recuerden que éste código depende del código del artículo anterior (exceptuando la animación), luego que lo tengan (hoja de estilos "sharingan.css") deben añadir en la hoja de estilos "izuna.css" lo siguiente: Código : /*---------------Izuna---------------*/ /*Color de fondo del iris y la pupila*/ ul,ul:hover,ul li:first-child { background: #A00; } /*Para que la pupila quede por encima de los demás elementos*/ ul li:first-child { z-index: 5; } /*Eliminando la sombra del anillo y escalándolo a 1.3*/ .ring { box-shadow:none; transform: scale(1.3); } /*Escalando a 1.4 el .ring al hacer ul:hover con una pequeña transición en la propiedad transform*/ ul:hover .ring { transition:transform 0.1s ease-in; transform:scale(1.4); } .ring,.aspa p { background: #000; } /*Quitando los bordes redondeados y las transformaciones a .aspa,.aspa p, es decir vuelven a su estado original*/ .aspa,.aspa p { border-radius: 0; transform: none; } /*Ésta regla CSS para centrar las puntas de las aspas con el .ring escalado*/ .aspa p { left: 0; } /*Las aspas tendrán una anchura de 57px y... */ .sup,.der,.izq { width: 57px; } /*Luego cada aspa será reposicionada,y se rotaran .der e .izq para que queden en el angulo correcto con respecto a .ring*/ .sup { left: 51px; top: -168px; } .der { left: 137px; top: -69px; transform: rotate(24deg); } .izq { left: -18px; top: -79px; transform: rotate(58deg); } /*.... y las puntas una altura de 57px */ .sup p,.der p,.izq p { height: 57px; } /*Por si acaso,recuerda inhabilitar las animaciones*/ ul:hover .sup,ul:hover .der,ul:hover .izq { animation:none; }Y así finaliza éste tutorial. El trabajo terminado fue testeado en Chrome, Firefox y Opera. Pueden acceder a un ejemplo desde aquí. P.S: Culminaré con esta "ronda otaku" con el Rinnegan, que con algunos cambios en el CSS del primer artículo se puede lograr de forma sencilla.
|
| You are subscribed to email updates from Cristalab To stop receiving these emails, you may unsubscribe now. | Email delivery powered by Google |
| Google Inc., 20 West Kinzie, Chicago IL USA 60610 | |
No hay comentarios:
Publicar un comentario