background preloader

Design procédural et programmation

Facebook Twitter

Interactive Charts with D3.js. Slackmojif. Warning: this frivolous post contains many animated GIFs.

Slackmojif

Don’t load it if you are concerned with bandwidth, or if you don’t want your device to overheat...! If you use the chat app Slack (“where work happens”), you probably already have opinions about it. Is it: a waste of time, a vital tool, a distraction, an addiction, a flexible way to chat, an overcomplicated IRC alternative, a poorly-implemented CPU hog, “not worth the $17 billion ($28/share) it has reportedly been valued at over the past few months.”, worth way more than that? [1], or is it just another application?

(Or all the above?) One aspect of Slack that I like is the system of reactions (adding small static or animated graphics in response to someone’s message). These Slack/emoji/animated GIFs (I’ll call them Slackmojifs, which temporarily solves the GIF pronounciation problem) can be tricky to make. Framed Animations in Luxor.jl are usually built around the idea of a steadily increasing frame number. Spot the difference. Sonic Pi - The Live Coding Music Synth for Everyone. Aerodynamic · mxs. 21 Jan 2016 Également disponible en anglais / also available in english.

Aerodynamic · mxs

Cette série d'articles a pour but d'explorer les relations entre musique et code en se basant sur le morceau Aerodynamic de Daft Punk, qui permet d'exposer différentes manières d'analyser et d'exprimer de la musique sur un ordinateur. Contrairement à la plupart des approches pour générer du son basées sur des logiciels d'édition audio, on va ici se concentrer sur une approche peu commune: en écrivant du code. Au lieu d'ajouter des pistes, des instruments, des samples… sur une timeline classique, on va voir comment exprimer cela en code et comment jouer avec. À la fin de ces pages, vous devriez arriver à quelque chose comme ça: J'espère que ça vous motive à embarquer pour l'aventure, car le grand départ est dans quelques minutes! Vous êtes prêt? b2renger.github. P5js typo by b2renger. A repo to experiment (have fun) with typography using p5*js and Rune.font Interactive demos : Tools Drawing Framework p5xjs this is our drawing library, it's used to setup the page, the canvas, programm the behaviors of animated objects etc.

P5js typo by b2renger

Scribble this is a library for p5xjs and is only used in one experiment. Typographic library Rune Rune is a full framework for graphic design. Rune.font Rune.font is plugin for Rune, it allows us to load a font and convert its outline to Rune.path objects or a series of polygons that we will be able to use withing p5xjs. Rune Madsen, author of the Rune framework, has a great lecture about typography btw : Gui library dat.GUI dat.GUI is lightweight user interface library for js. Hands on tutorial I will not explain in details how p5xjs works, there is plenty of ressources on the web about that. First p5xjs uses two main functions and A lot of the "boilerplate" code will happen in the former, whereas the actual drawing and interaction will happen in the later. 3d. Berenger Recoules (@Berenger_r) Programming Design Systems. “We are now in transition from an object-oriented to a systems-oriented culture.

Programming Design Systems

Here change emanates, not from things, but from the way things are done.” Jack Burnham (1968), Systems Esthetics If I asked you to define the role of a graphic designer, what would it be? The answers to this question can vary widely, but my definition would be something like this: A graphic designer is someone who communicates a piece of content in shape and color. This work can take many forms, but up until recently, it mainly consisted of printed products in the form of posters, business cards, book covers, etc. Today we find ourselves facing new challenges, not because this definition of design has changed much, but because the products we're required to build have changed.

For a field rooted in the fine arts, this has been a difficult transition. This book is structured like an introductory text about graphic design, focusing on the elements of visual design and how they relate to algorithmic design.