Générateurs 101

Quelle bonne idée de créer un générateur de rayures! Tous les designers devraient avoir ce genre de gadget dans leur poche. Rapide et amusant, ce générateur en ligne permet de générer des rayures selon nos propres spécifications : grosseur, espacement, couleurs, background, dégradés, orientation, etc. Nous pouvons par la suite répertorier nos créations dans leur répertoire de rayures catégorisé par couleurs. De plus, le site contient un blogue fort intéressant. J'y ai en effet découvert d'autres générateurs!

Viva génératoria!

Générateur de rayures

Générateur d'onglets

Générateur de réflexion

Générateur de carotté

Générateur de palettes de couleurs

Générateur de favicon

Générateur de boutons pixels

Une image qui vous représente

Beaucoup d'entre nous utilise des systèmes de messagerie comme MSN messenger et la plupart de ses systèmes de messagerie offre la possibilité à leur utilisateurs d'ajouter une image pour les représenter.

Dans le cas de MSN messenger, les images fournises peuvent varier du chien à la grenouille et laisse le soin à l'utilisateur d'utiliser ses propres images.
Hier au bureau nous sommes tombés sur un site permettant de creer votre image à partir d'élément de bande dessinée (manga). Le site à fait fureur au bureau et je me sens un peu responsable de la vague de non-productivité qui s'en est suivit lorsque tout le monde s'est mis à construire son petit visage via le site.

Cependant, je n'ai pas encore assez de remords ce matin pour vous presentés le site en question. Deux petits hics, il n'est pas totalement compatible linux et il est seulement en italien. Nous avons bien hâte d'avoir une version française ou même anglaise bien que, toutefois, il est très plaisant de voir à quel point l'italien est proche du français.

Lorem Ipsum : L'art du faux-texte

Êtes-vous embêté parfois du fait que vous devez écrire du texte dans un site Web ou tout autre projet sans avoir le texte réelle? «gweigrewiurgidgiwegdiasgd» n'est peut-être pas la meilleure solution et encore moins professionnel n'est-ce pas?!

Qu'est ce que lorem ipsum ?

Lorem ipsum est un texte basé sur des mots latins non aléatoire. Il n'a aucune cohérence ni de signification puisqu'il a été modifié pour en devenir «neutre». Ce faux-texte est utilisé depuis l'an 1500. Il provient en parti d'un texte d'origine latine (livre de Cicero «L'extrême de la bonté et de l'horreur») qui date de 45 av. J.-C.

Pourquoi l'utiliser ?

Lorem Ipsum est utilisé à titre de texte bidon. Il a été pensé pour simuler du texte réaliste afin de faire office de contenu dans des mise en page (dépliant, site Web etc.). De cette façon, l'infographiste ou le graphiste peut calibrer sa mise en page sans avoir le texte définitif. Lorem ipsum est utile puisqu'il donne l'illusion de vrai texte sans nécessairement avoir une signification, ni une connotation linguistique. De ce fait, le client n'est pas distrait par le contenu du texte, mais plutôt concentré sur l'aspect graphique.



«Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce sit amet diam et wisi malesuada varius. Morbi erat velit, egestas ut, blandit sed, venenatis adipiscing, ipsum. Maecenas risus. Donec ac magna. Cras sed justo. Etiam et sem. Praesent euismod sem sit amet enim auctor pulvinar. Quisque nunc.»

Comment l'utiliser ?

Il suffit de trouver un générateur de Lorem Ipsum sur le Web et de copier-coller le texte à l'endroit désiré. Le plus populaire est sans doute www.lipsum.comqui permet de générer du texte sur mesure (nombre de paragraphes, nombre de mots, listes à points etc.). Vous serez enchanté d'avoir cet outil, d'autant plus que son utilisation est reconnu dans le domaine des conceptions graphiques.

Évaluations de sites Web de pharmacies : partie 1 de 4

Occupant la 3e position du palmarès des 150 entreprises les plus respectées des québécois selon la revue Commerce, Le Groupe Jean-Coutu a lancé il y a quelques semaines, une nouvelle version de son site Web. QuiboWeb en profite pour vous présenter, sous 4 volets techniques, une évaluation des principales bannières en pharmacie au Québec soit : Jean-Coutu, Uniprix, Pharmaprix, Familiprix, Proxim et Brunet.

DESIGN ET UTILISABILITÉ WEB

www.familiprix.com

POINTS FORTS
Résolution d'écran : Adapté pour la résolution 800 X 600
Polices de caractère : 3 polices dont 1 accessible pour le web (arial), grosseur standard, polices sans empattements
Palette de couleurs : Accessible pour les daltoniens, bon agencement, bon contraste
Gabarit : bon alignement, bon espacement, emphase sur la mascotte et le service photo
Qualité graphique : Compression normale des images, bonne lisibilité
Objectif du site : Infrmer sur les nouveautés, les dossiers et quizz ainsi que sur les promos en vigueur
Repérage : Impécable!
Iconographie : standard et intuitive
Perception : liens et boutons intuitifs, rollover
Compréhension : Facile
Efficacité : Rapide et facile
Mémorisation : Aucun besoin
Gestion des erreurs : Affiche les erreurs et les solutions
Aspect général : Style corporatif vivant et simpliste, inspire la confiance, la simplicité et le bien-être

POINTS FAIBLES
Résolution d'écran : Une barre de défilement apparaît horizontalement avec la résolution 800 X 600
Perception : Manque un peu de cohérence au niveau des styles des liens et boutons

www.jeancoutu.com

POINTS FORTS
Résolution d'écran : Adapté pour la résolution 1024 X 768
Polices de caractère : 2 polices dont 1 accessible pour le web (arial), grosseur standard, polices sans empattements
Palette de couleurs : bon agencement, bon contraste
Gabarit : Alignement et espacement uniforme
Qualité graphique : Compression normale des images, bonne lisibilité
Objectif du site : Afficher son identité, ses valeurs d'entreprise et ses nouveautés
Repérage : Facile grâce aux menus
Iconographie : intuitive (flèches)
Perception : liens et boutons intuitifs, cohérence dans les couleurs des liens et des rollovers
Compréhension : Facile
Efficacité : Rapide et facile
Mémorisation : Aucun besoin
Gestion des erreurs : Affiche les erreurs et les solutions
Aspect général : Style corporatif simpliste et doux, inspire la confiance

POINTS FAIBLES
Palette de couleurs : Accessibilité moyenne pour les daltoniens (rollover des menus)
Perception : Manque quelques rollovers

www.uniprix.com

POINTS FORTS
Résolution d'écran : Adapté pour la résolution 800 X 600
Polices de caractère : 3 polices dont 1 accessible pour le web (arial), grosseur standard, polices sans empattements
Palette de couleurs : Accessible pour les daltoniens, bon agencement, bon contraste
Gabarit : Alignement et espacement uniforme, mise en évidence d'une seule publicité
Qualité graphique : Compression normale des images, bonne lisibilité
Objectif du site : Afficher les promos, circulaire et services en ligne
Repérage : Facile grâce aux menus
Iconographie : (ne s'applique pas)
Compréhension : Facile
Efficacité : Rapide et facile
Mémorisation : Aucun besoin
Gestion des erreurs : Affiche les erreurs et les solutions
Aspect général : Style corporatif très carré, inspire la dureté et le conventionnel, homogénéité

POINTS FAIBLES
Gabarit : manque d'aération
Qualité graphique : Petits titres bleus flous, images obliques pixelisées
Perception : Manque d'homogénéité dans le style des liens et des boutons, aucun rollover ou presque
Aspect général : Manque de finition, effet «pizza» sur la page d'accueil

www.brunet.ca

POINTS FORTS
Résolution d'écran : Adapté pour la résolution 800 X 600
Polices de caractère : 1 police accessible pour le web (trebuchet), grosseur standard, police sans empattements
Palette de couleurs : Accessible pour les daltoniens, bon agencement, bon contraste
Gabarit : bon alignement, bon espacement, emphase sur l'information et les nouvelles
Qualité graphique : Compression normale des images
Objectif du site : Conseiller, informer et afficher les promos en vigueur
Iconographie : standard et intuitive
Perception : liens et boutons intuitifs
Compréhension : Facile
Efficacité : Moyenne
Gestion des erreurs : Affiche les erreurs et les solutions
Aspect général : Style corporatif épuré, sobre et doux, inspire la confiance et la stabilité

POINTS FAIBLES
Résolution d'écran : Une barre de défilement apparaît horizontalement avec la résolution 800 X 600
Qualité graphique : Manque de visibilité à cause du champs défilant (pour afficher le texte)
Repérage : Désuet à quelques endroits parce qu'il n'y a pas de fil d'arianne
Mémorisation : Obligatoire à certain endroit
Perception : manque de cohérence dans les styles des liens et des boutons, manque des rollovers

www.essaim.ca

POINTS FORTS
Résolution d'écran : Adapté pour la résolution 800 X 600
Polices de caractère : 3 polices dont 1 accessible pour le web (arial), grosseur standard, polices sans empattements
Palette de couleurs : bon agencement, bon contraste
Gabarit : bon espacement, emphase sur la photo
Qualité graphique : bonne lisibilité
Objectif du site : Afficher les thèmes, la carte privilège et le service photo
Iconographie : standard et intuitive
Compréhension : Facile
Efficacité : Moyenne
Gestion des erreurs : Affiche les erreurs et les solutions
Aspect général : Style corporatif doux et artistique, inspire le bien-être, la confiance et la simplicité

POINTS FAIBLES
Gabarit : alignement incertain dans certain cas
Qualité graphique : compression des images trop élevée à certain endroit
Repérage : Désuet!!
Mémorisation : Obligatoire à certain endroit
Perception : manque de cohérence dans les boutons et liens, manque des rollovers
Aspect général : Manque de finition à certain endroit

www.pharmaprix.ca

POINTS FORTS
Résolution d'écran : Adapté pour la résolution 800 X 600
Polices de caractère : 2 polices dont 1 accessible pour le web (arial), grosseur standard, polices sans empattements
Palette de couleurs : Accessible pour les daltoniens, bon agencement, bon contraste
Gabarit : Alignement et espacement uniforme
Qualité graphique : Compression normale des images, bonne lisibilité
Objectif du site : Afficher les promos, cartes de points, catalogue, documentation sur la santé
Iconographie : (ne s'applique pas)
Compréhension : Facile
Efficacité : Rapide et facile
Aspect général : Style corporatif carré mais doux, inspire la douceur et la beauté

POINTS FAIBLES
Résolution d'écran : Une barre de défilement apparaît horizontalement avec la résolution 800 X 600
Gabarit : Aucune mise en évidence en particulier sur la page d'accueil
Repérage : Désuet dans la section «Life brand», aucun fil d'arianne
Mémorisation : Besoin dans la section «Life brand»
Perception : Manque d'homogénéité dans le style des liens et des boutons, manque certain rollover
Gestion des erreurs : Message d'erreurs en anglais!
Aspect général : Manque de finition, effet «pizza» sur la page d'accueil

Des logos... embarassants!

Olivier Bruel a rédigé dernièrement un article sur Go-Referencement présentant des logos, disons, de mauvais goût!

Léger, amusant, déconcertant, à voir!

En voici un échantillon!

L'aire de l'entre-deux : 800 X 600 ou 1024 X 768?

Selon Onestat, la résolution 800 X 600 serait maintenant en baisse de popularité depuis juin 2006. Les utilisateurs préféreraient la résolution 1024 X 768 ou plus.

1. 1024 X 768 55.34%
2. 1280 X 1024 17.23%
3. 1280 X 800 8.23%
4. 800 X 600 8.18%
5. 1152 X 864 3.67%

Le fait est que cela requiert une implication particulière pour les Web designer. Doit-on considérer tous ceux qui utilisent encore la résolution 800 X 600 et ainsi s'assurer d'une plus grande accessibilité à tous?

Doit-on se rendre à l'évidence que l'augmentation de l'utilisation de la résolution 1024 X 768 est si importante que la conception de sites Web à long terme serait alors en format 1024?

Doit-on attendre que l'utilisation de la résolution 800 soit moins que 5% pour passer au format 1024?

Étant donné l'essor des écrans panoramiques, doit-on prendre en considération le 8% de la population encore en 800 X 600?

Et vous, que feriez-vous?

Peut-être devrions-nous considérer chaque projet Web en fonction de sa clientèle cible et des objectifs de celui-ci et ainsi prendre la meilleure décision? L'aire de l'entre-deux nous permet de prendre une décision selon nos préférences... et selon le client!

LogoSauce - Une source d'inspiration et de revenus!

LogoSauce est un site plutôt intéressant car il s'agit d'un portail utilisé par des designers de logos pour promouvoir leur travail. Des logos on en voit partout et chaque jour. Il est très rare d'avoir la chance de connaître l'auteur d'un logo. Les propriétaires d'entreprises eux-mêmes ne sont pas toujours au courant de la provenance du logo!

Il s'agit donc d'une source d'inspiration intéressante mais LogoSauce peut également être une source de revenus! Régulièrement, il est possible de participer à des concours de conception de logo sur le site. Une entreprise soumet une offre de conception en échange d'argent ou de goodies et les designers proposent leur concept. Le logo gagnant touchera le prix et la reconnaissance! Il ne s'agit pas d'un moyen économique de faire faire son logo mais il est toujours intéressant, si le budget le permet, d'avoir des propositions de différents designers car chacun aura une vision bien spécifique de ce qu'il voudra offrir... à moins d'avoir une solution de conception garantie de logo comme QuiboWeb ose offrir!

Bonne conception!

Pour changer la taille de vos images!

Je travaille régulièrement sur le site de rencontre RencontreSportive et un des problèmes qui devient de plus en plus courant, c'est la taille des images provenant des caméras numériques modernes.

Pour des questions d'espace disque, le site limite à 1000K la taille d'une image pouvant être soumise sur le site. Les caméras modernes font des fichiers de près de 2000K ce qui fait en sorte que plusieurs membres ont de la difficulté à ajouter leur photo en ligne.

Voici une solution : Pic Resize 2.0. Pic Resize vous permet de changer les dimensions d'une ou plusieurs images. Il vous permet également de sélectionner une partie de la photo et d'en faire une nouvelle copie à partir de la sélection (CROP). Si tout ce que vous avez besoin est de changer la dimension d'une image, il est difficile de se perdre dans l'interface simplifiée de l'application!

Blender - Un logiciel Open Source pour le 3D

Le logiciel Open Source de cette semaine est Blender. Ce logiciel permet de faire de la conception 3D et de l'animation aussi... N'étant pas un pro en conception 3D, je peux difficilement le comparer aux autres solutions mais il est Open Source, gratuit, il fonctionne en Linux, Windows et Mac et c'est le genre d'arguments qui me rassure!

Toutes solutions de conception 3D complètes demandent une certaine connaissance et une certaine aisance à travailler dans un univers 3D. Pour ma part, je n'en ai aucune mais j'ai quand même réussi en moins de 5 minutes à créer des formes 3D que vous pouvez voir dans l'image ci-dessus.

La documentation de Blender semble être très complète.

Le site de Blender nous propose également une section dédiée aux réalisations faites avec Blender... Je dois avouer que certaines images sont impressionnantes et montrent à mon avis la force du logiciel pour quelqu'un qui sait l'utiliser!

S'il y a des pros en 3D dans la salle, levez-vous et dites-nous vos commentaires!

Thèmes de couleurs

Tout le monde a déjà utilisé les cartons de couleurs disponibles dans le département de la peinture dans les différents magasins de rénovation. C'est très pratique! Ça permet de choisir une couleur dominante et d'avoir des propositions pour les couleurs secondaires... Adobe a maintenant sa version virtuelle de la chose : Kuler.

Ça peut être pratique pour tout le monde n'ayant pas nécessairement de connaissance en design pour trouver de bonnes combinaisons!