eleqtriq

Updated: traqball 2.0

traqball 2.0Finally updated traqball.js, my little js lib for gimbal lock free 3d rotation to version 2.0. Impress friends and family with deceleration, easier configuration and multiple trackballs on a webpage.

more

Fresh from the Lab: CSS3 Text-Warping

HTML text warping

My latest experiment: this little web application will make it easy for you to "warp" HTML-text. Create native text that follows the flow of an arbitrary bezier path or wrap it around a circle like you do in Illustrator.

more

Showcase: Pop-Up Book in HTML and CSS

Pop-up book

A little showcase, using all the latest CSS-stuff that makes CSS so much fun to work with these days: animations, transitions, transformations, 3D....

more

Natural Object-Rotation with CSS3 3D

CSS3 3D Object-Rotation

I finally found some time to finish the last part in my series on CSS3 3D tutorials. We will learn how to build and style a 3-dimensional packshot with noting more than a few lines of HTML/CSS and then add some Javascript-magic to make it a freely rotatable object. Works even on iPad and iPhone.

more

Introducing Spritebaker

Thumb

For some time now I had planned to build an online app that makes creating data URI-sprites in CSS less painful. As a special feature I wanted it to be pure HTML/Javascript...

more

The Matrix Revolutions (CSS 3D – 2)The Matrix Revolutions (CSS 3D – 2)

Thumb

Im 2. Teil meiner Serie über 3D CSS-Transformationen geht es nun um die Matrix. Was hat es mit diesem geheimnisvollen Ding auf sich und wie kann man es einsetzen?

Thumb

The second part in this mini-series on css 3d covers matrix-transformations. What is this mysterious thing and how can we use it?

more

CSS 3D Transforms verstehen (CSS 3D – 1)Understanding CSS 3D Transforms (CSS 3D – 1)

Thumb

Ich hatte die letzten Tage eine Menge Spaß dabei, mit CSS 3D-Transformationen herumzuspielen. Diese kleine Miniserie soll eine kurze Einführung sein für alle, die sich schonmal für das nächste Webkit-Update in Stellung bringen wollen.

Thumb

I had a lot of fun last week playing with the new CSS 3D Transforms. This short mini-series is intended to help developers get ready for the next generation of Webkit-browsers.

more

Kubische Bezierkurven in FlashCubic Bezier in Flash

Thumb

Ein Nachteil von Flash ist die Tatsache, dass es nicht möglich ist in Flash kubische Bezierkurven zu zeichnen. Hier möchte ich eine Technik vorstellen, diese Art von Kurven mit hoher Präzision in Flash darzustellen. Sie nutzt das fl.motion package und ist eine Alternative zur weit verbreiteten "Generischen Mittelpunktsnäherung".

Thumb

One drawback of flash is its inability to display cubic bezier curves. This is my technique for drawing highly precise cubic bezieres. It makes use of the fl.motion package and is an alternative to the widely used generic-midpoint-approximation.

more

Canvas vs. SVG vs. FlashCanvas vs. SVG vs. Flash

Thumb

HTML 5 ist auf dem Vormarsch und damit einher geht für uns Designer die Frage, welche Darstellungsmethoden für komplexe Animationen am besten geeignet sind, Canvas, SVG oder Flash? Dieses Experiment soll helfen, ein Gefühl für die Geschwindigkeit und Responsivität der Rendermethoden zu bekommen.

Thumb

HTML5 is gaining momentum and we designers increasingly often have to decide which method to choose for rendering complex animations in the browser: canvas, svg or flash? Maybe this experiment can help to get a feeling for speed and responsiveness of the different rendering-methods.

more