Dessiner un bouton avec Illustrator

Créez un bouton avec Adobe Illustrator

a marqué ce sujet comme résolu.
Auteur du sujet

Tout le monde se secoue ! :D

J’ai commencé (vendredi 30 septembre 2016 à 15h34) la rédaction d’un tutoriel au doux nom de « Dessiner un bouton avec Illustrator » et j’ai dans l’objectif de proposer en validation un texte aux petits oignons. Je fais donc appel à votre bonté sans limite pour dénicher le moindre pépin, que ce soit à propos du fond ou de la forme. Vous pourrez consulter la bêta à votre guise à l’adresse suivante :

Merci !

Effectivement, la structure est peu adaptée. Il vaudrait mieux avoir toute les sous parties au même niveau et supprimer le niveau supérieur.

Pour ce faire, il va sûrement falloir recréer un contenu, parce qu’il faut dès le départ ajouter le bon type de sous-parties.

+0 -0

Pour ce faire, il va sûrement falloir recréer un contenu, parce qu’il faut dès le départ ajouter le bon type de sous-parties.

Aabu

Ou utiliser Zest-Writer qui permet de changer la structure de son tutoriel facilement (drag-drop) sans avoir besoin de récréer un nouveau.

EDIT : si tu m’ajoute en tant qu’auteur, je te fais ça dans la foulée

Édité par firm1

+4 -0

C’est peut-être moi, mais je trouve que ça fait très Trucs et Astuces, plus que tutoriel.

Cliquez ici, appuyez sur tels touches, mettez telle option, tel effet… sans trop d’explications.

Qu’en pensez-vous ?

Édité par Gabbro

Il y a bien des façons de passer à l’acte. Se taire en est une. Attribué à Jean-Bertrand Pontalis

+3 -0

C’est peut-être moi, mais je trouve que ça fait très Trucs et Astuces, plus que tutoriel.

Cliquez ici, appuyez sur tels touches, mettez telle option, tel effet… sans trop d’explications.

Qu’en pensez-vous ?

Gabbro

Vu qu’il ne s’agit pas d’un tutoriel sur le fonctionnement d’Illustrator, ça ne me choque pas. Je trouve que le public visé sont les personnes sachant déjà utiliser un minimum le logiciel. En gros, un tutoriel que l’on lirait après le tutoriel sur Illustrator.

Pour faire bref, le titre dit comment dessiner un bouton et à la fin, on l’a dessiné.

+0 -0

La question n’est pas de savoir si le titre est en adéquation avec le contenu, mais de savoir si ce contenu un T&A ou non. Mon but n’est nullement d’être désagréable ou que sais-je ; c’est une position constante sur ZdS de ne pas valider les T&A (à la création du site, lors de la publication de la ligne éditorial, ou bien dans le guide du contributeur). Ce n’est pas gravé dans le marbre, mais ce n’est pas ici qu’il faut ouvrir le débat.

Il y a bien des façons de passer à l’acte. Se taire en est une. Attribué à Jean-Bertrand Pontalis

+0 -0

Bonjour les agrumes !

La bêta a été mise à jour et décante sa pulpe à l’adresse suivante :

Changelog :

  • La structure a été refaite via Zest Writer pour en faire un "mini-tutoriel".

Voilà, Jiyong tu peux me retirer des auteurs.

Édité par firm1

+1 -0
Auteur du sujet

C’est peut-être moi, mais je trouve que ça fait très Trucs et Astuces, plus que tutoriel.

Cliquez ici, appuyez sur tels touches, mettez telle option, tel effet… sans trop d’explications.

Qu’en pensez-vous ?

Gabbro

Sans trop d’explication ? Suis pas forcement d’accord avec ton constat, j’essai d’expliquer quand y’a besoin.

L’idée et de "Dessiner un bouton avec Illustrator", et je fait ça pas à pas en donnant des informations quand les images ne permettent pas de comprendre.

Bon après c’est pas vraiment ciblé utilisateurs novices qui ouvrent l’outil pour la première fois.

J’ai essayer de faire ça simple pour pas non plus que simplement dessiné un bouton soit quelques choses de trop lourd à faire.

Ceci étant si tu as des interrogations n’hésite vraiment pas à me demander, ça doit pouvoir m’aider à améliorer le tutoriel.

@Firm1 merci infiniment pour la conversion ^^, c’est parfait :D

Par Sans trop d’explication , je veux dire que tu dis souvent faites ça sans dire pourquoi. on ne sait pas si c’est un choix arbitraire de ta part, ou une bonne pratique raisonnée. Au hasard,

Lors de la création de votre document dans les "paramètres avancées" il faut bien sélectionné RVB.

Mode de fusion : Normal Opacité : 100% Décalage sur X : 0 Décalage sur Y : 2px Atténuation : 0 px Couleur : ici c’est du #29264A

Dans le menu "Fx" en bas à gauche de la palette : Sélectionnez "Spécial" et "Lueur Interne"

Après chacune de ces phrases, je me suis demandé Pourquoi ça et pas autre chose ?. Parfois, ce sont juste des préférences personnelles.

J’aime bien les boutons simple avec très peu de variation, du coup je ne fait ici qu’une légère différence teinte du fond du bouton.


Une grosse parti de la section Pour commencer nous allons créer un "Fond" est une suite de faites ci, faites ça. C’est pour ça que je trouve que ça ressemble à un tutoriel de type Trucs et Astuces. En fait, le côté pas à pas renforce cette impression : on ne sait pas plus de chose après ton tuto qu’avant. À part créer un bouton de la même manière que toi sous une version précise (car les images du logiciel, ça perd tout son sens pour peu que l’interface bouge un peu) d’un logiciel spécifique.

On n’a ni appris à faire un bouton (en donnant les bonnes pratiques, les différents style courant, en parlant des différents usages et types de boutons), ni appris à utiliser un logiciel.

Je précise que mon but n’est en aucun cas de te taper dessus. Je n’ai pas formulé ma première remarque à la va-vite, mais je préférais savoir si c’était juste une impression personnelle ou non avant de trop détailler.

Il y a bien des façons de passer à l’acte. Se taire en est une. Attribué à Jean-Bertrand Pontalis

+3 -0
Auteur du sujet

Lors de la création de votre document dans les "paramètres avancées" il faut bien sélectionné RVB.

"Ici nous créons un bouton destiné au web, le format de votre document doit être adapté à une configuration web. Ça semble un peu pompeux, mais il faut surtout faire attention à la colorimétrie."

Après chacune de ces phrases, je me suis demandé Pourquoi ça et pas autre chose ?. Parfois, ce sont juste des préférences personnelles.

Effectivement tu peux faire autres choses, ça reste des paramètres variable sur lesquels tu peux jouer afin d’atteindre ton but.

Dans le menu "Fx" en bas à gauche de la palette : Sélectionnez "Spécial" et "Lueur Interne"

"L’idée ici, est de donner une impression d’enfoncement au bouton, lorsqu’un utilisateur cliquera dessus."

On n’a ni appris à faire un bouton (en donnant les bonnes pratiques, les différents style courant, en parlant des différents usages et types de boutons), ni appris à utiliser un logiciel.

Tu as manipuler l’outil en disant ça ?

Pourquoi RVB pour le web ? Pourquoi Lueur interne pour une impression d’enfoncement ? Et même : pourquoi une impression d’enfoncement quand on clique sur le bouton (je prends l’exemple des boutons pour les lumières : il y a un état haut et bas, pas enfoncé et relâché, on peut donc tout à fait se poser la question, et je suppose que selon les cas, l’un est plus pertinent que l’autre) ?

Tu as manipuler l’outil en disant ça ?

Je ne comprends pas bien la question. Je n’ai jamais utilisé Illustrator, mais j’ai déjà manipulé des outils de dessin vectoriels (assez pour faire un bouton, en tout cas), si c’est ça la question.

Le point central de ma remarque précédant était plutôt :

On ne sait pas plus de chose après ton tuto qu’avant, à part créer un bouton de la même manière que toi sous une version précise d’un logiciel spécifique.

Édité par Gabbro

Il y a bien des façons de passer à l’acte. Se taire en est une. Attribué à Jean-Bertrand Pontalis

+0 -0
Auteur du sujet

(j’ai envoyer mon précédent message avant de le finir, du coup :)

Je précise que mon but n’est en aucun cas de te taper dessus. Je n’ai pas formulé ma première remarque à la va-vite, mais je préférais savoir si c’était juste une impression personnelle ou non avant de trop détailler.

Pas de souci j’essai juste de comprendre autant que toi ce que tu veux me dire hein ! J’y voie vraiment des axes d’améliorations possible…


Pourquoi RVB pour le web ?

Si ta question est  : "pourquoi le RVB" est plus adapté "pour le web", je n’ai pas rédiger ce tutoriel pour revenir sur ce point. Si ta question c’est plutôt : Est-ce que ça marche pour le web si j’utilise le CMJN ? Effectivement tu vas avoir un bouton mais tu seras peut-être déçu des couleurs lorsque tu utilisera ce bouton pour le web.

Mais je souhaite vraiment pas m’étaler sur ce sujet de la colorimétrie dans le tutoriel…

Est-ce que tu pense qu’il faut mettre des pre-requis ? du genre "connaitre un peu l’outil" ?

Pourquoi Lueur interne pour une impression d’enfoncement ?

Ok peut-être que dans cette partie :

"Pour obtenir cette effet, nous allons mettre une ombre à l’intérieur du bouton. Illustrator ne disposant pas de fonctionnalité "d’ombre interne"…"

Et même : pourquoi une impression d’enfoncement quand on clique sur le bouton (je prends l’exemple des boutons pour les lumières : il y a un état haut et bas, pas enfoncé et relâché, on peut donc tout à fait se poser la question, et je suppose que selon les cas, l’un est plus pertinent que l’autre) ?

Cela donne une impression d’interaction avec le bouton. Quand tu enfonce ton doigt dans le bouton de ta souris (irl), le bouton réagis de cette manière… c’est un effet simple à faire (et pertinent)… mais c’est pas le seul effet possible.

Je ne comprends pas bien la question. Je n’ai jamais utilisé Illustrator, mais j’ai déjà manipulé des outils de dessin vectoriels (assez pour faire un bouton, en tout cas), si c’est ça la question.

Non je voulais juste savoir dans quel contexte tu avais suivis le tutoriel…

Le point central de ma remarque précédant était plutôt :

On ne sait pas plus de chose après ton tuto qu’avant, à part créer un bouton de la même manière que toi sous une version précise d’un logiciel spécifique.

Cela t’apprend à créer un bouton dynamique en utilisant uniquement un champ texte et la palette des aspects sous illustrator, sans utiliser plus d’une seule forme par exemple…

Cela te permet également d’avoir un bouton réutilisable et charté pour l’ensemble de tes maquettes, avec les mêmes couleurs, les mêmes espacements, taille de typographie…

Mais c’est beaucoup plus clair quand tu manipule.

Effectivement sous un logiciel spécifique : Illustrator.

Connectez-vous pour pouvoir poster un message.
Connexion

Pas encore membre ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte