Hace un tiempo atrás estuve experimentando con transformaciones y transiciones en CSS3 usando para ello Sass. Decidí entonces pasar estos experimentos a un Codepen para compartirlo con la comunidad porque me parecieron intersantes.
Leer másArchivos de Etiquetas: 3D
Animación 3D de un plano usando CSS3
Hace unos días respondí una pregunta en Stack Overflow en la cual se pedía traducir una animación 3D de un plano, realizada con Popmotion a GreenSock.
Respondiendo a dicha pregunta resultó el siguiente código JavaScript que replica el mismo efecto de la animación original, pero usando para ello solo cálculos en JavaScript
Leer másProyecciones isométricas en CSS3
Hace algún tiempo atrás abordamos el tema de las proyecciones isométricas y los cálculos matemáticos usados para transformar cada uno de los planos que las componían. En el presente tutorial veremos cómo crear proyecciones isométricas usando para ello solamente HTML y transformaciones CSS3.
3D en Adobe Illustrator, principales efectos
Este tutorial de trabajar con efectos 3D en Adobe Illustrator lo publiqué en Cristalab a finales de 2008. Aquí lo reproduzco casi fielmente deteniéndome sólo en algunos detalles que creo son precisos para comprender mejor el funcionamiento de algunas herramientas. Para realizarlo se usó en su momento Illustrator CS3, han cambiado un poco la ubicación de los elementos y algunos aspectos específicos, pero se puede seguir este tutorial perfectamente usando Illustrator CS6 o Illustrator CC
Adobe Illustrator tiene varios efectos 3D vectoriales que pueden ser usados para dar un aspecto más realista a nuestras ilustraciones o trabajos, aunque hay que aclarar que si se quiere realizar un modelo 3D lo más fiel a la realidad, lo mejor es recurrir a un programa de modelado 3D como Autodesk Maya o Autodesk 3DSMax. En el presente tutorial mostraré cómo usar dos de estos efectos, en partirular 3D Extrude & Bevel y 3D Revolve.