Bienvenue sur le wiki de Nuit debout, nous sommes le 3016 mars.
Modification de Ressources/Répertoire participatif de ressources graphiques
Besoin d'aide ? Cliquez ici.
Attention : Vous n’êtes pas connecté. Votre adresse IP sera visible de tout le monde si vous faites des modifications. Si vous vous connectez ou créez un compte, vos modifications seront attribuées à votre nom d’utilisateur, entre autres avantages.
Cette modification va être défaite. Veuillez vérifier les modifications ci-dessous, puis publier si c’est bien ce que vous voulez faire.
| Version actuelle | Votre texte | ||
| Ligne 1 : | Ligne 1 : | ||
| − | + | Voici un document collaboratif en ligne pour recenser toutes sortes de liens outils sur le web destinés au graphisme (banques d'images libres de droits ou sous Créative Commons, tutoriaux, guides, etc). Merci de participer en respectant le travail qui a déjà été fait. | |
| − | + | ||
| − | Voici un document collaboratif en ligne pour recenser toutes sortes de liens outils sur le web destinés au graphisme (banques d'images libres de droits ou sous Créative Commons, tutoriaux, | + | |
| − | + | =Recherche iconographique= | |
| − | + | ==Ressources gratuites== | |
| − | + | https://en.wikipedia.org/wiki/Wikipedia:Public_domain_image_resources | |
| − | + | http://www.pdimages.com/pdlist.htm | |
| − | + | https://commons.wikimedia.org/wiki/Accueil | |
| − | + | https://www.flickr.com/commons | |
| − | + | ||
| − | + | https://pixabay.com/ | |
| − | + | https://www.morguefile.com/ | |
| − | + | http://wellcomeimages.org/ | |
| − | + | https://www.flickr.com/groups/publicdomain/ | |
| − | + | ==Licences Creative Commons== | |
| − | + | https://creativecommons.org/licenses/?lang=fr | |
| − | + | https://fr.wikipedia.org/wiki/Licence_Creative_Commons | |
| − | + | http://d3sdoylwcs36el.cloudfront.net/creative-commons-license-types-pros-cons.gif | |
| − | + | ||
| − | + | ==Illustrations libres de droits== | |
http://www.oldbookillustrations.com | http://www.oldbookillustrations.com | ||
| Ligne 40 : | Ligne 37 : | ||
http://publicdomainreview.org/ | http://publicdomainreview.org/ | ||
| − | + | ==Textures== | |
| − | + | http://www.demilked.com/free-paper-textures-backgrounds/ | |
| − | + | http://wefunction.com/roundup-of-essential-grunge-design-resources/ | |
| − | + | Textures de marbre <3 http://www.doityvette.fr/tendances-marbre-30-textures-papier-marbre/ | |
| − | + | =Ressources informatiques en code source ouvert= | |
| − | + | ==Logiciels pour le graphisme en code source ouvert== | |
| − | + | Note : ces logiciels sont gratuits et librement téléchargeables sur des différents systèmes d'exploitation. | |
| − | + | Inkscape - logiciel permettant de créer et modifier des images vectorielles (notamment en format .svg) - https://inkscape.org/ | |
| − | + | Gimp - logiciel open source pour la retouche photographique et la création/modification d'images pixellisées - https://www.gimp.org/ | |
| − | + | Scribus - Logiciel open source pour la maquette et mise en page de documents imprimés (brochures, etc) - https://www.scribus.net/ | |
| − | + | Libre Office - suite ofimatique open source, permet de créer des documents de texte ainsi que des bases de données, etc, et permet d'éditer des documents de la suite Microsoft Office (.doc, excel, etc) tout en restant complètement gratuite - https://fr.libreoffice.org/ | |
| − | + | Audacity - logiciel pour l'enregistrement et l'édition de fichiers sonores, permet d'enregistrer et de mixer des sons, et de les exporter en format .mp3 (parmi d'autres) - http://www.audacityteam.org/ | |
| − | + | Floss Manuals - Guides d'utilisateur pour les logiciels open source (en français) - http://www.flossmanualsfr.net/ | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ==Outils en ligne en code source ouvert== | |
| − | + | L'association Framasoft répertorie des alternatives libres en ligne pour tous les outils de Google et d'autres grandes boîtes du web (voir liste sur la colonne à droite de leur site): https://framasoft.org/ | |
| − | + | ==D'autres logiciels graphiques en code source ouvert (plus spécialisés)== | |
| − | + | Processing - outil de création d'images génératives (à partir du code): https://processing.org/ | |
| − | + | Blender - logiciel de création d'images en 3D (contient un moteur pour l'édition vidéo) - https://www.blender.org/ | |
| − | + | Fontforge - logiciel de création de caractères typographiques pour ordinateur (formats .ttf, .otf, parmi d'autres)) - http://fontforge.github.io/en-US/ | |
| − | + | =Design web= | |
| − | + | ||
| − | + | ==Outils et guides en ligne pour le design web== | |
| − | + | ||
| − | + | ||
| − | + | Formats de publication d'images pour les principaux réseaux sociaux : http://iletaitunepub.fr/blog/2016/01/12/un-guide-de-la-taille-des-images-sur-les-reseaux-sociaux-pour-mieux-publier/ | |
| − | + | ||
| − | + | ||
| − | + | Outil pour recadrer la taille du navigateur selon la taille du site web : http://resizemybrowser.com/ | |
| − | + | Guide pour réaliser des sites en Material Design : https://www.google.com/design/spec/material-design/introduction.html# | |
| − | + | ==Apprendre le design web== | |
| − | + | Codecademy - Apprendre le design web - cours HTML - https://www.codecademy.com/ | |
| − | + | OpenClassrooms (anciennement le Site du Zéro) - Apprendre le design web - | |
| + | https://openclassrooms.com/courses/apprenez-a-creer-votre-site-web-avec-html5-et-css3 | ||
| − | + | ==La typographie sur le web== | |
| − | + | Les combinaisons de fontes les plus utilisées sur le web (fontes présentes dans la plupart des ordinateurs): http://www.w3schools.com/cssref/css_websafe_fonts.asp | |
| − | + | Une sélection de fontes gratuites de Google Fonts qui peuvent être utilisées pour le web (et comment les intégrer sur un site web): http://www.awwwards.com/20-best-web-fonts-from-google-web-fonts-and-font-face.html | |
| − | + | ==Blogs de design web== | |
| − | + | Awwwards - prix pour des sites web de qualité : http://www.awwwards.com/ | |
http://webdesignledger.com/ | http://webdesignledger.com/ | ||
| Ligne 123 : | Ligne 112 : | ||
http://www.w3schools.com/html/html_colornames.asp | http://www.w3schools.com/html/html_colornames.asp | ||
| − | + | =Ressources typographiques= | |
| − | + | ==Fontes gratuites de qualité (pas toutes, mais certaines)== | |
| − | + | Font Squirrel : http://www.fontsquirrel.com/ | |
| − | + | Google Fonts : https://www.google.com/fonts | |
| − | + | OpenFoundry : séléction de 30 caractères Open Source : http://open-foundry.com/hot30 | |
| − | + | Librairie de caractères en code source ouvert : https://fontlibrary.org/fr | |
| − | + | The League of Moveable Type : https://www.theleagueofmoveabletype.com/ | |
| − | + | Atipo, créateurs de caractères (certains sont téléchargeables) : http://atipo.es/trabajo/ | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | Sélection de caractères disponibles sur Google Fonts : https://www.typewolf.com/open-source-web-fonts | |
| − | + | Citype - fontes inspirées par différentes villes du monde : http://www.citype.net/ | |
| − | + | ==Apprendre la typographie== | |
| − | + | Jeu pour apprendre à composer des mots (interlettrage) : http://type.method.ac/ | |
| − | + | Jeu pour apprendre à dessiner des caractères : http://shape.method.ac/ | |
| − | + | Règles typographiques (certaines ne s'appliquent pas au français, mais la plupart sont utiles) : http://practicaltypography.com/summary-of-key-rules.html | |
| − | + | Comment combiner des caractères comme un pro (selon Hoefler & Co.) : http://www.typography.com/techniques/ | |
| − | + | Comment combiner des caractères comme un pro (selon Fontshop) : https://www.fontshop.com/content/how-to-mix-type | |
| − | + | Combinaisons de caractères disponibles sur Google Fonts : http://inspiredm.com/7-beautiful-font-pairings-available-free-google-fonts/ | |
| − | + | Comment apprendre à établir les niveaux de lecture d'un texte (simplifié) : https://designschool.canva.com/blog/typeface-fonts/ | |
| − | + | Quelques autres règles et conseils typographiques (en français) : | |
| + | http://www.keskispass.devilles.ca/2013/05/regles-de-mise-en-page-typographique/ | ||
| − | + | Petite vidéo sur le lexique courant de la mise en page : https://www.youtube.com/watch?v=73JBcnbOM8I | |
| − | + | ==Blogs et archives sur la typographie== | |
| − | + | On Snot and Fonts - répertoire de ressources sur la typographie (par Luc Devroye) : http://luc.devroye.org/fonts.html | |
| − | + | Typomanie - actualité typographique : http://typomanie.fr/ | |
| − | + | Design et typo - blog sur Le Monde : http://paris.blog.lemonde.fr/ | |
| − | + | Typographica - critique de nouveaux caractères : http://typographica.org/ | |
| − | + | Plus de ressources typographiques en ligne : https://www.typewolf.com/resources | |
| − | + | ==Outils typographiques en ligne== | |
| − | + | Wordmark - choisir des caractères depuis son navigateur : http://wordmark.it/ | |
| − | + | CopyPasteCharacter - tableau de glyphes en ligne : http://www.copypastecharacter.com/ | |
| − | + | ||
| − | + | Générateur de Lorem Ipsum : http://fr.lipsum.com/ | |
| − | + | =Apprendre le dessin vectoriel= | |
| − | + | Jeu pour apprendre à utiliser l'outil "plume" : http://bezier.method.ac/ | |
| − | + | Comment faire des nodes avec des angles droits uniquement (outil "plume" niveau avancé) : http://theagsc.com/community/tutorials/so-whats-the-big-deal-with-horizontal-vertical-bezier-handles-anyway/ | |
| − | + | =Notions d'Identité visuelle= | |
| − | + | Logotypes classiques en noir et blanc http://logo-archive.org/ | |
| − | + | Histoire de la communication visuelle : http://www.citrinitas.com/history_of_viscom/index.html | |
| − | + | Critique de nouveaux logotypes : http://www.underconsideration.com/brandnew/ | |
| − | + | Art of the menu : collection de menus de restaurants : http://www.underconsideration.com/artofthemenu/ | |
| − | + | Qu'est-ce qui fait un bon logo ? Vidéo (en anglais) : https://www.youtube.com/watch?v=RBTiTcHm_ac | |
| − | + | Chartes graphiques de grandes marques (certaines ne marchent pas) : http://blog.logoenvue.fr/conseil-communcation/charte-graphique-marque-1301 | |
| − | + | Guide pour la création de chartes graphiques pour le web : https://www.smashingmagazine.com/2010/07/designing-style-guidelines-for-brands-and-websites/ | |
| − | + | Graphisme intéractif - http://graphism.fr/ | |
| − | + | =La couleur= | |
| − | + | Jeu pour apprendre à identifier des couleurs : http://color.method.ac/ | |
| − | + | Kuler (sélecteur de gammes de couleur en ligne) : https://color.adobe.com/fr/create/color-wheel/ | |
| − | + | Pictaculous - générateur de palettes adobe à partir d'images - http://www.pictaculous.com/ | |
| − | + | Un autre outil pour générer des palettes de couleur : http://www.cssdrive.com/imagepalette/index.php | |
| − | + | =Infographies= | |
Le travail de l'infographiste David McCandless : http://www.informationisbeautiful.net/ | Le travail de l'infographiste David McCandless : http://www.informationisbeautiful.net/ | ||
| Ligne 230 : | Ligne 215 : | ||
Le travail de l'infographiste Jer Thorp (big data) : http://blog.blprnt.com | Le travail de l'infographiste Jer Thorp (big data) : http://blog.blprnt.com | ||
| − | + | Tutoriel pour créer une infographie : http://www.digitalartsonline.co.uk/tutorials/adobe-illustrator/design-magazine-infographic/ | |
| − | + | Histoire de l'infographie et types d'infographie (sur la Wikipédia en anglais) : https://en.wikipedia.org/wiki/Infographic | |
| − | + | ||
| − | + | ||
| − | + | Un autre projet sur des différentes présentations des graphiques d'information : https://www.behance.net/gallery/6882639/INFOGRAPHICS | |
| − | + | Infographies intéractives sur Bloomberg Businessweek : http://www.bloomberg.com/visual-data/ | |
| − | + | Infographies sur le magazine Wired : http://www.wired.com/tag/infographics/ | |
| − | + | Des graphistes parlent de leurs infographies préférées : http://www.theguardian.com/membership/2014/sep/10/best-infographic-graphic-design | |
| − | + | Historigraphy : graphique intéractif sur l'histoire de l'univers : http://histography.io | |
| − | + | ==Blogs sur le Data Journalism== | |
| − | + | http://flowingdata.com | |
| + | |||
| + | ==Blogs sur le design dans la presse== | ||
| − | + | Quintatinta (en espagnol) : http://www.quintatinta.com/ | |
| − | + | =Art pixelisé= | |
| − | + | http://flipflopflyin.com/ | |
| − | + | ||
| − | + | Petit outil en ligne pour transformer des images bitmap en graphiques .svg : http://www.drububu.com/tutorial/bitmaptovector.html | |
| − | + | ||
| − | + | ||
| − | + | =Inspiration graphique (affiches et visuels activistes)= | |
| − | + | Un mundo feliz http://unmundofeliz2.blogspot.com/ | |
| − | + | Internationales graphiques http://internationalesgraphiques.tumblr.com/ | |
| − | + | Dugugus http://dugudus.fr/ | |
| − | + | Voces con Futura http://vocesconfutura.org/ | |
| − | + | ||
| − | + | ||
