P5 – die Programmiersprache für Designer, Künstler und Einsteiger

P5 – die Programmiersprache für Designer, Künstler und Einsteiger

P5 ist eine einfache Programmiersprache, welche zum Werkzeugkasten von Generative Design gehört. P5 wird verwendet, um mit Hilfe von Code Visualisierungen, Ideen, Prototypen oder Zeichnungen (Sketches) für den Browser zu programmieren. Die Javascript-Bibliothek eignet sich für Designer, Künstler, Programmiereinsteiger und Lebenskünstler. Im ersten Semester der Interaktiven Medien des Studiengangs Multimedia Production verwenden wir P5 als Einführung in die Programmierung. Aus diesem Grunde entsteht in den nächsten Wochen unter der URL http://p5js.ch/ ein Einsteiger-Tutorial. P5 wurde von Lauren McCarthy und Dan…

Weiterlesen Weiterlesen

CSS Grid Tutorial

CSS Grid Tutorial

CSS Grid eignet sich zur Erstellung komplexer Layouts für Web-Sites. Seit dem 17. Oktober 2017 unterstützen alle Browser die Befehle. Unser Tutorial gibt eine Einführung in die CSS Grids. CSS Grid sind eine Spezifikation des W3 Konsortiums, welche das Layouten mit Spalten und Zeilen im Browser regelt. Seit Oktober 2017 unterstützen alle Browser die Spezifikation. Diese wird überarbeitet, ein Teil der Befehle wird in Zukunft in das neue Box Alignment Module Level 3 verlagert. Zum Glück gibt es auch die…

Weiterlesen Weiterlesen

One-Pagers im Eye-Tracking Test

One-Pagers im Eye-Tracking Test

One-Pagers sind, wie der Name schon sagt, Webseiten die aus einer einzigen Seite bestehen. In der Regel befinden sich sämtliche Informationen auf der Startseite. Lediglich Informationen wie Impressum, AGBs oder Kontakt sind häufig ausgegliedert.  Ein One-Pager ist somit vergleichbar mit einer Straße, die man auf- und ablaufen kann. Abzweigungen gibt es nicht. Oft liegt der Seite ein Parallax-System zu Grunde. Das heisst, dass der eigentliche Inhalt vor einem Hintergrundbild liegt, welches sich mit dem Scroll ebenfalls verändert. Im Laufe der letzten Jahre…

Weiterlesen Weiterlesen

Moderne Web Architektur

Moderne Web Architektur

Mathias Biilmann stellte an der diesjährigen Smashing Conference in Freiburg eine neue Web Architektur vor: JAMstack. Man spricht nicht länger über Client-Server Architektur, Betriebssysteme, spezifische Webserver, backend Programmiersprachen oder Datenbanken, sondern über JavaScript: Any dynamic programming during the request/response cycle is handled by JavaScript, running entirely on the client. This could be any frontend framework, library, or even vanilla JavaScript. APIs: All server-side processes or database actions are abstracted into reusable APIs, accessed over HTTP with JavaScript. These can be…

Weiterlesen Weiterlesen

Google ARCore als Antwort auf Apples AR-Kit.

Google ARCore als Antwort auf Apples AR-Kit.

Im Juni kündigte Apple an der Worldwide Developers Conference das Augmented Reality Software Development Kit ARKit für iOS11 (iPhone und iPad) an. Zwei Monate später kommt mit ARCore die Antwort von Google. Nebst dem Android Studio stehen Unity und Unreal als Entwicklungsumgebung zur Verfügung. Die breite Palette der Editoren ist der erste geschickte Schachzug von Google. Unity ist auch die de facto Entwicklungsumgebung für die Microsoft Hololens. Alle drei Editoren geben die AR Applikationen für unterstützte Android Geräte (Android 7…

Weiterlesen Weiterlesen

Fit für Fitty?

Fit für Fitty?

Die coole Javascript-Bibliothek Fitty skaliert Text grösser oder kleiner, bis dieser in einen Container passt. Es ist das ideale Werkzeug, um Titel für einen fix gegebenen Bereich automatisch zu vergrössern oder zu verkleinern.

fr – die neue CSS Einheit

fr – die neue CSS Einheit

Das Layouten mit CSS ist keine einfache Angelegenheit. Zum Glück sind die Flex Boxes und CSS Grid jetzt von allen wichtigen Browsern unterstützt. Das Bestimmen der Breiten der Container war trotzdem noch Handarbeit. Zum Glück gibt es jetzt die Einheit fr (Fraction). fr bedeutet einfach «Rest», was übrig bleibt. Das heisst, der Browser berechnet die Breite selbst in Abhängigkeit des Viewports, der Paddings und Margins. Im folgenden 13-spaltigen Layout soll die Navigation 4 Einheiten, die Inhalte je 1 Einheit breit…

Weiterlesen Weiterlesen

Comeback von Google Glass

Comeback von Google Glass

Die vor rund zwei Jahren als Produkt für den Verbraucher gescheiterte Datenbrille Google Glass ist jetzt für den Einsatz in Unternehmen angepasst worden. Die Details finden sich in einem Artikel im US-Magazin «Wired». Google hat mit der neuen Brille die Geschäftskunden ins Visier genommen. Das zeigt auch im Namen Glass Enterprise Edition.

3D im Web

3D im Web

Dank x3dom, einer Entwicklung der Fraunhofer-Gesellschaft ist das Erstellen und Einbetten von 3D Grafiken im Browser ein Kinderspiel. Im HTML-Code werden einfache Befehle für das Erzeugen von 3D Objekten, Texturen etc. eingegeben. Die Spezifikation erlaubt auch das Einbinden von Video- und Audiodateien sowie das Programmieren von Interaktivität. Der Code für obiges Beispiel ist extrem einfach und verständlich: Weitere Beispiele Veränderter Viewport und Lichtquelle Beispiel mit Bild und Video Interaktivität Animation Im Live Beispiel lässt sich der Inhalt mit der Maus…

Weiterlesen Weiterlesen

SI Magazine

SI Magazine

Im regelmässig erscheinenden SI Magazine erschien kürzlich ein Artikel von Ines Jansky mit dem Titel «SciencEmotion | Technik für Jugendliche». Darin wird die Frage aufgeworfen, wie es gelingen könnte, Jugendliche im Alter von 12-21 für technische Themen und Berufswege zu begeistern. Das Projekt sciencEmotion der HTW Chur geht, auf Basis von eigenen neuen wissenschaftlichen Untersuchungen, direkt auf Jugendliche zu und bezieht sie in die Lösung ein. Im Januar wurde im SI Magazine der MMP Studiengang vorgestellt, kurze Zeit später erschien…

Weiterlesen Weiterlesen