NIKLASKNAACK.DE

blog.niklasknaack.de

Niklas Knaack Dev Blog: HTML5 Tutorial: Canvas Pixel Manipulation

http://blog.niklasknaack.de/2016/01/html5-tutorial-canvas-pixel-manipulation.html

HTML5 Tutorial: Canvas Pixel Manipulation. In diesem Tutorial wird beschrieben, wie ihr mit Hilfe vom ImageData. Objekt Zugriff auf die Pixel des HTML5 Canvas Elements. Zuerst schauen wir uns die Grundlagen an bevor wir tiefer in die Materie eintauchen. Voraussetzung für dieses Tutorial ist, dass ihr bereits mit dem Canvas Element vertraut seid und wisst wie ihr damit umzugehen habt. Und natürlich solltet ihr zumindest grundliegende Kenntnisse in JavaScript haben. Hier kommt die Sonne. Var canvas = docum...

blog.niklasknaack.de

Niklas Knaack Dev Blog: 2014/10 - 2014/11

http://blog.niklasknaack.de/2014_10_01_archive.html

Als ich davon gelesen habe konnte ich es kaum glauben. Aber das irrwitzige Unterfangen ist tatsächlich schon ertaunlich weit fortgeschritten. Wurde ein Renderer für das SWF-Dateiformat geschrieben, der ohne Flash Player Plugin in der Lage ist, Flash Inhalte darzustellen. Das Ganze ist im Moment nur ein Experiment, aber immerhin stehen dahinter "Mozilla Research" und eine eigene Community, die sich mit der Entwicklung beschäftigt. Geht´s zur offiziellen Seite und weitere Informationen gibt´s hier.

blog.niklasknaack.de

Niklas Knaack Dev Blog: 2015/11 - 2015/12

http://blog.niklasknaack.de/2015_11_01_archive.html

Ist ein kleines jQuery Plugin. Das dafür da ist kreisförmige Ladeanimationen anzuzeigen die den Ladezustand diverser HTML DOM Elemente in Prozent abbilden. Ziel war es mit möglichst wenig KB auszukommen, bei gleichzeitiger Flexibilität was die Möglichkeiten bei der Darstellung der Ladeanimationen angeht. Die minifizierte JavaScript-Datei. Ist lediglich 2, 74. Schwer und kommt ohne andere und/oder externe JavaScript-Bibliotheken aus. Man kann CircletPreloader auch ohne jQuery. Var loader = new CircletPrel...

blog.niklasknaack.de

Niklas Knaack Dev Blog: Grunt, getting started. Part 1

http://blog.niklasknaack.de/2014/11/grunt-getting-started_10.html

Grunt, getting started. Part 1. Im folgenden Beitrag ( Teil 1. Meines Tutorials) geht es um Grunt. Oder genauer gesagt, um dass Einrichten von Grunt. Unter Windows. Dazu gehören auch Node.js und Git. Kurz ein paar Worte zu Grunt selbst. Grunt ist ein JavaScript Taskrunner. Einmal für ein Projekt eingerichtet, kann euch Grunt sehr viel Arbeit abnehmen. Dazu müsst ihr einfach nur ein Gruntfile. Ihr könnt so also ganze Arbeitsabläufe automatisieren! Ich kann natürlich nicht garantieren, dass der hier aufgez...

blog.niklasknaack.de

Niklas Knaack Dev Blog: 2014/05 - 2014/06

http://blog.niklasknaack.de/2014_05_01_archive.html

Sublime Text 3 and Browser Preview. Wer mit Sublime Text 3. HTML-Code schreiben möchte, der will diesen auch bequem und auf direktem Weg im Browser testen. Ich möchte hier einen einfachen Weg zeigen, wie sich das über ein Build System realisieren lässt. Ganz ähnlich wie in meinem letzten Tutorial zum Thema: „Sublime Text 3 and JavaScript Build System“. Nun solltet ihr eine neue Datei mit dem Namen „untitled.sublime-build“ erzeugt haben, wie ihr im folgenden Screenshot sehen könnt. Am folgenden Ort ab:.

blog.niklasknaack.de

Niklas Knaack Dev Blog: 2013/02 - 2013/03

http://blog.niklasknaack.de/2013_02_01_archive.html

Zuletzt bekannt aus dem Film Looper. An der Seite von Bruce Willis. Als Illustration. Das Bild entstand genau wie die letzten Illustrationen von mir in der Flash IDE. Da sich die Zeichentools von Flash wohl nie weiterentwickeln werden spielt die Angabe mit welcher Flash Version ich gearbeitet habe keine Rolle. Das Bild zeigt Joseph rauchend an einem Strand. Mit der Zigarette und den entsprechenden Klamotten muss man unweigerlich auch an James Dean. Diesen Post per E-Mail versenden. Hier kommt die Sonne.

blog.niklasknaack.de

Niklas Knaack Dev Blog: 2015/12 - 2016/01

http://blog.niklasknaack.de/2015_12_01_archive.html

Und noch ein neues Experiment. Wieder Partikel. Wieder 3D. Dieses Mal, wie der Name schon verrät, geht es um Schwerkraft, oder genauer gesagt, um ein „Gravitational Field“. Die Mathe dahinter ist schon ein Stück weit komplizierter. Aber zum Glück muss man das Rad ja nicht immer neu erfinden. Auf CodePen. Finden sich viele schöne Experimente und Spielereien. Und speziell dieses eine Experiment hier: „Simulating gravity between many entities“. Diesen Post per E-Mail versenden. Auch hierbei handelt es sich ...

blog.niklasknaack.de

Niklas Knaack Dev Blog: 2016/02 - 2016/03

http://blog.niklasknaack.de/2016_02_01_archive.html

SVG 3D Tag Cloud jQuery Plugin. Bisher habe ich SVG (Scalable Vector Graphics). Immer nur als Format zum Austausch zwischen zwei verschiedenen Programmen genutzt. Z.B. um in der Flash IDE gezeichnete Vektor-Grafiken in Illustrator weiter zu verwenden. Fürs Web erschien mir der Einsatz lange Zeit noch ungeeignet, weil SVG von diversen Browsern nicht unterstützt worden sind. Zwar kommen die älteren Browser-Versionen , speziell vom. Gibt es generell schon recht viele, aber soweit meine Recherche ergeben hat...

blog.niklasknaack.de

Niklas Knaack Dev Blog: Johnny Depp's favorite roles - animated Gif

http://blog.niklasknaack.de/2016/04/johnny-depps-favorite-roles-animated-gif.html

Johnny Depp's favorite roles - animated Gif. Da im Moment animated Gifs von Schauspielern in ihren bekanntesten Rollen total angesagt zu sein scheinen (Ein gutes Beispiel ist z.B. dieses animated Gif von Leonardo DiCaprio. Wollte ich mich auch mal an diesem Thema versuchen. Rausgekommen ist dabei diese Animation von Johnny Depp. Mit neun seiner bekanntesten, bzw. markantesten Rollen. Die Einzelbilder habe ich mit Animate CC (Früher Adobe Flash) gezeichnet ,. Diesen Post per E-Mail versenden. 169; 2006-20...

blog.niklasknaack.de

Niklas Knaack Dev Blog: Where am i

http://blog.niklasknaack.de/2016/04/where-am-i.html

In letzter Zeit habe ich sehr viel mit Three.js. Herumexperimentiert, aber ich habe es nie geschafft zumindest mal einen Teil der Experimente hier zu veröffentlichen. Das wollte ich ändern und herausgekommen ist dabei „Where am i“. Im Prinzip eine sehr primitive Variante von Google Earth. Umgesetzt mit Threejs und OpenStreetMap. Mit Hilfe von „Where am i“ könnt ihr euch anzeigen lassen wo ihr gerade auf der Erde seid. Dazu stehen euch drei Methoden zur Auswahl. Planet Texture Map Collection. Kollektion a...