{"id":89,"date":"2016-11-10T03:32:00","date_gmt":"2016-11-10T08:32:00","guid":{"rendered":"http:\/\/www.elsaschneider.ch\/design\/?p=89"},"modified":"2017-09-07T09:13:18","modified_gmt":"2017-09-07T13:13:18","slug":"wikizualeasy","status":"publish","type":"post","link":"http:\/\/www.elsaschneider.ch\/design\/index.php\/2016\/11\/10\/wikizualeasy\/","title":{"rendered":"Wikizualeasy"},"content":{"rendered":"

Prise de notes & Brainstorming<\/p>\n

<\/p>\n

– Description \u00e9crite de l\u2019id\u00e9e\u00a0:<\/p>\n

Un outil pour m’aider \u00e0 d\u00e9couvrir\/apprendre\/explorer les concepts de Human-Computer interaction.<\/p>\n

(aller \u00e0 la racine de l’information) Je voulais en savoir plus et comprendre le fonctionnement de wikidata.<\/p>\n

\u00ab\u00a0Wikidata is a free and open knowledge base that can be read and edited by both humans and machines.\u00a0\u00bb<\/i><\/p>\n

\"wikimediainteraction\"<\/p>\n

 <\/p>\n

\"media_design\"<\/p>\n

Je trouve en effet qu\u2019il n\u2019est pas facile de comprendre rapidement comment les donn\u00e9es sont structur\u00e9es et donc de visualiser ces donn\u00e9es, surtout de mani\u00e8re dynamiques et interactives.<\/p>\n

Cela est donc le but but de mon projet.<\/p>\n

Pour l\u2019instant j\u2019ai choisi de travailler avec la cat\u00e9gorie des impressionnistes fran\u00e7ais mais cela peut encore changer.<\/p>\n

\"wikidata\"<\/p>\n

– Premi\u00e8res \u00e9tapes (Documentation, Image, Croquis, Code, etc.)<\/p>\n

Dossier du projet : https:\/\/github.com\/elsacat\/CreativeCodingProject<\/a><\/p>\n

Fichier du projet \u00a0: visualisation-peintres.html<\/p>\n

Librairies\u00a0: ajax (jquery), p5.dom.js<\/p>\n

Pour l\u2019instant, quand on clique sur le bouton \u00ab\u00a0Lister peintres\u00a0\u00bb le code demande \u00e0 wikidata les entr\u00e9es de la cat\u00e9gorie \u00ab\u00a0French_Impressionist_painters\u00a0<\/a>\u00bb<\/p>\n

vision assez rapide<\/p>\n

On m\u2019a beaucoup aid\u00e9 \u00e0 effectuer le lien entre l\u2019api de wikidata et javascript de sorte \u00e0 ce que j\u2019arrive \u00e0 comprendre un peu mieux la structure de wikidata ainsi que la mani\u00e8re dont les donn\u00e9es sont organis\u00e9es.<\/p>\n

Et maintenant je suis en train de d\u00e9composer les donn\u00e9es re\u00e7ues (les objets) afin d\u2019isoler les informations qui m\u2019int\u00e9ressent. Ci dessous, ce sont les \u00e9tapes progressives de la r\u00e9cup\u00e9ration des donn\u00e9es.<\/p>\n

Etape 0\u00a0: (juste l\u2019ID)<\/p>\n

\"peintresliste0\"<\/p>\n

Etape 1\u00a0: (ID + nom de l\u2019artiste)<\/p>\n

\"listepeintre2\"<\/p>\n

Etape 3\u00a0: ID + informations pr\u00e9cise + image s\u2019il y en a une<\/p>\n

\"listepeintre\"<\/p>\n

Ci-dessus, les informations qui m\u2019int\u00e9ressent provenant de wikidata.<\/p>\n

Etape 4\u00a0: visualisation rudimentaire des informations<\/p>\n

Pour l\u2019instant chaque rectangle repr\u00e9sente la vie d\u2019un artiste fran\u00e7ais appartenant au mouvement impressionniste. Sa position x correspond \u00e0 son ann\u00e9e de naissance (entre 1825 jusqu\u2019\u00e0 1909)
sa longueur repr\u00e9sente sa dur\u00e9e de vie.<\/p>\n

\"creativecoding\"<\/p>\n

 <\/p>\n

Etape 5\u00a0: visualisation un peu plu \u00e9labor\u00e9e<\/p>\n

Maintenant, la largeur du rectangle correspond \u00e0 la dur\u00e9e de vie.<\/p>\n

\"creativecoding01\"<\/p>\n

Je voudrais maintenant que ces rectangles (mais la forme va encore s\u00fbrement \u00e9voluer) soient dynamiques, et interagissent avec l\u2019utilisateur. (librairie dom)<\/p>\n

– Liens vers des projets ou r\u00e9f\u00e9rences d\u2019inspirations\u00a0:<\/p>\n

http:\/\/ucsdnews.ucsd.edu\/pressrelease\/mellon_foundation_supports_new_software_tools_for_humanities_researchers\/<\/a><\/p>\n

https:\/\/www.brainpickings.org\/2013\/06\/07\/painters-lives-accurat-giorgia-lupi\/<\/a><\/p>\n

https:\/\/www.flickr.com\/photos\/accurat\/sets\/72157633953437972\/<\/a><\/p>\n

Enregistrer<\/span><\/p>\n

Enregistrer<\/span><\/p>\n

Enregistrer<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"

Prise de notes & Brainstorming<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-89","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"http:\/\/www.elsaschneider.ch\/design\/index.php\/wp-json\/wp\/v2\/posts\/89","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.elsaschneider.ch\/design\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.elsaschneider.ch\/design\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.elsaschneider.ch\/design\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.elsaschneider.ch\/design\/index.php\/wp-json\/wp\/v2\/comments?post=89"}],"version-history":[{"count":5,"href":"http:\/\/www.elsaschneider.ch\/design\/index.php\/wp-json\/wp\/v2\/posts\/89\/revisions"}],"predecessor-version":[{"id":204,"href":"http:\/\/www.elsaschneider.ch\/design\/index.php\/wp-json\/wp\/v2\/posts\/89\/revisions\/204"}],"wp:attachment":[{"href":"http:\/\/www.elsaschneider.ch\/design\/index.php\/wp-json\/wp\/v2\/media?parent=89"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.elsaschneider.ch\/design\/index.php\/wp-json\/wp\/v2\/categories?post=89"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.elsaschneider.ch\/design\/index.php\/wp-json\/wp\/v2\/tags?post=89"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}