SlideShare une entreprise Scribd logo
1  sur  19
Télécharger pour lire hors ligne
The World of
Digital Creatures
1. Contexte
2. Brief
3. Les comportements
4. Contraintes
5. Méthodologie & suivi
6. Code et attribution
7. Documenter son code : les commentaires
8. Documenter son code : citer les sources
9. Document et attendus de rendu
10. Planning
11. Grille de notation
12. Références
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Digital lab : brief
—
«The World of Digital Creatures» est une expérience interactive,
sonore et visuelle explorant le champs des possibles du creative
coding.
Présentée sous la forme d’une installation interactive exposée dans
les locaux d’e-artsup, l’installation propose de plonger au cœur d’un
environnement peuplé de créatures digitales reactives au son et
interagissant avec son public.
«The World of Digital Creatures» est un exercice de cours inspiré
de l’installation «Communion : Celebration of Life» réalisée par
Field en 2011.
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Digital lab : brief
—
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Brief :
Il vous est demandé de réaliser chacun une créature digitale pouvant peupler cet environnement réactif au son.
Vos créatures devront respecter les contraintes suivante :
1. Être issue d’une recherche graphique itérative continue tout au long du semestre
2. Posséder 3 comportements propres (ex : sauter, tourner, grossir…)
3. Posseder 3 comportements réagissant au son (ex : changer de couleur, cheveux qui poussent…)
4. Posséder un comportement interagissant avec l’utilisateur. (ex : se dupliquer, changer de forme…)
Digital lab : brief
—
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Les comportements :
1. Les 3 comportements propres (ex : sauter, tourner, grossir…)
Les 3 comportements propres sont des 3 façons dont votre créature se comporte au naturel.
Ils peuvent être de natures variées telles que bouger les oreilles, cligner des yeux, se dandiner…
Ces comportements pourront s’effectuer constamment (en boucle), de manière régulière (toute les 4 secondes
par exemple) ou de manière aléatoire (toute les x seconde). Ils pourront s’effectuer ensemble, successivement
ou selon un ordre aléatoire. Vous pourrez choisir de les activer ou non si votre créature réagit ou interagi avec
son environnement ou avec l’utilisateur.
2. Posseder 3 comportements réagissant au son (ex : changer de couleur, cheveux qui poussent…)
Ces 3 comportements sont les manière dont votre créature réagira au son (basse, medium et aigue).
Il peuvent être de natures variées. Vous fixerez vous même les paliers à partir desquels votre créature réagira.
Vous vous appuierez du cours sur la reaction au son et de l’objet d’analyse sonore fourni.
3. Posséder un comportement interagissant avec l’utilisateur. (ex : se dupliquer, changer de forme…)
Il s’agit du comportement que possède votre creature lorsque l'utilisateur interagit avec l’installation.
L’utilisateur pourra interagir de 4 manières différentes, vous en choisirez une à laquelle votre creature réagira.
Les 4 interactions différentes seront définies en cours et avec la classe. Elle pourront être par exemple :
Réagir des tweets, aux mouvement de l’utilisateur, à sa main, à la distance face à l’installation, aux visages...
Digital lab : brief
—
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Contraintes:
1. Taille du sketch : 720 × 720 pixels
2. Format du sketch : 2D
3. 8 couleurs maximum, dégradé possible.
4. Votre créature devra posséder une taille responsive sur base de variables largeur hauteur (pas de
hardcoding)
5. Chacune de vos itération sera enregistrer sous le nom suvant : AnneeMoisJour_WDC_NumeroDeIteration.
pde
6. L’ensemble de votre code sera documenté (cf section «documenter son code»)
7. Vous réaliserez vos coquis de recherches sur un carnet de croquis dédié au cours qui sera rendu à la fin
du sujet
8. Vous enregistrerez chacune des itérations réalisées sous un format image .jpg et réaliserez un album
dédié au sujets et à vos experimentations graphique sur Flickr.
Digital lab : brief
—
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Méthodologie :
Chaque cours est divisé en 2 partie :
1. Théorie (1h30) :
Cours technique et programmation
2. Découverte (10-15min)
Decouverte de référence sur l’Art Numérique et
le Creative Coding
3. Pratique (1h15)
Tests et application de la théorie par les
étudiants sur le brief en cours
Suivi de projet.
Digital lab : brief
—
Suivi :
La production du sujet suivra le processus suivant lors
des suivis de projet :
1. Présentation rapide des état précédents de la
créature.
2. Présentation des recherches pour l’évolution de
la créature (croquis, inspirations graphiques,
moodboard…)
3. Présentation des itérations tests réalisées
(minimum de 5 itérations).
4. Validation d’une itération.
5. Tests et itérations intégrant les notions vues
durant le cours.
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Code et Attribution :
Réutiliser un code est un bon exercice pratique cependant la réutilisation de code sans en avoir citer la source
est considéré comme de la copie et du plagiat.
Le developpement a toujours impliqué l’utilisation de code provenant d’autres sources et nous avons la chance
de profiter d’une communauté open source. Sans le partage de savoir de cette communauté celle-ci ne grandirait
pas et votre travail ne verrait sans doute pas le jour. C’est la raison pour laquelle il est éthique de citer ses
sources.
Tout comme vous citez les sources original dans vos travaux graphiques et écrit, vous devez citer l’ensemble des
source technique afférant à votre projet tel que les auteurs des algorithmes ou outils incorporé à vos projets ou
les documents de recherches et cours utilisée dans la création de votre projet.
Texte original de Scott Murray, Assistant Professor, Design Department of Art + Architecture, University of San Francisco.
Traduction et adaptation : Alexandre Rivaux
Documenter son code : http://uark.libguides.com/c.php?g=78829&p=506916 - University of Arkansas
Digital lab : brief
—
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Documenter son code : les commentaires
Il est important de documenter votre code. Cela vous permet de vous y retrouver plus facilement lorsque vous
devrez vous y replonger mais permettra également à d’autre developpeur ou enseignant de comprendre votre
logique. Pour documenter votre code vous utiliserez les commentaires /* */ vous permettant de laisser des notes
explicatives. L’exemple suivant montre une fonction documentée permettant d’appliquer une rotation à un
vecteur en 3 dimensions autour d’un vecteur servant d’axe :
PVector computeRodrigueRotation(PVector k, PVector v, float theta)
{
/* Rotation du vecteur v autour du vecteur k selon l’angle theta;
Based on Onlinde-Rodrigue Formula : https://en.wikipedia.org/wiki/Rodrigues'_rotation_formula
Olinde Rodrigues formula : Vrot = v* cos(theta) + (k x v) * sin(theta) + k * (k . v) * (1 - cos(theta));
*/
PVector kcrossv = k.cross(v); //Soit kcrossv le Cross Product (produit vectoriel) des vecteur k et v
float kdotv = k.dot(v); //Soit kdotv le Dot Product (produit scalaire) des vecteur k et v
float x = v.x * cos(theta) + kcrossv.x * sin(theta) + k.x * kdotv * (1 - cos(theta)); //Position x du vecteur V après rotation
float y = v.y * cos(theta) + kcrossv.y * sin(theta) + k.y * kdotv * (1 - cos(theta)); //Position y du vecteur V après rotation
float z = v.z * cos(theta) + kcrossv.z * sin(theta) + k.z * kdotv * (1 - cos(theta)); //Position z du vecteur V après rotation
PVector nv = new PVector(x, y, z); //Vecteur V après rotation
nv.normalize(); //Normalization du vecteur V
return nv;
}
Digital lab : brief
—
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Documenter son code : citer les sources
Lorsque que vous utilisez une fonction ou un code réalisé par un autre developpeur vous citerez la source de la
manière suivante avant la fonction ou le code :
/***************************************************************************************
* Titre du programme d’origine : <Titre du programme d’origine>
* Auteur : <auteur>
* Date : <date si disponible>
* Version du code : <version si disponible>
* Lien vers la source : <where it's located>
*
***************************************************************************************/
Exemple :
/***************************************************************************************
* Titre du programme d’origine : OpenGL Rim Shader
* Auteur : Diederick Huijbers
* Date : 2014
* Version du code : 1.0
* Lien vers la source : http://www.roxlu.com/2014/037/opengl-rim-shader
*
***************************************************************************************/
Digital lab : brief
—
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Attendus et document de rendu :
Le rendu du sujet s’effectuera par une présentation devant la classe et sera accompagnée d’un document de
présentation .pdf contenant :
1. Rappel du brief
2. Présentation de la créature et de ses comportements
3. Présentation de chaque étape processus itératif documenté expliquant les choix effectués, leurs raisons,
les difficultés rencontrés et la manière de les résoudres (inspirations graphiques, ressources, sites,
benchmark…)
4. .JPGs HD de la créature
5. Video capture de la créature
6. Sketch processing de la créature
7. Ensemble des sketchs réalisés lors du processus itératif
8. Rendu du carnet de croquis
Digital lab : brief
—
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Digital lab : brief
—
Cours 00 : 8/10/15
Présentation Option,
Définition du design génératif et du creative coding,
Processing : découverte
Cours 01 : 15/10/2015
Itérations et Conditions — Coordonées Cartésiennes
(Dessin) : Dessin de la créature
Cours 02 : 22/10/2015
Aléatoire Brownien et Perlin — Coordonnées Polaires
(Dessin) : Dessin de la créature
Cours 03 : 29/10/2015
Déplacement et rotation — Vitesse et sinusoidale
(Animation) : Dessin de la créature & comportements
propres
Cours 04 : 5/11/15
Temps et décompte (Animation) : Dessin de la créature
& comportements propres
Cours 05 : 19/11/2015
Réaction au son (Réaction) : Dessin de la créature &
comportements au son
Cours 06 : 26/11/2015
Réaction au son (Réaction) : Dessin de la créature &
comportements au son
Cours 07 : 3/12/2015
Librairies et Capteurs (Interactions) : Dessin de la créature
& comportement à l’utilisateur
Cours 08 : 10/12/2015
Librairies et Capteurs (Interactions) : Dessin de la créature
& comportement à l’utilisateur
Cours 09 : 7/01/2015
Présentation du rendu (1h30)
Pour aller plus loin (références et autres outils)
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Digital lab : brief
—
La grille de notation se compose de la
manière suivante :
1. Présentation orale
2. Concept
3. Design graphique
4. Méthodologie (suivi continu)
5. Recherches individuelles (carnet de croquis)
6. Documentation (flickr + documentation code)
Une notation réalisée de A à E :
1. A : Excellent travail (4 à 5/5)
2. B : Bon travail - continuez comme ça (2.5 à
3/5)
3. C : Bien - poursuivez vos efforts (2 à 2.5/5)
4. D : Manque de Travail (1 à 1.5/5)
5. E : Aucun travail - où étiez vous? (0/5)
6. Total /30 => /1.5 pour un total /20
NB : Pour tout rendu en retard un malus de -10pts
sera appliqué à la note /20
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Références
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Communion : A celebration
of Life (2011)
Direction Artistique : Matt Pyke (Universal Everything)
Design + Code : Field
Design sonore : Simon Pyke (FreeFarm)
Photographie : James Medcraft
Making of : http://www.field.io/making-of/communion-a-
celebration-of-life/
Digital lab : brief
—
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Colorimetry in motion (2014)
Design + Code : Nicolas Menard et Eric-Renaud Houde (la
chose imprimée)
Digital lab : brief
—
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Evolved virtual creatures (1994)
Design + Code : Karl Sims
Digital lab : brief
—
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education
Rec All - Puzzle universe (2015)
Design + Code : Romain Cazier
Tuteurs : Alain Bellet, Cyril Diagne, Gael Hugo, Christophe
Guignard et Vincent Jacquier
Assistants : Matthieu Minguet, Laura Perrenoud, Tibor
Udvari
École : ECAL, University of Art and Design, Lausanne,
Suisse
Digital lab : brief
—
Bon design
Interactif ;)
Pour toutes questions concernant
la matière, les sujets ou le design;
n’hésitez pas à me contacter.
Alexandre Rivaux
Visual Artist / Interactive Designer @BonjourLab
arivaux@gmail.com
ixd.education
e-art sup | 3A & 3B
Design Interactif
Alexandre Rivaux
arivaux@gmail.com
ixd.education

Contenu connexe

En vedette

01 00 web_expérientiel _ introduction
01 00 web_expérientiel _ introduction01 00 web_expérientiel _ introduction
01 00 web_expérientiel _ introductionAlexandre Rivaux
 
Perspectives for authors in the post digital age
Perspectives for authors in the post digital agePerspectives for authors in the post digital age
Perspectives for authors in the post digital ageStephen Bateman DipM CIM
 
[Workshop DIL Objets Connectés] Des objets aux capteurs au Big Data : les no...
[Workshop DIL Objets Connectés] Des objets aux capteurs au Big Data : les no...[Workshop DIL Objets Connectés] Des objets aux capteurs au Big Data : les no...
[Workshop DIL Objets Connectés] Des objets aux capteurs au Big Data : les no...Thierry Rayna
 
Comment les réseaux sociaux peuvent vous aider dans votre recherche d'emploi ?
Comment les réseaux sociaux peuvent vous aider dans votre recherche d'emploi ?Comment les réseaux sociaux peuvent vous aider dans votre recherche d'emploi ?
Comment les réseaux sociaux peuvent vous aider dans votre recherche d'emploi ?Alexandre Moussier
 
Cours #7 L'entreprise Twitter (Philosphie, fonctionnement, business model etc.)
Cours #7 L'entreprise Twitter (Philosphie, fonctionnement, business model etc.)Cours #7 L'entreprise Twitter (Philosphie, fonctionnement, business model etc.)
Cours #7 L'entreprise Twitter (Philosphie, fonctionnement, business model etc.)Alexandre Moussier
 
Cours #3 Théorie liés aux réseaux sociaux et modèles économiques de l'Internet
Cours #3 Théorie liés aux réseaux sociaux et modèles économiques de l'InternetCours #3 Théorie liés aux réseaux sociaux et modèles économiques de l'Internet
Cours #3 Théorie liés aux réseaux sociaux et modèles économiques de l'InternetAlexandre Moussier
 
Cours #8 Les métiers de l'Internet
Cours #8 Les métiers de l'InternetCours #8 Les métiers de l'Internet
Cours #8 Les métiers de l'InternetAlexandre Moussier
 
Cours #2 Communication 2.0, communication sur les médias sociaux
Cours #2 Communication 2.0, communication sur les médias sociauxCours #2 Communication 2.0, communication sur les médias sociaux
Cours #2 Communication 2.0, communication sur les médias sociauxAlexandre Moussier
 
Cours #1 Histoire de la télécommunication et des médias
Cours #1 Histoire de la télécommunication et des médiasCours #1 Histoire de la télécommunication et des médias
Cours #1 Histoire de la télécommunication et des médiasAlexandre Moussier
 
Cours #10 E-Réputation et personnal branding
Cours #10 E-Réputation et personnal brandingCours #10 E-Réputation et personnal branding
Cours #10 E-Réputation et personnal brandingAlexandre Moussier
 
Cours #9 L'Internet des objets
Cours #9 L'Internet des objetsCours #9 L'Internet des objets
Cours #9 L'Internet des objetsAlexandre Moussier
 
templates.iafactory, guide de prise en main
templates.iafactory, guide de prise en maintemplates.iafactory, guide de prise en main
templates.iafactory, guide de prise en mainiafactory
 
Internet des objets (IoT)
Internet des objets (IoT)Internet des objets (IoT)
Internet des objets (IoT)bruno-dambrun
 
Stratégie Créative I le F***ing Brief I ian gilbert I ISCOM
Stratégie Créative I le F***ing Brief  I ian gilbert  I  ISCOMStratégie Créative I le F***ing Brief  I ian gilbert  I  ISCOM
Stratégie Créative I le F***ing Brief I ian gilbert I ISCOMIANTERNAUTE
 
03 00 l'internet des objets - introduction
03 00 l'internet des objets - introduction03 00 l'internet des objets - introduction
03 00 l'internet des objets - introductionAlexandre Rivaux
 
The brief in the post digital age
The brief in the post digital ageThe brief in the post digital age
The brief in the post digital ageGareth Kay
 
Internet des objets
Internet des objetsInternet des objets
Internet des objetsFree Lance
 
Du design au design numérique
Du design au design numériqueDu design au design numérique
Du design au design numériqueStéphane Vial
 
« Design » n'est pas un gros mot
« Design » n'est pas un gros mot« Design » n'est pas un gros mot
« Design » n'est pas un gros motmalvese
 

En vedette (20)

01 00 web_expérientiel _ introduction
01 00 web_expérientiel _ introduction01 00 web_expérientiel _ introduction
01 00 web_expérientiel _ introduction
 
Perspectives for authors in the post digital age
Perspectives for authors in the post digital agePerspectives for authors in the post digital age
Perspectives for authors in the post digital age
 
[Workshop DIL Objets Connectés] Des objets aux capteurs au Big Data : les no...
[Workshop DIL Objets Connectés] Des objets aux capteurs au Big Data : les no...[Workshop DIL Objets Connectés] Des objets aux capteurs au Big Data : les no...
[Workshop DIL Objets Connectés] Des objets aux capteurs au Big Data : les no...
 
Comment les réseaux sociaux peuvent vous aider dans votre recherche d'emploi ?
Comment les réseaux sociaux peuvent vous aider dans votre recherche d'emploi ?Comment les réseaux sociaux peuvent vous aider dans votre recherche d'emploi ?
Comment les réseaux sociaux peuvent vous aider dans votre recherche d'emploi ?
 
Cours #7 L'entreprise Twitter (Philosphie, fonctionnement, business model etc.)
Cours #7 L'entreprise Twitter (Philosphie, fonctionnement, business model etc.)Cours #7 L'entreprise Twitter (Philosphie, fonctionnement, business model etc.)
Cours #7 L'entreprise Twitter (Philosphie, fonctionnement, business model etc.)
 
Cours #3 Théorie liés aux réseaux sociaux et modèles économiques de l'Internet
Cours #3 Théorie liés aux réseaux sociaux et modèles économiques de l'InternetCours #3 Théorie liés aux réseaux sociaux et modèles économiques de l'Internet
Cours #3 Théorie liés aux réseaux sociaux et modèles économiques de l'Internet
 
Cours #8 Les métiers de l'Internet
Cours #8 Les métiers de l'InternetCours #8 Les métiers de l'Internet
Cours #8 Les métiers de l'Internet
 
Cours #2 Communication 2.0, communication sur les médias sociaux
Cours #2 Communication 2.0, communication sur les médias sociauxCours #2 Communication 2.0, communication sur les médias sociaux
Cours #2 Communication 2.0, communication sur les médias sociaux
 
Cours #1 Histoire de la télécommunication et des médias
Cours #1 Histoire de la télécommunication et des médiasCours #1 Histoire de la télécommunication et des médias
Cours #1 Histoire de la télécommunication et des médias
 
Cours #10 E-Réputation et personnal branding
Cours #10 E-Réputation et personnal brandingCours #10 E-Réputation et personnal branding
Cours #10 E-Réputation et personnal branding
 
Cours #9 L'Internet des objets
Cours #9 L'Internet des objetsCours #9 L'Internet des objets
Cours #9 L'Internet des objets
 
Internet des Objets
Internet des ObjetsInternet des Objets
Internet des Objets
 
templates.iafactory, guide de prise en main
templates.iafactory, guide de prise en maintemplates.iafactory, guide de prise en main
templates.iafactory, guide de prise en main
 
Internet des objets (IoT)
Internet des objets (IoT)Internet des objets (IoT)
Internet des objets (IoT)
 
Stratégie Créative I le F***ing Brief I ian gilbert I ISCOM
Stratégie Créative I le F***ing Brief  I ian gilbert  I  ISCOMStratégie Créative I le F***ing Brief  I ian gilbert  I  ISCOM
Stratégie Créative I le F***ing Brief I ian gilbert I ISCOM
 
03 00 l'internet des objets - introduction
03 00 l'internet des objets - introduction03 00 l'internet des objets - introduction
03 00 l'internet des objets - introduction
 
The brief in the post digital age
The brief in the post digital ageThe brief in the post digital age
The brief in the post digital age
 
Internet des objets
Internet des objetsInternet des objets
Internet des objets
 
Du design au design numérique
Du design au design numériqueDu design au design numérique
Du design au design numérique
 
« Design » n'est pas un gros mot
« Design » n'est pas un gros mot« Design » n'est pas un gros mot
« Design » n'est pas un gros mot
 

Similaire à Digital lab brief

Connected Developper Ep6 (25-05-2013)
Connected Developper Ep6 (25-05-2013)Connected Developper Ep6 (25-05-2013)
Connected Developper Ep6 (25-05-2013)Badr Hakkari
 
01 02 web_expérientiel _ le mobile
01 02 web_expérientiel _ le mobile01 02 web_expérientiel _ le mobile
01 02 web_expérientiel _ le mobileAlexandre Rivaux
 
Py osv newsletter-062018
Py osv newsletter-062018Py osv newsletter-062018
Py osv newsletter-062018FabMob
 
Scikit Learn: Développement communautaire
Scikit Learn: Développement communautaireScikit Learn: Développement communautaire
Scikit Learn: Développement communautaireGael Varoquaux
 
introduction à la gestion de projet
introduction à la gestion de projetintroduction à la gestion de projet
introduction à la gestion de projetlaureno
 
Introduction Gestion Projet web
Introduction Gestion Projet webIntroduction Gestion Projet web
Introduction Gestion Projet webguest6d3f53
 
cours-android.pdf
cours-android.pdfcours-android.pdf
cours-android.pdfmed_univ78
 
Devoxx 2023 - Sécurisez votre software supply chain avec SLSA, Sigstore et K...
Devoxx 2023 - Sécurisez votre software supply chain avec SLSA, Sigstore et K...Devoxx 2023 - Sécurisez votre software supply chain avec SLSA, Sigstore et K...
Devoxx 2023 - Sécurisez votre software supply chain avec SLSA, Sigstore et K...Mohamed Abdennebi
 
Exemple-Epi-Trace-avec-un-robot.pptx
Exemple-Epi-Trace-avec-un-robot.pptxExemple-Epi-Trace-avec-un-robot.pptx
Exemple-Epi-Trace-avec-un-robot.pptxKediViking
 
Exemple de-code-oop-avec-labview
Exemple de-code-oop-avec-labviewExemple de-code-oop-avec-labview
Exemple de-code-oop-avec-labviewLuc Desruelle
 
Exemple de-code-oop-avec-labview
Exemple de-code-oop-avec-labviewExemple de-code-oop-avec-labview
Exemple de-code-oop-avec-labviewLuc Desruelle
 
Exemple code oop_labview
Exemple code oop_labviewExemple code oop_labview
Exemple code oop_labviewLuc Desruelle
 
Utiliser l'EDI pour développer en multiplateforme
Utiliser l'EDI pour développer en multiplateformeUtiliser l'EDI pour développer en multiplateforme
Utiliser l'EDI pour développer en multiplateformepprem
 
OCCIware presentation au groupe de travail Big Data du SCS
OCCIware presentation au groupe de travail Big Data du SCSOCCIware presentation au groupe de travail Big Data du SCS
OCCIware presentation au groupe de travail Big Data du SCSOCCIware
 
Les Metiers de l'Intelligence Artificielle
Les Metiers de l'Intelligence ArtificielleLes Metiers de l'Intelligence Artificielle
Les Metiers de l'Intelligence ArtificielleErol GIRAUDY
 

Similaire à Digital lab brief (20)

00 gx d - introduction
00 gx d - introduction00 gx d - introduction
00 gx d - introduction
 
Connected Developper Ep6 (25-05-2013)
Connected Developper Ep6 (25-05-2013)Connected Developper Ep6 (25-05-2013)
Connected Developper Ep6 (25-05-2013)
 
01 02 web_expérientiel _ le mobile
01 02 web_expérientiel _ le mobile01 02 web_expérientiel _ le mobile
01 02 web_expérientiel _ le mobile
 
Py osv newsletter-062018
Py osv newsletter-062018Py osv newsletter-062018
Py osv newsletter-062018
 
00 ix d - introduction
00 ix d - introduction00 ix d - introduction
00 ix d - introduction
 
AntoineLambertCV
AntoineLambertCVAntoineLambertCV
AntoineLambertCV
 
Scikit Learn: Développement communautaire
Scikit Learn: Développement communautaireScikit Learn: Développement communautaire
Scikit Learn: Développement communautaire
 
archicad-cours.pptx
archicad-cours.pptxarchicad-cours.pptx
archicad-cours.pptx
 
introduction à la gestion de projet
introduction à la gestion de projetintroduction à la gestion de projet
introduction à la gestion de projet
 
Introduction Gestion Projet web
Introduction Gestion Projet webIntroduction Gestion Projet web
Introduction Gestion Projet web
 
cours-android.pdf
cours-android.pdfcours-android.pdf
cours-android.pdf
 
Devoxx 2023 - Sécurisez votre software supply chain avec SLSA, Sigstore et K...
Devoxx 2023 - Sécurisez votre software supply chain avec SLSA, Sigstore et K...Devoxx 2023 - Sécurisez votre software supply chain avec SLSA, Sigstore et K...
Devoxx 2023 - Sécurisez votre software supply chain avec SLSA, Sigstore et K...
 
Exemple-Epi-Trace-avec-un-robot.pptx
Exemple-Epi-Trace-avec-un-robot.pptxExemple-Epi-Trace-avec-un-robot.pptx
Exemple-Epi-Trace-avec-un-robot.pptx
 
Exemple de-code-oop-avec-labview
Exemple de-code-oop-avec-labviewExemple de-code-oop-avec-labview
Exemple de-code-oop-avec-labview
 
Exemple de-code-oop-avec-labview
Exemple de-code-oop-avec-labviewExemple de-code-oop-avec-labview
Exemple de-code-oop-avec-labview
 
Exemple code oop_labview
Exemple code oop_labviewExemple code oop_labview
Exemple code oop_labview
 
Utiliser l'EDI pour développer en multiplateforme
Utiliser l'EDI pour développer en multiplateformeUtiliser l'EDI pour développer en multiplateforme
Utiliser l'EDI pour développer en multiplateforme
 
OCCIware presentation au groupe de travail Big Data du SCS
OCCIware presentation au groupe de travail Big Data du SCSOCCIware presentation au groupe de travail Big Data du SCS
OCCIware presentation au groupe de travail Big Data du SCS
 
DDD FOR POs.pdf
DDD FOR POs.pdfDDD FOR POs.pdf
DDD FOR POs.pdf
 
Les Metiers de l'Intelligence Artificielle
Les Metiers de l'Intelligence ArtificielleLes Metiers de l'Intelligence Artificielle
Les Metiers de l'Intelligence Artificielle
 

Digital lab brief

  • 1. The World of Digital Creatures 1. Contexte 2. Brief 3. Les comportements 4. Contraintes 5. Méthodologie & suivi 6. Code et attribution 7. Documenter son code : les commentaires 8. Documenter son code : citer les sources 9. Document et attendus de rendu 10. Planning 11. Grille de notation 12. Références e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education
  • 2. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Digital lab : brief — «The World of Digital Creatures» est une expérience interactive, sonore et visuelle explorant le champs des possibles du creative coding. Présentée sous la forme d’une installation interactive exposée dans les locaux d’e-artsup, l’installation propose de plonger au cœur d’un environnement peuplé de créatures digitales reactives au son et interagissant avec son public. «The World of Digital Creatures» est un exercice de cours inspiré de l’installation «Communion : Celebration of Life» réalisée par Field en 2011.
  • 3. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Digital lab : brief —
  • 4. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Brief : Il vous est demandé de réaliser chacun une créature digitale pouvant peupler cet environnement réactif au son. Vos créatures devront respecter les contraintes suivante : 1. Être issue d’une recherche graphique itérative continue tout au long du semestre 2. Posséder 3 comportements propres (ex : sauter, tourner, grossir…) 3. Posseder 3 comportements réagissant au son (ex : changer de couleur, cheveux qui poussent…) 4. Posséder un comportement interagissant avec l’utilisateur. (ex : se dupliquer, changer de forme…) Digital lab : brief —
  • 5. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Les comportements : 1. Les 3 comportements propres (ex : sauter, tourner, grossir…) Les 3 comportements propres sont des 3 façons dont votre créature se comporte au naturel. Ils peuvent être de natures variées telles que bouger les oreilles, cligner des yeux, se dandiner… Ces comportements pourront s’effectuer constamment (en boucle), de manière régulière (toute les 4 secondes par exemple) ou de manière aléatoire (toute les x seconde). Ils pourront s’effectuer ensemble, successivement ou selon un ordre aléatoire. Vous pourrez choisir de les activer ou non si votre créature réagit ou interagi avec son environnement ou avec l’utilisateur. 2. Posseder 3 comportements réagissant au son (ex : changer de couleur, cheveux qui poussent…) Ces 3 comportements sont les manière dont votre créature réagira au son (basse, medium et aigue). Il peuvent être de natures variées. Vous fixerez vous même les paliers à partir desquels votre créature réagira. Vous vous appuierez du cours sur la reaction au son et de l’objet d’analyse sonore fourni. 3. Posséder un comportement interagissant avec l’utilisateur. (ex : se dupliquer, changer de forme…) Il s’agit du comportement que possède votre creature lorsque l'utilisateur interagit avec l’installation. L’utilisateur pourra interagir de 4 manières différentes, vous en choisirez une à laquelle votre creature réagira. Les 4 interactions différentes seront définies en cours et avec la classe. Elle pourront être par exemple : Réagir des tweets, aux mouvement de l’utilisateur, à sa main, à la distance face à l’installation, aux visages... Digital lab : brief —
  • 6. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Contraintes: 1. Taille du sketch : 720 × 720 pixels 2. Format du sketch : 2D 3. 8 couleurs maximum, dégradé possible. 4. Votre créature devra posséder une taille responsive sur base de variables largeur hauteur (pas de hardcoding) 5. Chacune de vos itération sera enregistrer sous le nom suvant : AnneeMoisJour_WDC_NumeroDeIteration. pde 6. L’ensemble de votre code sera documenté (cf section «documenter son code») 7. Vous réaliserez vos coquis de recherches sur un carnet de croquis dédié au cours qui sera rendu à la fin du sujet 8. Vous enregistrerez chacune des itérations réalisées sous un format image .jpg et réaliserez un album dédié au sujets et à vos experimentations graphique sur Flickr. Digital lab : brief —
  • 7. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Méthodologie : Chaque cours est divisé en 2 partie : 1. Théorie (1h30) : Cours technique et programmation 2. Découverte (10-15min) Decouverte de référence sur l’Art Numérique et le Creative Coding 3. Pratique (1h15) Tests et application de la théorie par les étudiants sur le brief en cours Suivi de projet. Digital lab : brief — Suivi : La production du sujet suivra le processus suivant lors des suivis de projet : 1. Présentation rapide des état précédents de la créature. 2. Présentation des recherches pour l’évolution de la créature (croquis, inspirations graphiques, moodboard…) 3. Présentation des itérations tests réalisées (minimum de 5 itérations). 4. Validation d’une itération. 5. Tests et itérations intégrant les notions vues durant le cours.
  • 8. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Code et Attribution : Réutiliser un code est un bon exercice pratique cependant la réutilisation de code sans en avoir citer la source est considéré comme de la copie et du plagiat. Le developpement a toujours impliqué l’utilisation de code provenant d’autres sources et nous avons la chance de profiter d’une communauté open source. Sans le partage de savoir de cette communauté celle-ci ne grandirait pas et votre travail ne verrait sans doute pas le jour. C’est la raison pour laquelle il est éthique de citer ses sources. Tout comme vous citez les sources original dans vos travaux graphiques et écrit, vous devez citer l’ensemble des source technique afférant à votre projet tel que les auteurs des algorithmes ou outils incorporé à vos projets ou les documents de recherches et cours utilisée dans la création de votre projet. Texte original de Scott Murray, Assistant Professor, Design Department of Art + Architecture, University of San Francisco. Traduction et adaptation : Alexandre Rivaux Documenter son code : http://uark.libguides.com/c.php?g=78829&p=506916 - University of Arkansas Digital lab : brief —
  • 9. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Documenter son code : les commentaires Il est important de documenter votre code. Cela vous permet de vous y retrouver plus facilement lorsque vous devrez vous y replonger mais permettra également à d’autre developpeur ou enseignant de comprendre votre logique. Pour documenter votre code vous utiliserez les commentaires /* */ vous permettant de laisser des notes explicatives. L’exemple suivant montre une fonction documentée permettant d’appliquer une rotation à un vecteur en 3 dimensions autour d’un vecteur servant d’axe : PVector computeRodrigueRotation(PVector k, PVector v, float theta) { /* Rotation du vecteur v autour du vecteur k selon l’angle theta; Based on Onlinde-Rodrigue Formula : https://en.wikipedia.org/wiki/Rodrigues'_rotation_formula Olinde Rodrigues formula : Vrot = v* cos(theta) + (k x v) * sin(theta) + k * (k . v) * (1 - cos(theta)); */ PVector kcrossv = k.cross(v); //Soit kcrossv le Cross Product (produit vectoriel) des vecteur k et v float kdotv = k.dot(v); //Soit kdotv le Dot Product (produit scalaire) des vecteur k et v float x = v.x * cos(theta) + kcrossv.x * sin(theta) + k.x * kdotv * (1 - cos(theta)); //Position x du vecteur V après rotation float y = v.y * cos(theta) + kcrossv.y * sin(theta) + k.y * kdotv * (1 - cos(theta)); //Position y du vecteur V après rotation float z = v.z * cos(theta) + kcrossv.z * sin(theta) + k.z * kdotv * (1 - cos(theta)); //Position z du vecteur V après rotation PVector nv = new PVector(x, y, z); //Vecteur V après rotation nv.normalize(); //Normalization du vecteur V return nv; } Digital lab : brief —
  • 10. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Documenter son code : citer les sources Lorsque que vous utilisez une fonction ou un code réalisé par un autre developpeur vous citerez la source de la manière suivante avant la fonction ou le code : /*************************************************************************************** * Titre du programme d’origine : <Titre du programme d’origine> * Auteur : <auteur> * Date : <date si disponible> * Version du code : <version si disponible> * Lien vers la source : <where it's located> * ***************************************************************************************/ Exemple : /*************************************************************************************** * Titre du programme d’origine : OpenGL Rim Shader * Auteur : Diederick Huijbers * Date : 2014 * Version du code : 1.0 * Lien vers la source : http://www.roxlu.com/2014/037/opengl-rim-shader * ***************************************************************************************/ Digital lab : brief —
  • 11. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Attendus et document de rendu : Le rendu du sujet s’effectuera par une présentation devant la classe et sera accompagnée d’un document de présentation .pdf contenant : 1. Rappel du brief 2. Présentation de la créature et de ses comportements 3. Présentation de chaque étape processus itératif documenté expliquant les choix effectués, leurs raisons, les difficultés rencontrés et la manière de les résoudres (inspirations graphiques, ressources, sites, benchmark…) 4. .JPGs HD de la créature 5. Video capture de la créature 6. Sketch processing de la créature 7. Ensemble des sketchs réalisés lors du processus itératif 8. Rendu du carnet de croquis Digital lab : brief —
  • 12. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Digital lab : brief — Cours 00 : 8/10/15 Présentation Option, Définition du design génératif et du creative coding, Processing : découverte Cours 01 : 15/10/2015 Itérations et Conditions — Coordonées Cartésiennes (Dessin) : Dessin de la créature Cours 02 : 22/10/2015 Aléatoire Brownien et Perlin — Coordonnées Polaires (Dessin) : Dessin de la créature Cours 03 : 29/10/2015 Déplacement et rotation — Vitesse et sinusoidale (Animation) : Dessin de la créature & comportements propres Cours 04 : 5/11/15 Temps et décompte (Animation) : Dessin de la créature & comportements propres Cours 05 : 19/11/2015 Réaction au son (Réaction) : Dessin de la créature & comportements au son Cours 06 : 26/11/2015 Réaction au son (Réaction) : Dessin de la créature & comportements au son Cours 07 : 3/12/2015 Librairies et Capteurs (Interactions) : Dessin de la créature & comportement à l’utilisateur Cours 08 : 10/12/2015 Librairies et Capteurs (Interactions) : Dessin de la créature & comportement à l’utilisateur Cours 09 : 7/01/2015 Présentation du rendu (1h30) Pour aller plus loin (références et autres outils)
  • 13. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Digital lab : brief — La grille de notation se compose de la manière suivante : 1. Présentation orale 2. Concept 3. Design graphique 4. Méthodologie (suivi continu) 5. Recherches individuelles (carnet de croquis) 6. Documentation (flickr + documentation code) Une notation réalisée de A à E : 1. A : Excellent travail (4 à 5/5) 2. B : Bon travail - continuez comme ça (2.5 à 3/5) 3. C : Bien - poursuivez vos efforts (2 à 2.5/5) 4. D : Manque de Travail (1 à 1.5/5) 5. E : Aucun travail - où étiez vous? (0/5) 6. Total /30 => /1.5 pour un total /20 NB : Pour tout rendu en retard un malus de -10pts sera appliqué à la note /20
  • 14. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Références
  • 15. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Communion : A celebration of Life (2011) Direction Artistique : Matt Pyke (Universal Everything) Design + Code : Field Design sonore : Simon Pyke (FreeFarm) Photographie : James Medcraft Making of : http://www.field.io/making-of/communion-a- celebration-of-life/ Digital lab : brief —
  • 16. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Colorimetry in motion (2014) Design + Code : Nicolas Menard et Eric-Renaud Houde (la chose imprimée) Digital lab : brief —
  • 17. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Evolved virtual creatures (1994) Design + Code : Karl Sims Digital lab : brief —
  • 18. e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education Rec All - Puzzle universe (2015) Design + Code : Romain Cazier Tuteurs : Alain Bellet, Cyril Diagne, Gael Hugo, Christophe Guignard et Vincent Jacquier Assistants : Matthieu Minguet, Laura Perrenoud, Tibor Udvari École : ECAL, University of Art and Design, Lausanne, Suisse Digital lab : brief —
  • 19. Bon design Interactif ;) Pour toutes questions concernant la matière, les sujets ou le design; n’hésitez pas à me contacter. Alexandre Rivaux Visual Artist / Interactive Designer @BonjourLab arivaux@gmail.com ixd.education e-art sup | 3A & 3B Design Interactif Alexandre Rivaux arivaux@gmail.com ixd.education