Comment créer un motif « Baroque » sous Illustrator

on voit souvent sur les sites en ligne de jolis backgrounds et on se dit que cela serait sûrement du plus bel effet sur notre site, et c’est là que le casse tête commence...

ETAPE #01

Nous allons commencer par créer un nouveau document sous illustrator (ici j’ai choisi un carré de 100 x 100 px, vous pouvez prendre les valeurs que vous voulez :) )

j’ai choisi RVB en vue d’une utilisation web.

ETAPE #02

On créé une forme baroque (avec plein d’ornements qui vont dans tous les sens, vous pouvez trouver plein d’exemple sur le web pour vous inspirer)

on travail uniquement sur la forme, la couleur sera traitée sous photoshop.

ETAPE #03

Ici commence le "calage" des elements ( il va falloir être precis).
Pour la premiere forme ( en bleu ) je la place grâce à l’outil "transformation" (oui oui, le petit carré (ici dans la barre du haut) sert à quelque chose. En effet il indique sur quel point de l’objet nous allons travailler, ici j’ai cliqué sur le carré " milieu / gauche " ( il est noirci pour savoir sur lequel on se trouve ) ) et je place les coordonnées x = 0px et y = 50px ( rappel mathématique, 100/2 = 50, cela signifie que le milieu de l’objet sera placé au milieu de la zone de travail )

• • il est tres important de comprendre ce systeme de placement d’objet • •

ici je crée un double de ma forme et lui applique une transformation type miroir ( objet > transformation > miroir > vertical )

ETAPE #04

idem que l’etape #3 remarquer ici que le point de repere ( carre noir ) a changé c’est desormais le "milieu /droit" qui nous concerne.

je place les coordonnées x= 100px et y= 50px

ETAPE #05

Grâce à la forme que nous avons créée au debut nous allons reprendre quelques élements qui la constitue (afin de rester dans le même ton) pour créer les forme du dessus et du dessous.
Pour le placement nous allons procéder comme les étapes précedentes, à une différence près.
nous faire sortir l’objet ( ici en bleu) du plan de travail, pour cela et afin d’être precis, nous allons toujours utiliser les petits carrés (vous commencez à connaitre) et cette fois nous allons placer le milieu de l’objet en alignement avec les contours du plan de travail ( ceci aura pour but de répéter le motif une fois fini)

Une fois placée, dupliquez la forme (  + C puis  + V) et placez la comme sur l’image

je place les coordonnées x= 50px et y= 100px

ETAPE #06

On rajoute une touche wonkesque, toujours grâce à l’outil transformation nous allons placer les élements au centre (x=50px et y=50px) mais également aux quatre coins, comme pour l’image ci-dessous (x=0px et y=100px)

ETAPE #07

je place les coordonnées x= 100px et y= 0px

ETAPE #08

on exporte le motif une fois fini (fichier > exporter)

On préférea le format .png, qui nous permettra de créer un fond transparent.

ETAPE #09

Dans PHOTOSHOP ouvrez (+O) le motif que vous avez créé, et choississez "utiliser comme motif" ( edition> utiliser comme motif )

ETAPE #10

Dans PHOTOSHOP créez un nouveau document (500 x 500 px, RVB, 72 dpi, fond=blanc) double-cliquer sur l’arriere plan (pour deverrouiller) et ajoutez "incrustation de motif" dans les options de fusions

pour afficher les options de fusion, double cliquer sur l’arriere plan deverouillé.

ETAPE FINALE

Et voilà le travail !!

« Dubo, Dubon, Dubonnet »

Article publié par Groblx

Vous aimez cet article? Partagez le !

Je suis très humblement l’auteur matricule 3128 de ce site, vous êtes en ce moment sur ma fiche membre, vous avez la possibilité de m’envoyer des messages, pour toutes questions n’hésitez pas une seule seconde !

Publiez une nouvelle image

Vous avez réussis à créer une belle image grâce à ce tutorial ? Soyez sympa, partagez la avec la communauté. Utilisez simplement ce formulaire :

Vous devez être connecté pour activer le bouton de validation !

La galerie des membres

Voici les images déjà publiées par les membres de ce site, merci à vous pour votre créativité !

    Questions et commentaires, Il y a 5 messages de forum.

    Vous avez besoin d’eclaircicemment sur un points évoqués dans cette leçon, dans ce cas laissez votre question en utilisant le formulaire ci dessous, notre équipe vous apportera rapidement un complètement d’information. Merci d’être le plus précis possible lors de la rédaction de votre demande.

    • 16 septembre 2009 15:59, par Stoffer

      Salut, J’apprécie ce tuto et je souhaiterai ton accord pour l’ajouter aux tutos que j’utilise lors de mes formations dans le respect des droits d’auteurs.

      le nom de l’auteur sera évidement indiqué sur le support.

      Cordialement,

      Répondre
      • 17 septembre 2009 16:56, par Wonka

        Bonjour,

        Merci de me contacter à cet email pour toute demande de reproduction : wonka@wks.fr

        Merci par avance. Cordialement

        Répondre
    • 10 octobre 2009 23:11, par Votre pseudonyme

      Merci beaucoup mais nous en voulons plusieurs pour nous rassacier

      Répondre
    • 27 août 2010 19:21, par fouzia

      c est un tres jolie totoriau mais je voulais telement savoir comment vous faite cette forme pas par pas.merci

      Répondre
    • 1er septembre 2010 16:51, par Kent’1

      Excellent tuto ! Le résultat est magnifique !

      Répondre

    Laissez un commentaire

    Remplissez correctement le formulaire puis appuyez sur Validez.