Saisei's Illustrations Website
Design ou conception de visuels :
Affiche pour un évènement, couverture pour un projet bd, poster et cartes à vendre, illustration pour cartes de visites, jaquette de dvd, déclinaison en produits dérivés… Design print en général !
Web Design et Design d’application mobile également, puisque je vous partage ici quelques-uns de mes travaux graphiques qui ont le plus trait à l’illustration : personnage d’accompagnement, icônes pour app mobile, charte graphique de site web avec petits dessins :)
… Pour une année d’étincelles, d’éclats, de constructions même fragmentées. L’année 2022 a certes déjà bien commencé tandis les chiffres s’assemblent pour former un nouveau nombre :
Et je l’espère, une nouvelle année qui ne partira pas en éclats (jeu de mots pourris). J’hésitais entre plusieurs versions, j’en partage ici quelques-unes !
Je vous souhaite à toutes et à tous le meilleur pour 2022. Pour une année scintillante certes, tourbillonnante peut-être et (re)constructive si besoin !
L’île des perroquets est en vue ! Alors, prêt à s’envoler vers la liberté… Des terrasses de café ? Très de plaisanteries, bien que la vanne soit d’actualité. A défaut de destinations exotiques, je persiste dans l’art des facettes avec une illustration d’un Ara prêt à s’envoler.
Presque un portrait ! Dont voici un spécimen composé en fragmenté :
Pour mémoire, le dessin polygonal ci-dessus est un close-up, un plan resserré / tronqué de cette illustration d’origine, publiée pour MD drawing :
Une illustration qui m’avait incitée à étudier de plus près le Ara, un perroquet bleu et jaune, en partant de photographiques personnelles – les proportions ne sont pas exactement respectées, de mémoire j’ai agrandi légèrement les ailes… Disons pour des raisons d’esthétique personnelle :
Concernant le low poly, je savais d’emblée que je souhaitais un ciel « à gros blocs » pour que le perroquet se détache bien du fond. En même temps, je souhaitais conserver les contrastes de gris colorés qui émanent des nuages. Une approche qui obligeait finalement tout de même affiner certaines parties du fond… Premier dilemme ! Restait à choisir lequel – voici les trois ciels créés pour cette illustration, plus ou moins contrastés :
Peut-être aurais-je dû me simplifier la tâche et opter pour un fond neutre !
Quant à l’oiseau proprement dit, même approche que le dessin traditionnel : polygoner certaines zones à grosses facettes (une grande partie du corps et de la branche d’assise), au profit de la tête du perroquet, des serres et de l’extrémité des ailes, qui elles, sont bien détaillées :
Pour souligner le côté aérien – et alléger ma composition – j’ai tenté un éclatement des formes : les polygones se fragmentent, les triangles se séparent ! En surfant autour du sujet récemment, j’ai pu voir que cet effet de morcellement / éparpillement est finalement beaucoup utilisé en poly art ^-^ Ici j’ai essayé deux approches :
Bref. Encore des maladresses dans le traitement des facettes triangulaires. Ce qui devait s’avérer un travail de simplification s’est finalement révélé une composition laborieuse plus proche du design graphique que de l’illustration. Notamment parce que mon dessin d’origine n’était pas conçu pour ce type d’approche et que je débute. L’exercice reste sympathique et démontre à quel point j’ai surtout envie de refaire de la 3D !!!
Art polygonal : parrots’ isles in sight est donc le deuxième essai de low poly après Art polygonal : entre façettes et brosse texturée, partagé ce mois-ci. Il fait suite aux croquis de perroquets ; j’ai détaillé la composition quadrillée de l’illustration dans Îles en vue- isles in sight ainsi que le traitement de couleurs et des previews responsives dans Stormy sunset : isles in sight !
L’art polygonal, vous connaissez très certainement, même en totale ignorance du terme. Procédé graphique largement utilisé dans le style « vieux » jeux vidéo 2D – 3D ou plus récemment la VR*, le polygonal art s’est également imposé dans la communication et les illustrations modernes. Le but : que votre dessin semble composé de facettes triangulaires, adjacentes, qui en s’associant, forment des polygones.
J’ignore où et quand l’art polygonal est apparu : peut-être sur les vitraux des édifices religieux, qui imposent un découpage géométrique ? Plus proche de notre époque contemporaine, c’est au festival Geekopolis que j’ai découvert les premiers tableaux en polygonal art, des illustrations à couper le souffle par rapport à l’idée que j’avais du genre ! Une forte impression, car même si j’avais déjà aperçu des réalisations du même procédé, je n’en avais encore jamais contemplées d’une telle richesse et d’une telle complexité, en dehors du jeu vidéo, imprimées en grand format.
L’an dernier j’étais tombée sur un tutoriel qui semblait prometteur et inspirant – je l’avais d’ailleurs partagé sur Twitter et le magazine auteur dudit tuto avait réagi positivement ; une collègue illustratrice – Marie-Aure de Tarragon sur Legend Utopia alias @Nogarra9 sur Twitter – s’est, elle, aussitôt attelée au dessin en partant de la méthode présentée, et a ainsi illustré deux portraits franchement sympathiques dans le style art polygonal *o* De mon côté, j’ai rangé cette technique dans les « projets pour plus tard », jusqu’à ce que Deviant Art lance un projet collectif, en février dernier. Là, déclic !
Pendant le mois de février dernier, l’équipe de Deviant Art a lancé une tendance collaborative visant à envoyer un mot gentil aux autres : proches ou éloignés, amis ou amours, famille ou abonnés. Sont ainsi nées les « Valentines’ Day Cards » ! Trois bases graphiques, les Valentines’ Days Card Templates, étaient proposées : une première déjà illustrée et destinée à un unique ajout de texte, une deuxième carte invitant à placer du texte et un bout d’illustration personnelle, une troisième carte encrée et destinée à être colorisée. C’est cette dernière template que j’ai choisie.
En étudiant le Line Art fourni par l’équipe de DA, j’ai remarqué cet encrage épais, régulier, couplé à des angles brisés, nets, graphiques finalement ; voilà qui m’a guidée pour des couleurs en aplats suivant les contours encrés ! Avec quelques nuances cependant. Plutôt que de rester sur des aplats nets et lisses, j’ai mélangé les facettes de couleurs franches avec une brosses texturée, pour redonner un peu de chaleur à l’ensemble – ce qui me semblait mieux correspondre au sentiment communiqué, entre tendresse et simplicité, mignonnerie et rectitude :
Le résultat donne une illustration évoquant différents aspects : le papier plié en origami sur les étoiles multiples, un ruban rigide et sculpté qui contraste volontairement avec le cœur piqueté, un cœur qui semble se gonfler ou se réchauffer et où la glace se craquelle pour laisser place à une émotion.
Le bas du cœur semble se dégivrer tandis que j’ai transformé l’ombre portée en halo / spot de lumière / portail ouvert. Une métaphore pour illustrer la transmission du sentiment affectif, qui sort de notre monde intérieur pour s’exprimer visuellement, en plein espace et petit à petit en pleine lumière vers la ou les personnes désirées.
Parce que les sentiments reflètent milles facettes, l’art polygonal m’apparaît tout indiqué ! Voici un extrait de mon texte original – auquel une amie auteure, Solène Bauché, a également participé, on reste collaboratif jusqu’au bout dans ce projet 😉 :
I feel like this line art appeals to polygonal art, so here is a mix of textured brushes and poly art ! As the sparkling triangles of polygons suggest it, friendship or love are feelings with a thousand facets : sometimes shiny and clearly visible, sometimes dark and discreet.
*VR = virtual reality. Réalisté virtuelle en Français – je pense ici à la démo d’Oculus Rift, avec la scène du feu de camp en pleine nature, ponctuée d’arbres et de vertes prairies, d’une mare et d’un ruisseau, où vous partagez un moment de pause pacifique avec un lapin, un renard et un buffle, tout en zyeutant les poissons sauter hors de l’eau.
Au prochain article, soit je vous partage un peu plus précisément, techniquement on va dire, mon processus, soit je passe à une autre illustration, elle aussi en polygonal art. Et vous, avez-vous déjà testé l’art polygonal ?
Suite des esquisses, études et croquis de janvier, voici la carte de février dernier pour « 2021 : 1 chiffre pour 1 arbre » ! Un jeu de clair-obscur pour une palette de couleurs presque monochrome, entre le vert et le bleu où le numéral se pare de végétal.
Une version de l’illustration où l’arbre ressemble bien au chiffre 1 :
Un projet thématique intéressant pour ce jeu entre dessin et typographie, où les chiffres évoquent des feuilles, des palmes, voire un arbre complet avec le « 1 ». Le reflet évoque une étendue aquatique, eau qui s’associe au liseré au ras des racines pour symboliser le mycélium – ce champignon qui permet aux arbres de communiquer nourriture et peut-être information, dans les profondeurs du sol. Seconde version illustrée où l’arbre revêt une forme plus naturelle en ce qui concerne sa ramure :
Finalement j’ai donc réussi l’éclairage en dessous, directement au pinceau et sans truchement (cf. mon précédent article sur le sujet) ^.~ J’en avais déjà fait sur des personnages mais peu voire jamais sur des arbres ! Or je tenais particulièrement à conserver cette ambiance claire-obscure, symbole d’une période de transition où le doute voire la morosité accapare, à juste titre, beaucoup d’esprits… Et dont une solution serait accessible en profondeur. Solution finalement proche, au sol à nos pieds, possible dans l’adaptation et la communication. Et pourquoi pas, entre végétal et humain. Même si dissimulée au premier regard.
Les deux illustrations sont disponibles en grand format dans la galerie illustrations de carte de vœux. Pour le processus de création, voir les croquis d’intention et les études en esquisses nocturnes précédemment partagées !
Typographie utilisée : Bernard MT Condensed, un police de caractère actuellement distribuée par Microsoft. Illustration graphique achevée le 21 février 2021. Pour une année plus harmonieuse entre urbain et végétal, entre humains déjà, et avec les autres animaux, toujours.
Suite à une réflexion* sur mes vieux travaux de modélisation 3D – les paysages à tendance fantastiques réalisés avec le logiciel Bryce début 2000 – j’ai opté pour une nouvelle présentation de mes rendus tridimensionnels.
J’avais déjà amorcé la tendance d’un découpage très graphique en 2008 qui me permettait de « raconter une histoire » ou de « situer un sujet » à partir de différents paysages. Début décembre, j’ai repris la méthode – un mix entre découpage en vitrail et planches d’inspiration ! Quelques exemples :
Recherches de composition, tests d’éléments et de texture avec Bryce 2 et Bryce 5
Mes expérimentations ont énormément vieilli ; les rassembler par thème / sujet / atmosphère me permet de leur apporter du sens et de les présenter de manière un peu plus dynamique, ce qui je l’espère, rends ces illustrations plus attrayantes pour vous ^-^
L’autre avantage de cette méthode : elle compense partiellement la basse définition du rendu Bitmap final – mon ordinateur de l’époque générait un 800 x 600px en 72 dpi, soit une basse définition… Je pouvais bien entendu changer le format mais le poids variait en conséquence ainsi le temps de rendu. Ceux d’entre-vous qui créent en 3D en savent quelque chose ^.~
Recherches de composition, tests d’éléments et de texture avec Bryce 2 et Bryce 5
*Depuis octobre dernier, en effet, j’étoffe le contenu illustré de mon compte dessinatrice sur Deviant Art ; j’étais absente de cette communauté depuis 2007 ou 2008 (10 ans en somme) ! Inktober 2018 s’est présenté comme l’occasion d’y revenir ^__^ J’en dirai davantage une autre fois et bref, en ce moment, c’est la galerie « 3D renderings » que j’y étoffe, en espérant toujours pouvoir m’y remettre sérieusement ! Même si ce n’est pas la priorité du moment… Et que je pâlis d’admiration quand je découvre ce qui est publié dans le même domaine à présent !
Pour en savoir plus, et bien que mes créations n’y rendent pas honneur : le site officiel de Bryce – version 7 au moment où j’écris ces lignes – et de son éditeur, Daz3D qui propose une suite de logiciels 3D gratuite.
Pour visionner la refonte de ma galerie de dessins en 3D, rendez-vous sur ce site dans les illustrations d’Yrial in Sight ou sur ma galerie « 3D rendering » de Deviant Art ! N’hésitez pas à me faire des retours sur cette nouvelle présentation ! Merci ^-^
Et vous, goûtez-vous à la 3D ? Êtes-vous davantage attiré par le dessin 2D ou 3D ? Y a-t-il une esthétique qui vous charme le plus entre les deux ?
Suite des évolutions avec le thème WordPress « Twenty Seventeen » : une bonne base !
Ça n’a l’air de rien, mais Twenty Seventeen est plutôt « brut de décoffrage » – voici un avant-après chartage du site sur mon article test :
L’ajout d’un bordereau rose sous le titre et le changement de typographie donne un peu plus de caractère à mon avis !
Il y a eu plusieurs adaptations au thème WordPress Twenty Seventeen : rajout des catégories, tags et possibilités de poster sur chaque article, dès la vue « par archive » et pas seulement sur sur la vue « par article » (retour d’expérience utilisateur).
Mieux vaut avoir des idées de mises en page pour l’enrichir en terme de couleurs, de typographies, d’items ! Et vous passez forcément par la case « charte graphique » puis « intégration en CSS ». Sans compter les widgets qui apportent les fonctionnalités requises (ceci est commun à n’importe quel site WordPress). Dans tous les cas, une lecture assidue de la feuille de style du thème parent s’impose.
Ce changement de thème, assorti d’un grand nettoyage de contenu, m’a aussi permis de me rapprocher de mon intention initiale : douceur, onirisme, simplicité – ici, coins arrondis et conservation de l’esprit cahier.
Voici exemple de simplification avec les éléments clés de la charte d’origine, suivis de leur application sur la nouvelle pagination :
Enfin, j’ai orienté la visite pour une tablette ou un smartphone, avec la suppression de l’antique menu latéral – voici un aperçu de l’évolution :
Les liens sont communiqués dans la section commune à toutes pages d’Yrial – une widget area comme on dit ! Cette réorganisation spatiale m’a fait gagner de la place et j’ai séparé les icônes de réseaux sociaux de celles des autres sites web de mon réseau :
Il manque un de mes sites web, c’est normal car il concerne une activité en pause ^.~
Je vous fais grâce des points de détails du reste de la charte graphique et du scénario de visites. Je me fais plaisir en vous partageant ces histoires sur Yrial… Tout en gardant à l’esprit qu’il s’agit d’un blog de dessin et d’illustrations avant tout !
Et maintenant, dites-moi : que pensez-vous de cette nouvelle version d’Yrial in Sight ? J’ai hâte de savoir ^-^
Suite des évolutions avec le thème WordPress « Twenty Seventeen » : depuis août dernier, Yrial in Sight est prêt pour la rentrée 2018 ! Aujourd’hui ça se discute autour des adaptations graphiques et finalement, autour d’un thème déjà prêt, ou adapté, ou fait main.
Je ne vous le cache pas, un thème « fait maison » ou « fait main » – autrement dit concocté par vos soins, c’est long. Quoi que les professionnels du milieu, dédiés à la création de WordPress et / ou de thèmes WordPress, sont certainement bien mieux rodés à l’exercice que moi !
Si c’était si simple, nous serions une grande majorité à savoir coder et / ou prêt à investir les ressources nécessaires en termes de temps et de connaissance pour bâtir notre thème personnel. Preuve en est, le marché regorge de thèmes prêts-à-installer pour WordPress, en accès payant ou gratuit, proposés par de nombreuses compagnies… Et d’indépendants.
Pour faire court, un site fait maison vous demande diverses compétences ou domaines de veille – surtout si vous êtes autodidacte comme moi :
En comparaison, et pour faire simple, un site web WordPress assorti d’un thème tout prêt vous demande : de cliquer sur des boutons… A condition de capitaliser sur des connaissances antérieures. Car finalement, que ce soit pour le déploiement de WordPress ou le paramétrage des accessoires, la patience supplée rarement au manque de pratique. Et je dois reconnaître farfouiller le CSS pour la mise en page, d’autant que, comme je ne l’ai pas écrit en premier lieu, il me faut d’abord « rentrer dans la tête » de l’intégrateur auteur d’origine.
Voilà pour une grossière introduction en la matière ; à mon avis, tout site exige de faire de la veille et de demander conseil. Et, surtout, d’avoir une idée claire de ce que l’on veut en amont tout en restant souple : autant sur un site fait maison, vous pouvez galérez mais vous maîtrisez vos fonctionnalités de bout en bout, autant, sur un CMS comme WordPress, il faut accepter de déléguer certaines choses.
Ici par exemple, en terme de présentation graphique et de scénario de visite, mon « idée claire » repose sur un univers et un accès direct à l’information. J’ai toujours souhaité conserver une certaine ambiance, donc des éléments comme l’image de fond sont restés présents avant de valoriser mon identité ; voici une rétrospective sur un même article de blog :
Vu de loin, le visiteur sent assez peu le changement entre Nisarg et Twenty Seventeen, les thèmes WordPress utilisés pour les deux derniers aperçus. C’est précisément l’objectif, une transition tout en souplesse en apparence.
En 12 ans de site personnel, j’ai testé le site fait maison, le site avec thème tout prêt (1), et le site avec adaptation d’un thème (2). Avant ce site web, j’avais contribué à d’autres créations en agence, via un logiciel de type « What I See Is What I Get » comme DreamWeaver, mais je suis rapidement retournée à mon blocnote.
Je vous résume ici le cheminement d’un « Yrial @Saisei fait maison » vers un « Yrial collaboratif » à un « Yrial propulsé par WordPress » et toujours en collaboration.
Le site fait main, c’est une occasion de concevoir, de produire et de faire vivre un projet personnel de A à Z ; on apprend, on se rend visible et c’est vraiment gratifiant. Avec le temps et ce qu’on voit des autres auteurs, l’envie de moderniser le site devient presque aussi grande que produire du contenu pour le site. En tout cas, c’est ce qui s’est passé pour moi. Jusqu’à ce que le temps manque cruellement, que les métiers s’étoffent et se complexifient – d’où la collaboration et la délégation, même pour Yrial in Sight.
Pour le thème WordPress fait maison, l’idée a été abandonnée assez vite compte-tenu de l’expertise nécessaire au fonctionnement de la plateforme WordPress proprement dite. Je travaille désormais en collaboration depuis plusieurs années et demander un thème complet reste énorme ! Le sujet « site web : évolutions et nouveautés ! » vous donne déjà un aperçu de ce que l’amélioration d’un site web avec blog implique.
Lorsqu’on choisi de déléguer la technique à un CMS, on peut davantage se concentrer sur le contenu et sa mise en valeur. Ces CMS représentent vraiment un outil de démocratisation d’accès, je pense ; là où, avant leur apparition, une sélection s’opérait inévitablement. En revanche, c’est une erreur de penser qu’ils affranchissent de la rigueur pour la création et la maintenance*.
Concernant le choix d’un thème WordPress, j’ai choisi à chaque fois au plus près de ce que j’avais en tête (je note et je dessine des idées de maquette que je compile ensuite puis je compare avec les thèmes du marché). Ensuite, même si le thème sélectionné exige peu d’adaptation dans sa structure, il en va souvent autrement pour l’adaptation graphique – ici un exemple avec des changements de typographies, d’interlignages, de couleurs, d’arrondis, et ajouts de menus personnalisés :
*Une petite remarque : même en déléguant à WordPress et à l’auteur d’un thème les parties les plus techniques, s’occuper de son site demande du temps, ce ne serait-ce que pour la maintenance – sauvegardes, mises à jour de sécurité, mises à jour de thème et donc d’adaptations graphiques suites auxdites mises à jour de thème… Dans tous les cas, il existe des solutions payantes.
C’est toujours le même triptyque : temps, argent, qualité (envie, connaissances). Si vous voulez de la qualité, vous y investissez du temps et / ou de l’argent ; et ainsi de suite !
A titre informatif :
Voilà pour cette « Évolution du site avec Twenty Seventeen part.4 » ! Et vous, avez-vous déjà tenté de créer un thème WordPress « fait maison » ou « adapté » ? Quelle en est votre expérience ?
Suite des évolutions avec le thème WordPress « Twenty Seventeen » ! Aujourd’hui je vous parle graphisme au service du contenu et plus particulièrement, du parallaxe – ou comme ici, de l’effet parallaxe.
Tout d’abord, pourquoi avoir autant attendu le parallaxe alors que je le proposais en clientèle ? J’avoue que, comme je juge les blogs globalement obsolètes comparés au réseux sociaux, j’avais opté pour le moins d’actions possibles – le moins de clics donc – pour arriver à l’information.
L’autre raison aussi est le probable manque de référencement avec un site web organisé purement en parallaxe – comprendre : chaque lien du menu supérieur renvoie à une section de la page d’accueil et non pas à une page indépendante. Le scénario de visite s’en trouve facilité pour l’utilisateur (qui se contente de scroller) mais le maillage interne au site devient quasi nul, les liens entrants ne renvoient que vers une seule page (la page d’accueil), etc. Les raisons restent multiples.
Cela ne veut pas dire qu’il faut renoncer au parallaxe. Un client ou une cliente dont l’activité débute et se conclut en visu peut tout à fait se satisfaire d’une page vitrine, d’une organisation en one page. D’autant que cette présentation se révèle séduisante en terme d’approche. Pour Yrial in Sight, le défilement des sections en valorisant certaines illustrations favorise la présentation de mon univers :
Par ailleurs, j’ai certes opté pour une présentation en parallaxe mais le menu principal et le bas de page appellent des pages distinctes des sections. Les sections offrent chacune une introduction aux différentes pages et vous invitent à en découvrir d’avantage.
Notez qu’il est tout à fait possible de convertir le thème WordPress Twenty Seventeen en pure parallaxe ! Une fois vos sections crées, vous indiquez les liens de menu principal comme vous le faites avec les liens dans une page ; vous vous souvenez des ancres < a name= »monlien » > et des liens de type « monsite.com/mapage/#monlien » ? Ben voilà !
Voilà pour les nouveautés. Et vous, avez-vous déjà été tenté par du parallaxe ?
—
Autres articles sur le même sujet :
Depuis l’apparition du thème WordPress « Twenty Seventeen » l’an dernier, je songeais fortement à l’adopter ! Surtout pour sa « home page ».
Yrial in Sight a ainsi changé de tête samedi dernier ! Rassurez-vous cette version est évolutive : il manque l’ambiance qui caractérise le blog et les pages du site depuis sa création. Même si on évolue avec le temps.
Pour le lancement, je me suis concentrée sur le contenu et plus particulièrement sur les textes de présentation et d’accompagnement !
Jusqu’alors j’ai adopté ici un ton humoristique pour me présenter, préférant déléguer aux images parodiques le soin de me présenter. L’exposition démarrée en juin m’a amenée à revoir ma biographie sous un autre angle, entre professionnelle et fanzineuse, entre sérieux et décontraction. Ce texte a été la première pierre pour l’évolution en 5.0 d’Yrial in Sight :
En plus de l’adaptation graphique (typographie, charte graphique, visuels d’habillage), je suis en train de repenser la navigation par mots-clés. J’envisage aussi une nouvelle modernisation de la page « info+contact », car, même si les informations communiquées sont toujours d’actualité, elles ne sont guère visitées. Enfin, je compte revoir les tailles des images insérées avant l’import sous WordPress, ainsi que les liens internes au blog et au site
Pour le moment, soyez indulgents car j’y consacre mon temps libre ! Et contrairement à ce que je préconise pour les clients, j’ai choisi de ne pas travailler sur une base + url à part, afin de m’économiser l’url rewriting indispensable aux liens en durs (et non relatifs) pratiqués par WordPress. Ce qui signifie que je travaille en direct.
La suite très prochainement. N’hésitez pas à me faire part de vos suggestions entre-temps ^__^
Et vous, utilisez-vous WordPress ? Si oui, quel thème ?
Pour conclure cette série sur le personnage de Phaé, voici une recherche d’anagramme pour son nom. Comme je l’expliquais précédemment, le prénom devait, dans la mesure du possible, être composé à partir des lettres de P, H, E, A :
Ça a l’air évident, hein ! Pourtant l’idée ne m’est pas venue tout de suite ^^ Je cherchais quelque chose d’original, donc je listais au fur et à mesure, sans me fermer de portes.
Et voici les études pour un logo typographique :
Là il s’agit des recherches « dessinées à la main » et donc non vectorisées. J’aime travailler les logotypes sur fond gris neutre d’abord, afin de forcer les valeur de blanc et de noir. Ensuite je teste les propositions de logos retenues sur fond blanc et sur fond noir, en étudiant les variations de valeurs si besoin. Voilà pour l’aparté graphisme !
