Share
Salut tout le monde! Ceci est mon premier tutoriel sur ce nouveau site génial de la famille tuts +. Cette fois, j’ai pour vous un tutoriel très détaillé sur la création d’une conception Web illustrative à une seule page à partir de zéro avec Photoshop. Vous apprendrez à créer une mise en page pour une conception Web d'une seule page, à créer des arrière-plans illustratifs avec un style particulier, à concevoir une barre de navigation flottante, à travailler avec du texte ayant à l'esprit CSS3, etc.… prêt à commencer?
Dernièrement, quelques grands sites de "défilement vertical" sont apparus autour du réseau. Avant de plonger, voyons quelques-uns d’entre eux pour voir l’effet final. Cela vous aidera à placer le reste du tutoriel dans son contexte:
Ce didacticiel nécessite des connaissances de base des outils Photoshop. Par conséquent, je vais ignorer certaines explications de base telles que la création d'un masque de calque, l'ajout d'un guide ou l'ajout d'un calque de texte..
Ma conception est basée sur plusieurs exemples sur le Web d'un style très à la mode, d'un paysage vectoriel panoramique vertical en tant qu'arrière-plan et de zones de texte propres contenant les informations importantes. Imaginez ce site sous la forme d'une seule page en tant que site Web de portfolio d'un concepteur créatif ou d'un illustrateur.
Nous n'entrerons pas dans la partie codage de ce projet car nous allons nous concentrer sur les différentes techniques d'illustration et de présentation, mais elles sont basées sur le populaire plugin jQuery.ScrollTo, que vous pouvez consulter pour obtenir des conseils pour coder ce type de fichier. conception.
Commençons, les atouts de ce tutoriel sont les suivants:
Tout d’abord, nous devons configurer le document de travail; j’ai basé cette présentation sur les 12 colonnes du système de grille 960 que vous pouvez télécharger gratuitement. Sinon, créez simplement un document de 960 pixels et dessinez des guides sur les bordures gauche et droite..
En tant que pratique courante sur les travaux de conception Web, nous devons augmenter cette zone pour voir comment elle se présente avec des résolutions plus élevées, mais nous devons également définir une taille standard pour la hauteur. Cette hauteur doit être la zone visible minimale (au-dessus du pli). puisque nous concevons une mise en page unique. Allez à Image> Taille du canevas et définissez la largeur sur 1420px et la hauteur sur 750px.
Ensuite, utilisez un graphique temporel pour diviser le document en sections, à l'aide de l'outil Rectangle, tracez un rectangle de haut en bas (hauteur 750px). Augmentez ensuite beaucoup la taille du canevas (vous pouvez utiliser l'outil de recadrage ici).
Tracez un guide au bas du rectangle et dupliquez-le, faites correspondre le haut de la copie avec le bas du premier rectangle et ajoutez un guide au bas du deuxième rectangle. Répétez ce processus autant de fois que vous avez de sections sur la mise en page. , dans ce cas, nous avons besoin de 4: Accueil, À propos de nous, Portfolio et Contactez-nous. Ensuite, à l'aide de l'outil Rogner, supprimez la zone de travail supplémentaire. Vous devriez avoir une toile d’environ 3000px de hauteur avec 4 sections de 750px chacune. Supprimer les rectangles de guidage et avancer.
À l'aide de l'outil Rectangle, tracez un rectangle du haut vers le bas de la troisième section. Ajoutez ensuite un style de calque de dégradé en utilisant les couleurs suivantes: #FFFFFF # 6E98C8 # 2A3256 et # 0C0E1A, réglez Angle sur 90 ° (il est très important que ce fond dégradé soit répété sur l'axe des x) et cliquez sur OK..
Dessinez un rectangle sur la quatrième section du document, puis ajoutez un calque> Superposition de dégradé utilisant les couleurs suivantes: # 486302 # 64A500 et # BEDC40. En plus de l’étape précédente, réglez Angle sur 90 °.
Nous allons maintenant commencer à concevoir les éléments graphiques supplémentaires de l’arrière-plan. Le premier élément que nous devons dessiner est une fusée spatiale, qui doit être placée sur la première section du projet. Pour cela, créez un nouveau document (largeur 400px et hauteur 600px) et enregistrez-le sous un nom descriptif tel que "rocket", ajoutez un arrière-plan bleu foncé # 181C35.
Ensuite, en utilisant l'outil Plume, dessinez une forme blanche comme l'image ci-dessous, dupliquez-la et choisissez Édition> Transformation> Retourner horizontalement et placez la copie exactement à côté de l'original, sélectionnez les deux calques et fusionnez-les en appuyant sur Commande / Contrôle + E. Ce sera le corps de la fusée.
Ajoutez à présent un calque> Superposition de dégradé au calque "Fusée" en utilisant les couleurs suivantes: # 0B85DB, # 014C83, # 2396EF, # 004B82 et # 1477B8, réglez Angle sur 0 °, puis appuyez sur OK. Enfin pixelliser le dégradé en fusionnant le calque "Rocket body" avec un nouveau calque vierge.
Créez trois ellipses jaunes à l'aide de l'outil Ellipse et placez-les comme indiqué dans l'image ci-dessous. Rasterisez-les (Cliquez avec le bouton droit sur la miniature de la couche et sélectionnez Rasteriser). Ensuite, maintenez la touche Commande / Ctrl enfoncée et cliquez sur une miniature Ellipse dans le panneau Calques pour sélectionner automatiquement la forme du calque. Utilisez les curseurs pour déplacer la sélection de quelques pixels au-dessus, puis appuyez sur la touche Supprimer pour créer une belle bande incurvée. répéter les actions avec les autres ellipses.
Dupliquez chaque bande et placez-la quelques pixels au-dessus de l'original. Sélectionnez ensuite toutes les bandes et fusionnez-les sur un calque nommé "Rayures". Ensuite, commande / Ctrl sur le "Corps de la fusée" pour sélectionner la forme de la fusée, puis sélectionnez Sélection> Modifier> Développer et définir 2 pixels, puis Inverser la sélection en appuyant sur Commande / Ctrl + Maj + I. le calque "Stripes" et supprimer la sélection.
Sélectionnez le calque "Rayures" et ajoutez un calque> Superposition de dégradé en utilisant les couleurs suivantes: # EFAC00, # BD8401, # C39700, # FFCF2C, # C39700, # BD8401 et # EFAC00 Angle 0 °. Et une subtile ombre portée noire (taille: 2 pixels).
Sélectionnez le calque "Rocket Body" (Corps de fusée), puis à l’aide de l’outil Elliptical Marquee, sélectionnez la pointe de la fusée comme indiqué dans l’image ci-dessous, copiez la sélection et collez-la au-dessus du calque de la fusée et sous les rayures, nommez le nouveau calque "Tip". Copiez le style de calque des rayures et collez le style dans la "pointe".
À l'aide de l'outil Ellipse, tracez une ellipse à gauche de la fusée, nommez-la "Fenêtre", puis ajoutez un style de calque> Incrustation en dégradé dans les couleurs suivantes: # 777777, # E8E8E8, #ADADAD, #FEFEFE, # C8C8C8 et Angle: 0 °.
Ensuite, dupliquez le calque "Fenêtre" et rendez-le un peu plus petit, placez la copie directement sur l'original. Etant donné que l’ellipse est un masque vectoriel, changez la couleur de son arrière-plan en: # 00CCFF et double-cliquez sur le style de calque superposé en dégradé. Dans la boîte de dialogue, changez son mode de fusion en mode écran. Enfin, ajoutez une ombre intérieure subtile au calque "Copier la fenêtre" et, si vous souhaitez, une ombre portée au calque "Fenêtre".
Ajoutons la base de la fusée, mettons d’abord toutes les couches liées à la fusée (corps, pointe, rayures et fenêtre) et fusionnez-les. À l’aide de l’outil Plume, dessinez trois formes, à l’image de l’image ci-dessous, au-dessus du nouveau calque "Corps" et une en dessous. Utilisez cette couleur de remplissage pour les formes: # FBCC28.
Ajoutez trois nouvelles formes représentant le volume à la base de la fusée. Suivez l’image ci-dessous et utilisez cette couleur de remplissage: # AB8204.
Appliquez un style de calque superposé en dégradé sur les socles, utilisez les couleurs suivantes: # FACB2, # FFF393, # FFD952 et # D4A500, réglez l’angle sur 90 °, essayez d’obtenir la même chose que l’image ci-dessous..
Fusionner tous les calques (j'ai toujours laissé une copie des calques vectoriels dans une copie au cas où). Créez une ellipse sur la fusée remplie de cette couleur: # DFF8FF, puis sélectionnez Filtre> Flou> Flou gaussien et définissez le Rayon sur 23 ou 24 pixels, nommez le calque "Lumière". Commande / Ctrl - Cliquez sur le calque Corps de la fusée pour en sélectionner la forme, Commande / Ctrl + Maj + I pour inverser la sélection et supprimer la sélection du calque "Clair". Enfin, changez son mode de fusion en lumière douce.
Fusionner toutes les couches de fusée et les copier. Collez la fusée sur le côté droit de la section 1 de notre document principal.
vous pouvez effectuer cette étape sur le document de fusée ou dans le document principal. Créez deux ellipses à l'aide de l'outil Ellipse, l'un plus petit que l'autre, comme indiqué dans l'image ci-dessous. Utilisez les couleurs suivantes: # FF8A02, # FFC801. Fusionner les deux calques dans un nouveau calque nommé "Fire". Ensuite, placez-le juste derrière la couche "Rocket". Appliquez ensuite un flou gaussien de 9 pixels et utilisez les contrôles de transformation libre pour déformer un peu le feu en le rendant plus étroit..
Ouvrez les pinceaux étoiles des préréglages, puis ouvrez le panneau des préréglages de pinceaux (F5)..
Sous Forme de pointe de pinceau, sélectionnez l’étoile 50 px et modifiez sa taille en 25 px, cochez la case Espacement et définissez la valeur sur 300%..
Sous Diffusion, définissez Diffusion sur 1000%. Contrôle: Pression du stylet (si vous avez une tablette graphique). Compte: 1 et Compte. Jitter: 100%.
Sur Color Dynamics, définissez la gigue avant-plan / arrière-plan sur 100%.
Enfin, définissez la couleur de premier plan sur: # E1F5FF et la couleur d’arrière-plan sur #FFFFFF, puis peignez sur un nouveau calque situé juste au-dessus du calque "Ciel". Vous pouvez réduire l'opacité du calque "Étoiles" pour les rendre un peu moins intenses..
La deuxième illustration supplémentaire de notre conception sera une belle montgolfière. Créez un nouveau document nommé "Balloon" 400px x 600px et remplissez-le avec un calque d'arrière-plan bleu # 476492. Ensuite, en utilisant l'outil Plume, créez plusieurs formes, telles que les pétales de marguerite, pour créer la forme du ballon..
A l'aide de l'outil Peen, dessinez une forme similaire à la première capture d'écran de l'image ci-dessous, puis utilisez l'outil Rectangle, tracez deux barres diagonales à côté et une barre transversale. Avec l'outil Crayon, dessinez un panier très simple et avec l'outil Ellipse, donnez-lui un peu de profondeur.
Maintenant, changez la couleur de fond des calques Balloon en # FFE305 # D00000 et # 0162A7. Sélectionnez ensuite la section centrale et appliquez un calque> Superposition de dégradé à l'aide d'un dégradé Noir réfléchi / Blanc réfléchi. Changez le mode de fusion du dégradé en Superposition et jouez avec l'angle pour donner un aspect légèrement bosselé. Appliquez ensuite un style d'ombre intérieure, en utilisant les valeurs indiquées sur l'image ci-dessous. L'important est l'opacité; il devrait être d'environ 50%. Copiez le style de calque et appliquez-le à toutes les autres formes, au cas où la teinte ne semblerait pas bonne après l'application, double-cliquez sur l'effet Superposition de dégradé, puis faites glisser la souris sur la nuance pour la déplacer..
Modifiez la couleur brune des calques associés au panier: # 874E21 et collez le style de calque de l'étape précédente. Pour l'ellipse interne, utilisez une couleur plus foncée: # 291700. Et c'est tout! Fusionner toutes les couches et utiliser Dodge / Burn Tools pour ajouter des ombres et des lumières.
Copiez le ballon et collez deux copies sur la deuxième section de notre document, l'une plus grande que l'autre. Sélectionnez le plus petit ballon et à l'aide de l'outil Lasso, faites une sélection du ballon réel. Appuyez ensuite sur Commande + U pour régler les valeurs de saturation de la teinte et les modifier à votre guise. De plus, vous pouvez ajouter de la profondeur de champ en rendant le second ballon flou..
Avec le design de fond, il est temps d'ajouter des nuages à notre ciel. Créez un nouveau document nommé "Clouds" de la taille souhaitée et remplissez-le avec la même couleur d'arrière-plan que le fichier "ballon": # 486493. Puis, à l’aide de l’outil Plume, dessinez des nuages blancs comme dans l’image ci-dessous..
Appliquez aux couches de nuages un style de calque> Incrustation de dégradé utilisant les couleurs suivantes: # D1D7E7 - #FFFFFF Angle: 0 degré, et un éclat interne Couleur: # BBD5D6 Mode de fusion: Normal, la taille dépend de la taille de vos nuages. m en utilisant 6px.
Ajoutez des nuages sur la section 2 de notre document principal, derrière les ballons, si vous voulez ajouter de la profondeur au paysage, brouillez un peu les nuages lointains..
Ajoutez plus de nuages près de l'horizon sur la section 3 du document principal, modifiez un peu les couleurs, utilisez #FFFFFF pour Inner Glow et pour la superposition de dégradé: # DBE1F1 - #FFFFFF. Vous devriez obtenir quelque chose comme l'image ci-dessous.
Nous venons de terminer le ciel, souvenez-vous de ne pas mettre les éléments importants à côté de la frontière et de garder toutes les couches organisées. Nous sommes à mi-chemin, c'est le bon moment pour prendre un café!
Ajoutons les montagnes, cette fois-ci, je "travaille bien sur le document principal, à l’aide de l'outil Plume, dessinez une forme en forme de montagne, comme indiqué sur l'image ci-dessous. Appliquez ensuite Style de calque> Superposition de dégradé en utilisant les couleurs suivantes: # 557200 - # 88B707 et définissez l’angle qui vous convient le mieux dans ce cas, 99 degrés, puis dupliquez la montagne, placez-la derrière la première montagne et rendez-la un peu plus grosse et modifiez les couleurs de sa superposition de dégradé: # 415800 - # 8AB00B pour le rendre un peu plus sombre.
Créez un nouveau calque au-dessus de la Grande montagne et nommez-le "Ombres" à l'aide d'un gros pinceau souple. Cette couleur: # 527300 permet de peindre des ombres. Puis Commande / Ctrl - Cliquez sur le calque de montagne pour créer une sélection autour de celui-ci, puis appuyez sur Command / Ctrl + Maj + I pour inverser la sélection et supprimer la sélection du calque "Ombres". Répétez l'opération en créant un calque nommé "Lumières" à l'aide d'un pinceau de couleur vert clair pour ajouter des lumières aux montagnes..
À l'aide de l'outil Plume, dessinez le tronc de l'arbre et certaines branches. Ensuite, sur un nouveau calque, tracez une forme stylisée avec les feuilles. Sur le calque de coffre, ajoutez un style de calque de dégradé à l'aide des couleurs suivantes: # 574E00, # 957800 l'angle dépend beaucoup de votre forme. Pour les feuilles, utilisez les couleurs suivantes pour le calque dégradé: # 577E01, # 8DDA00. Ensuite, ajoutez plus de feuilles sur les petits buissons devant les branches.
Créez plusieurs formes différentes et, si vous le souhaitez, ajoutez une petite ellipse sombre et floue à la base de chaque arbre. Rastérisez chaque arbre et avancez.
Placez les arbres au-dessus des montagnes et du champ verdoyant sur les sections 3 et 4 de notre document principal, rendez les arbres au bas de l'image plus grands que ceux situés à côté des montagnes pour créer une illusion de profondeur de champ, en plus de rendre floue la les plus petits arbres un peu.
Enfin, utilisez les outils Dodge / Burn sur les plus grands arbres pour augmenter l'intensité des ombres..
À ce stade, vous avez un beau fond d’illustration. Placez tous les calques associés à l'arrière-plan dans un dossier nommé "Arrière-plan".
Ajoutons le titre de la page. À l'aide de l'outil Texte, ajoutez deux calques de texte, le premier type "Web design" et le second: "Tutsplus" (vous pouvez bien sûr remplacer ces mots par les vôtres). Ensuite, dans le panneau Caractère, définissez le caractère de police sur Futura Book (vous pouvez en utiliser un autre). Pour la première ligne, définissez la taille sur 42 pt, Kerning: 0pt, cochez l’option Toutes les majuscules et définissez la couleur d’avant-plan sur Blanc #FFFFFF. Pour la deuxième ligne, j'utilise également Futura Book, taille 18 et 1250 pt de Kerning, définissez la couleur de premier plan sur # FFD001 et cochez également l'option Toutes majuscules..
À l’aide de l’outil Ligne, tracez une ligne bleue (# 9AA4D9), ajoutez un effet blanc éclatant et rastérisez la ligne (fusionnez-la avec un calque noir au-dessus ou au-dessous), appliquez ensuite un masque de calque> Tout masquer et remplissez le masque avec un dégradé réfléchi noir / blanc.
Assurez-vous que le titre se trouve à proximité du deuxième guide en partant de la gauche, ce qui correspond à 10 pixels à droite du bord gauche 960..
A l'aide de l'outil Rectangle, tracez un rectangle blanc étroit dans l'angle supérieur droit de la section 1, définissez la valeur de Remplissage sur 25%, puis ajoutez un trait blanc de 1 pixel, Opacité: 50%. Rastérisez le calque en le fusionnant avec un calque noir au-dessus ou en dessous, ajoutez un masque de calque> Masquer tout… et remplissez-le avec un dégradé noir / blanc réfléchi, essayez d'obtenir le même résultat que le bas de l'image ci-dessous..
CSS3 nous permet d’intégrer des polices sur notre site Web. Certains répertoires de polices gratuites fournissent des polices de caractères gratuites prêtes à l’utilisation pour notre conception. Nous allons prendre en main la belle police de caractères nommée "Bonveno". Tapez les liens de navigation en utilisant Bonveno, Taille: 12 pt, Tout en majuscules et Avant-plan: Blanc. Sélectionnez le lien HOME et mettez-le en surbrillance en jaune # FFCF00. Ajoutez un texte instructif: "Aller à" avec bonveno, taille 8px et avant-plan gris.
Pour obtenir un arrière-plan plus agréable, dupliquez le calque "Nav" et déplacez la copie de quelques pixels en bas à gauche. Enfin, modifiez l'opacité de chaque calque à 50%. Placez toutes les couches liées à la navigation sur un dossier nommé "Navigation".
Pour donner plus d'importance au nom du site, sélectionnez le gros mot et appliquez une superposition de dégradé subtile (# C5C5C5 - #FFFFFF) et une petite ombre portée (Distance et taille 2 px), appliquez la petite ombre portée à la deuxième ligne. ainsi que.
Ajoutons le texte de bienvenue, nous allons commencer à ajouter le titre. Comme les titres doivent être en texte brut, utilisez la police de caractères Bonveno et le premier plan jaune (# FFCF00). Appliquez l'ombre portée indiquée à l'étape précédente. N'hésitez pas à utiliser plusieurs guides pour annoter votre contenu. Dans ce cas, je crée des guides 10 px au-dessus et au-dessous du titre de bienvenue pour m'aider à ajouter le texte du paragraphe et son arrière-plan..
En utilisant l’outil Rectangle pour dessiner une zone en tant qu’arrière-plan du texte de bienvenue, utilisez cette couleur # 0E1122 pour la zone en bas de son remplissage à 25%. En plus d’ajouter un trait de 1px en utilisant cette couleur # 4E6575.
Rastérisez la boîte (fusionnez-la avec un calque vide), puis appliquez un masque de calque et remplissez-le avec un dégradé noir - blanc. Vous pouvez utiliser un gros pinceau doux et peindre sur le masque de calque pour masquer certaines zones afin de rendre le fondu plus doux. Enfin, comme pour la mauvaise navigation, dupliquez l’arrière-plan de la boîte et déplacez-le de quelques pixels en bas à gauche pour créer un style similaire à celui affiché en bas de l’image..
A l'aide de l'outil Texte, tracez une zone de texte de paragraphe et remplissez-la de texte Lipsum. Utilisez "Lucida Sans - Regular" comme police, Taille 11px, Première: 19 pts et Couleur de premier plan: blanc. Enfin, puisque CSS3 nous permet d’ajouter ce genre de détails, ajoute une ombre portée noire au paragraphe de texte..
Utilisez les mêmes instructions que celles décrites aux étapes 40 et 41 pour créer un arrière-plan, mais plus petit cette fois. Ouvrez les icônes de réseau social à partir des ressources et collez les icônes suivantes: RSS, Twitter et Facebook, n'hésitez pas à ajouter les icônes de votre choix. Enfin, en utilisant la police de caractères "Bonveno", écrivez le mot "Réseau" en tant que titre et utilisez "Helvetica" (Arial fonctionne également) pour ajouter des nombres blancs d'abonnés, de suiveurs et de Likes..
À ce stade, nous avons la section 1 qui correspond à la page d’accueil (ou page d’accueil) terminée. C'est un bon moment pour vérifier que tout est en ordre, essayez de garder l'équilibre avec le rythme des Blancs, par exemple. l'espace entre le bord gauche et le texte d'accueil et le bord droit avec les icônes de réseau sont les mêmes. Travailler avec des espaces blancs (ce qui, bien sûr, n'est pas littéralement "blanc") est vraiment compliqué, refusez de remplir chaque espace avec une image ou une icône. Un fond large et clair est souvent plus saisissant que mille éléments brillants..
A côté de vous assurer que toutes vos couches sont organisées, au bas de l'image ci-dessous est une structure de dossiers que j'ai faite. L'un des dossiers les plus importants ici est "Nav", je prévois de créer une navigation flottante à l'aide de JavaScript, mais pour la maquette, nous devrons la dupliquer plusieurs fois pour voir à quoi ressemblent les autres "pages" ou sections..
Pour cette section, répétez fondamentalement le processus des étapes 39 à 42, mais placez les calques sur le côté droit de la deuxième section en remplaçant le titre par "About Us". À ce stade, je comptais ajouter une fonctionnalité de volet à onglets, mais modifier la position des onglets en bas, en utilisant la police de caractères "Bonveno", écrivez les onglets situés sous le paragraphe à propos de nous. utilisez cette couleur de premier plan pour les onglets: # C3DFFF et blanc pour l’onglet sélectionné. Enfin, à l’aide de l’outil Polygone, tracez un triangle bleu ciel # D Répondu2 pour marquer la sélection..
Juste pour voir à quoi il ressemble, dupliquez le dossier "Nav" de la section précédente, mais mettez en surbrillance le mot "À propos de nous" sur les liens de navigation. Assurez-vous que tout le contenu se trouve entre les marges de la section et organisez les calques dans des dossiers..
Répétez les instructions des étapes précédentes pour créer une boîte de contenu, mais au lieu d’utiliser jaune pour le titre, utilisez blue: # 336A91 et utilisez la couleur suivante pour l’arrière-plan de la boîte: # 7FA5D2 et un style de calque de trait blanc.
Pour cette section, nous allons concevoir une galerie de portefeuille très simple, à l'aide de l'outil Rectangle, dessinez des carrés bleu clair à la gauche de la zone de contenu récemment créée. et un grand rectangle sur le site de gauche. Ajoutez à chaque case un style de calque> Trait, 1 pixel et blanc. À l'aide de l'outil Rectangle, dessinez des petits carrés en bas à droite du grand carré qui ressemblent à des vignettes pour contrôler un effet de transition, puis ajoutez un texte factice sur chaque carré pour indiquer le contenu à placer. Vous pouvez réellement utiliser des exemples d’images si vous le souhaitez..
En suivant le même processus qu'à l'étape 43, ajoutez quelques liens pour le portefeuille de médias sociaux, comme Flickr ou LinkedIn. Utilisez la police de caractères "Bonveno" pour le titre et cette couleur: # 034D8A.
Dupliquez une fois de plus le dossier "Nav" et sélectionnez le mot "Portfolio". Assurez-vous que tout est dans les limites de la section trois et organisez vos calques.
Nous avons presque terminé, ajoutons maintenant un conteneur pour le formulaire de contact. Dans ce cas, le rectangle doit être vert # 67A802 et le trait vert plus clair # B8D942. Le titre de la section devrait être "Contactez-nous" et j'utilise un avant-plan blanc pour augmenter le contraste avec l'arrière-plan. Fondu un peu la boîte et dupliquer pour créer un effet de double ligne à partir des zones de contenu précédentes.
Enfin, en utilisant l’avant-plan blanc et une taille plus petite de la police de caractères "Bonveno", écrivez les étiquettes du formulaire de contact. Appliquez également l’ombre portée que nous utilisons pour les titres de ces étiquettes..
À l'aide de l'outil Rectangle arrondi (rayon 5px), dessinez les formes suivantes qui deviendront les zones de saisie réelles de notre formulaire de contact. Appliquez e
Accentsconagua