Voici donc une petite sélection de tables diverses ayant toutes un rapport avec le high-tech, les jeux vidéos, … bref si vous avez ça dans votre salon vous êtes vraiment un geek pur souche ( en dehors du fait que vous n’avez pas de goût ;p ).

La table Iphone

A tout seigneur, tout honneur puisque nous commençons par une réplique du célèbre appareil d’Apple. Créée par Tuan Nguyen cette table Iphone a la particularité d’être entièrement collée avec de la simple colle blanche et les icônes de l’écran sont en fait des sous-verres, bien pensé en fait …

La table Ipod

Puisque nous sommes dans la gamme Apple restons-y avec cette table, pas très grande 120 x 75 cm, inventée par Mirko Ginepro un designer industriel. Elle est conçue en Corian (un matériau utilisé dans les salles de bains et les cuisines) avec un vrai écran en verre et des pieds en métal. Son nom de code : iCoffee Table

Ipod Table

Toujours basé sur l’Ipod et sur la marque Apple (qui semble faire le bonheur des créateur d’objets geek ), voilà une seconde version de ce que donnerai un Ipod table. A la différence de la précédente, celle-çi est « pleine » (pas de rangement intérieur) mais possède des pieds sous forme de casque audio qu’il est possible de retirer/ajouter facilement. Faut faire gaffe de pas se prendre les pieds dedans ;)

La table Astérisk

Là il y a du concept vu qu’il y a quelques touches du clavier qui pourraient correspondre à l’appellation « table pour geek » ( par exemple la table arobase, la table dièse, … ). En attendant voilà une table Asterisk sur roulettes dont le prix est de 300 euros.

La Rubik’s Table

Tout le monde sait ce qu’est le Rubik’s Cube et il n’a pas fallut longtemps que quelqu’un aie l’idée de faire une table basse représentant le gros cube de couleur. Pas forcément jolie elle n’en coute pas moins 600$ et pour ce prix-là vous ne pourrez même pas faire tourner les faces :)

La DelightTable

A l’heure des interfaces tactiles du genre Microsoft Surface, voilà un modèle plus petit à installer dans son salon. Lorsque vous commandez la DelightTable il est possible de choisir le type de pied ou encore la couleur de l’encadrement. Niveau prix et à titre d’estimation, une 70*70 cm tourne quand même autour des 800 euros.

La manette Nintendo

Ahhh si comme moi vous avez joué des heures durant à la Nintendo dans laquelle il fallait engouffrer des cassettes de jeux aussi grosse que des doubles tartines de pains dans le grille-pain, et bien ça vous rappellera des souvenirs.

Cette table Nintendo Nes reprend non seulement le design d’une manette de la console mais est complètement fonctionnelle, oui vous pouvez jouer avec ! De plus la base est un espace de stockage et en voici une démonstration live :

Personnellement, à part la Delight Table, je trouve ça assez moyen en tous cas pour un salon ou un séjour. Par contre pour une chambre d’enfant ou dans une pièce dédiée au jeu en général ça peux être assez sympa non?

C’est toutefois intéressant d’avoir sous la main toute une panoplie de patterns car elles permettent d’habiller un arrière plan très rapidement et sans devoir charger une image trop lourde. Elles peuvent aussi être utilisées pour faire un fond de bannière, un arrière-plan de titre, … ( et là elles ne ressemblent plus à des patterns classique car elles sont coupées, déformées, étirées, … ).

A vous de mixer ça correctement avec quelques polices bien choisies !

1. k10k.net : http://k10k.net/pixelpatterns/

Près de 1.000 patterns disponible ( vous pouvez ajouter les vôtres si vous le désirez )

2. ColoursLovers section patterns : http://www.colourlovers.com/patterns/top

Des milliers de ressources classées par couleur, par notation, par date, … Surement l’un des sites les plus intéressants de la liste ( j’en avais déjà parlé pour les palettes couleurs et le site possède tout un tas d’autres outils sympa )

3. Pattern4U : http://www.kollermedia.at/pattern4u/

Presque 300 patterns classées par catégories. De très belles choses.

4. About.com : http://graphicssoft.about.com/od/photoshopdownloads/ig/Photoshop-Patterns/

Une page pleine de ressources sur les patterns : 7 pages de patterns, installation dans Photosphop, ajout de brosses, …

5. Helens Images : http://www.helensimages.com/gimp1.htm

Quelques-unes à récupérer sous Gimp.

6. Squidfingers : http://www.squidfingers.com/patterns/

Un peu plus de 150 patterns disponibles ( 158 pour être exact )

7. Fontastica : http://www.fontastica.com/patterns.html

Un peu particulier celui-ci puisque vous allez en fait utiliser des images texte répétées pour créer un arrière plan. Concrètement vous allez donc récupérer une police d’écriture qu’il suffira d’utiliser via Photoshop pour générer un arrière-plan voulu.

8. Xandorra : http://www.xandorra.net/tut_pat.php (semble mort)

12 sets de 20 patterns à télécharger. Vous y trouverez aussi des tutoriaux divers et des palettes couleurs.

9. Graphics Soft : Lien complet de ressources

Toutes les ressources disponible concernant les pixels patterns dans la section graphique d’About.com ( des centaines d’informations )

10. Micro Patterns : http://basstar.deviantart.com/art/Micro-Patterns-74512283

Un fichier de 54 micro patterns à télécharger sur Devian Art.

11. Pixel Patterns : Lien complet de ressources

Des milliers de pixel patterns à disposition sur devianArt (attention aux licences)

Et pour terminer ( parce que oui je comprendrais si vous n’aviez pas trouvé votre bonheur ), voici un petit tutoriel Photoshop qui vous permettra de créer sur mesure celle qu’il vous faut.

Si vous voulez aller plus vite voici un petit outil en ligne qui vous aidera surement.

Crédit Image [Flickr]

Pour me faciliter un peu le travail la prochaine fois, j’ai donc commencé à faire un liste dédiée aux écritures de ce genre, puis je suis tombé sur ce billet chez Designmag: « 50+ Fonts for Big, Bold Headlines« .

Y sont présentés aussi bien de grands classiques (Arial black, Impact, Franklin Gothic, …) que d’autres moins connues, comme les « Episode 1 » (Style Star Wars), « Rockwell Extra Bold « , « Museo » ou encore « Kenyan Coffee » (que je trouve très sympa).

J’ai aussi déniché un article intitulé « Best Typography links from around the world » qui est une superbe page de ressources pour tout ce qui touche à la typographie & Co. Vous pourrez y trouver des liens très intéressant sur l’anatomie des polices web, un guide pratique de la typographie sur le web, des astuces pour jouer avec les propriétés des fonts, comment jouer avec des styles d’écritures adaptés à vos besoins (message publicitaire, newsletters, …), des outils pour créer vos propres choses ainsi que des blogs et des magasines spécifiques sur le sujet. Bref tout un tas de sources sympa, un billet à bookmarker.

Et puisque nous sommes en train de jouer avec nos fonts, voici peut-être quelques outils que vous ne connaissez pas :

- Clickfont : permet d’installer une police en faisant simplement un clic droit => Install Font.

- CSS Type Set : permet de modifier vos polices suivant différents critères et voir « en direct » l’effet que les changements donnent. Le code CSS correspondant est récupérable en 1 seul clic pour l’intégrer dans votre fichier .css (vu chez Guillaume)

- What The Font ? : vous permet de retrouver le nom d’une police en envoyant simplement une image de cette dernière ou un lien sur laquelle elle apparait.

Voilà donc encore de quoi jouer un petit peu avec vos textes ;)

[Crédit Photo]

L’outil se présente comme quelques choses de très simple mais il possède pas mal d’options et s’avère très facile d’utilisation. En gros il vous faudra simplement uploader une image depuis votre PC et lui dire quoi faire avec.

Alors justement que peut-on faire ?

Et bien si vous ne faites qu’uploader une image et poussez le bouton il va tout simplement optimiser cette dernière pour qu’elle soit plus légère en poids et qu’elle se charge donc plus vite lors de l’affichage de vos pages. C’est intéressant pour les blogs qui balancent pas mal de photos dans leurs billets ( histoire de penser aux petites connexions ), le gain en poids est parfois loin d’être négligeable. D’ailleurs vous aurez l’information de combien de pourcentage vous avez gagné.

Vous pourrez aussi :

• recouper une image et ne prendre que la partie qui vous intéresse ( cropper )
• ajouter des bordures ( sur 3 rangs )
• redimensionner l’image
• faire pivoter dans tous les sens
• améliorer la netteté
• choisir la qualité de l’optimisation
• modifier la teinte
• passer la photo en mode monochrome (noir/blanc)
• changer le contraste, l’exposition, la saturation, …

Bref pas mal de choses. Oui je sais, si vous avez l’habitude de jouer un peu avec vos images vous devez avoir soit une solution complète sur le Pc ( Photoshop, Gimp ou autres ), soit un outil plus complet en ligne, mais je trouve que c’est une bonne petite solution toute simple pour celui qui n’a que de petites modifs à faire, un umpc un peu léger pour faire tourner un vrai soft, … et puis il ne faut pas toujours parler des mêmes ;)

crowdSPRING se base sur le même principe. Que vous ayez besoin d’un nouveau logo, un nouveau design de site web, de matériel marketing personnalisé (carte de visite, newsletter, … ) ou d’une illustration quelconque, vous allez pouvoir demander aux créatifs de jeter un oeil sur votre demande. Mentionnez ce dont vous avez besoin (vous devrez remplir un petit brief expliquant quel sera l’utilité de la création, l’ambiance à donner, …), le type de fichier que vous voulez récupérer, dans combien de temps il vous le faut et surtout combien vous êtes prêt à payer. Ensuite apprenez la patience :)

Vous serez prévenu au fur et à mesure que des travaux arriveront. Ces travaux ne seront pas des propositions ou des offres mais bien des travaux finit. Au fur et à mesure des arrivées vous pourrez les noter, les commenter, donner vos appréciations et dialoguer avec les créateurs pour arriver au résultat attendu.

Les graphistes quand à eux vont pouvoir se créer un profil assez basique, mettre en place un petit portfolio de leurs réalisations, se faire un peu de promo et bien entendu gagner un peu d’argent (ils touchent 100% du prix de la vente, le crowdSPRING ne prend rien au passage).

Pour le paiement justement, le système en place est le suivant : l’acheteur verse la somme au préalable sur un compte sécurisé. Il est assuré d’avoir au moins 25 propositions (s’il ne les reçoit pas il peux récupérer sa mise et ne rien accepter) et le versement est sécurisé.

J’ai regardé un peu les résultats obtenus et il y a vraiment de belles choses et en certaine quantité. Par exemple, une personne ayant demandé un logo pour un site de jeux de science-fiction sur mobile à reçu pas moins de 65 propositions sur 2 semaines de temps. Son offre : 300$ (~200 euros), ce qui n’est vraiment pas énorme.

Forcément la qualité à plutôt tendance à être inégale puisque cela va dépendre non seulement des aptitudes des graphistes eux-même mais aussi de ce que sont prêt à débourser les acheteurs. C’est différent d’un Wilogo ou le tarif est fixé d’avance et ou l’ont sait à quoi s’en tenir. En investissant 100$ vous vous retrouverez surement avec 3 pauvres propositions pas géniale, à 600$ vous risquez d’avoir plus de choix. A vous de voir :)

Pour ceux qui ne le savent pas encore Aviary se veux être une espèce de Photoshop en ligne, complet, ergonomique et gratuit. Et ce qui en a été dit et montré jusqu’ici laisse présager un service très puissant. Au total se sont pas moins de 18 outils qui devraient être proposés, principalement réalisés sous AIR et Flex (ce qui devrait permettre de les rendre accessible également depuis le bureau et pas seulement en ligne).

La suite Aviary ne se veux pas seulement 100% axé création puisque dans les produits proposés (chacun ayant un emblème d’oiseaux différent) ont va également trouver un identificateur d’image (pour la paternité), une place de marché (vente d’images), un système de stockage, un éditeur musical, …

Actuellement seul l’éditeur d’image (nommé Phoenix) est disponible mais cela permet aussi de se faire une idée de l’interface générale du produit, que je trouve plutôt réussie.

Une fois loggué vous avez 2 menus horizontaux bien distinct.

1- Menu général :

C’est le menu généraliste de la suite Aviary. Vous y trouverez un retour à l’index, un accès aux différents outils qui composeront le service au final, un lien vers la banque d’images des créations des utilisateurs, l’accès au forum et au blog, l’a-propos, la FAQ et le bouton de déconnexion de votre compte. Classique et sans surprises.

2- Votre menu personnel :

- Le « dashboard » (tableau de bord) va vous offrir un aperçu rapide des l’activité autour de l’édition d’images : quelques créations d’autres personnes, les 4-5 derniers ajouts dans la banque d’images, les collaborations de la semaines et vos derniers travaux à vous.

- « Votre profil » vous permettra de choisir une avatar, d’ajouter une petite description, changer vos mots de passe, gérer vos permissions (qui peux voir vos images, qui peux els éditer), de suivre votre activité récente, …

- « Vos images » va être le centre de gestion de tout ce qui touche à l’image (boum une palissade dans les dents). Non seulement en affichant vos travaux mais également ceux de vos amis, ceux que vous avez préférés (mise en favoris) ou toutes ces catégories d’un coup.

Vous pourrez trier par dates d’ajouts ou de création, par nom, faire afficher les thumbnails (les miniatures), etc

- « Les artistes favoris » est quant à lui l’onglet qui vous permettra de gérer vos amis, de suivre l’activité de vos créateurs préférés, voir qui est fans de vos travaux, …

A côté des ces 4 onglets, une sidebar droite dans laquelle vous trouverez un moteur de recherche et différente options comme un bouton d’accès direct à l’éditeur d’image, un uploader, la gestion de vos invitations, commencer une discussion forum, …

Passons maintenant à l’outil concret à savoir l’édition d’image, à laquelle on accède en cliquant sur le bouton « Phoenix« .

Première chose, c’est plutôt joli. Par contre ça n’ouvre pas l’application directement dans le navigateur mais dans un pop-up géant de la taille du navigateur (comme si vous lanciez une seconde fois Firefox donc). Là on va vous proposer de partir de rien ou d’importer un travail. Si vous partez de rien il vous faudra entrer les dimensions du calque de base et la couleur du background.

Je ne vais pas comparer à Photoshop, que je ne connais pas parfaitement d’ailleurs, mais j’ai l’impression que Phoenix se débrouille pas mal en comparaison. Après quelques recherches j’ai trouvé ce dont je me sers le plus souvent sur Toshop assez facilement (claques, dégradés, gomme, texte, ombrages, divers filtres, …) et même que pour certaines choses c’est beaucoup plus simple sur Aviary (les dégradés notamment, ou les sélections en forme d’étoiles, de soleil ou d’hexagones, …). Maintenant je ne suis pas du tout un utilisateur avancé et il faut garder à l’esprit que Phoenix n’est qu’une partie de la suite, donc on ne va pas tout y trouver comme c’est le cas sur Photoshop (le nuancier est un outil séparé, la création de motifs également, …).

A noter que l’importation d’images peux se faire non seulement depuis votre ordinateur ou vos images stockées sur votre compte Aviary mais également directement depuis une URL,depuis votre compte Flickr, Picasa ou Facebook.

J’ai 5 invitations pour celui qui veux ;)

Mais pour les habitués cela peut aller bien plus loin et à bien plus grande échelle. Comme de faire une animation Star Wars par exemple.

Sauf que tout le monde n’a pas forcément le temps de passer ses journées à « Ascii-er » même s’il en a envie, voici donc 4 outils pour vous faciliter la vie :

1- ASCII Generator :

Le plus basique de tous, il permet de passer du texte en mode ascii en sélectionnant le type de police, un reflet, la taille, … Il vous suffit alors de copier-coller le résultat et le tour est joué.

2- GlassGiant :

Ce site propose déjà quelque chose de supérieur au précédent puisqu’ici il ne s’agit pas seulement de jouer avec du texte mais bien avec des images (c’est quand même là que l’art ASCII prend son ampleur). Vous allez donc pouvoir choisir une image sur le web (ou une image présente sur votre PC) et la faire transformer en mode ASCII par l’outil en ligne. C’est très rapide et plusieurs options sont présentes : la largeur maximum, la taille de la police utilisées, le type de couleur (blanc sur fond noir ou noir sur fond blanc), etc…

Les exemples proposés vous montrerons de suite ce que ça peux donner.

3- ASCII-O-Matic :

Encore un cran plus loin, cet outil vous permet non seulement de rendre une image en ASCII (image que vous pouvez également uploader) mais aussi en mode »puces » (petit carré). Vous pouvez aussi choisir si vous préférez le noir et blanc ou la couleur et même récupérer directement le code HTML adéquat pour l’insérer dans vos propres sites.

4- Un autre petit outil qui ne paie pas de mine mais est relativement complet (français de plus), et qui va notamment offrir la possibilité de mettre une certaines parties des lettres en couleur, de choisir précisément sa couleur de fond, la qualité de l’image, de récupérer le code skyblog ou HTML, et plein d’autres choses sympa. Je vous conseille un essai et voir la longueur du fichier généré, c’est assez impressionnant (en fonction de la photo proposée, vous serez d’ailleurs limité à 300Ko maxi)

Il en existe bien d’autres (et encore d’autres) mais tous fonctionnent sur le même principe, par contre il existe un webring de codeurs ASCII, vous pourrez donc y trouver quelques sites de personnes s’adonnant à cet exercice.

Moi ça me rappelle les toutes premières consoles auxquelles j’ai joué étant tout petit (Atari & Co).

Lorsque vous êtes suffisement graphiste que pour créer un thème WordPress « from scratch » (en partant de rien) ou dessiner des logos, et que vous voulez vous faire non seulement un petit peu d’argent mais aussi gagner de la notoriété, que faites-vous ?

Oui exactement, vous avez tout juste, bingo! : un concours dont les premiers prix seront votre savoir faire.

C’est l’idée du monsieur derrière Cuadroz. Et la réalisation est très simple à comprendre.

Chaque petite brique de la page concours est à vendre pour la modique somme de 3 euros. Si vous l’achetez vous y mettrez votre icône personnelle qui sera alors un lien vers votre blog. A la fin du concours (le 31 décembre), seront tirés au sort les 3 gagnants.

Le premier prix recevra donc un thème complet avec son header, personnalisé tout les 2, ainsi qu’un logo et 1 an d’hébergement gratuit. Hébergement plus qu’honorable puisqu’il sera de 2.5 Giga d’espace disque, de 50 Giga de bande passante, sous-domaines illimités, base de données MySql illimitées, …

Le second remportera quant à lui un logo personnalisé et un header à appliquer sur son thème déjà existant. Enfin le 3ème repartira avec un logo.

A noter que le créateur s’engage à ne considérer les commandes comme complètes qu’une fois le bénéficiaire entièrement satisfait du travail, que le thème sera valide W3C et que les fichiers format .PSD vous seront remit (ce qui vous permettra de faire des modifications par la suite de votre côté).

Pour les autres tout n’aura pas été investit en vain puisque vous aurez bénéficié d’un peu de publicité sur le site et que vous recevrez 2 liens en dur, sans attributs « nofollow » et pour une durée d’un an, ce qui vous aidera un tout petit peu en terme de référencement, PR, etc… (bon ok un tout petit peu quand même).

Et à quoi va servir l’argent ? A acheter un Mac Book Pro 15 pouces pardi !

Je ne liste pas les 230.000 autres, vous pourrez les voir dans cette section. Vous pourrez vous abonnez au flux RSS vous prévenant de chaque nouvel ajout (attention que ça risque d’aller vite ^^). Et si vous ne trouvez pas votre bonheur, aucun problèmes ils ont pensés à tout puisqu’ils mettent à notre disposition un outil pro afin de créer nos propres palettes personnelles (en fonction de si nous préférons une palette basée sur les déclinaisons de couleurs, les oppositions, la complémentarité entre chaque, …)

Les patterns quand à eux, sont des espèces de textures pouvant avoir plusieurs utilités dont notamment celle de servir de background de fond (vous savez cette image conçue pour être répétée autant de fois que nécessaire horizontalement et verticalement ?).

Le site vous en propose plus de 3300 et chaque pattern dispose de sa description, de son inspiration, vous pourrez tester et voir ce qu’elle donne en plein écran, générer un « badge » à partager, …

Mais l’intérêt de ColourLovers ne s’arrête pas là car, autant les palettes que les patterns, sont téléchargeables gratuitement et cela dans divers formats tel .ai, .aco, .cs, .html,… (il vous faudra quand même vous inscrire au préalable).

A côté de tout ça, le site est aussi un espace communautaire de type devianart ou chacun aura son propre profil, ou vous pourrez noter les créations, laisser des commentaires, partager, bookmarker, ajouter des tags, suivre les nouvelles créations d’une personne en particulier, joindre divers groupes, …

Les stats de la plateforme sont plutôt jolies à regarder : 42.000 membres, pas moins de 350.000 commentaires et plus d’1 million de notations. Il y a également un forum et un blog si vous n’en avez pas assez avec le site en lui-même. D’ailleurs sur leur blog il montre un exercice intéressant qui est de montrer comment, à partir d’une image, il est possible d’en déterminer la palette couleur. Blog d’ailleurs très bien intégré dans la charte du site (même si énormément trop long point de vue scroll vertical)

Vraiment un endroit à mettre en favoris pour les graphistes et les autres je pense ;)

Pour certains d’entre-nous avoir accès à une multitude de types d’écriture différentes est important, que ce soit pour personnaliser des bannières, des titres, …

Tout le monde connait le site Dafont qui en propose déjà une belle série (~10.000) mais toutes ne sont pas gratuites, d’autres ont des licences particulières, … voici donc une série de ressources différentes si les milliers sur dafont ne vous suffisent pas :

- Pimpyourfont : Testez votre font et téléchargez là gratuitement, plus de 15.000 sont déjà présentes et il y en a de nouvelles régulièrement. Un tout nouveau site qui permet de naviguer suivant une catégorie, un nom ou une date d’ajout.

- Abstract Fonts : plus de 13.000 polices différentes, un must. Différentes classifications sont disponibles : l’ordre alphabétique, les catégories, les auteurs, les nouveaux ajouts, … un fil RSS est également disponible pour se garder au courant des nouveautés. Summum, un catalogue au format PDF est téléchargeable histoire de pouvoir montrer à d’éventuel client les différents types disponible en déplacement.

- Creamundo vous en quand à lui propose pas moins de 9800. Vous disposez aussi d’une prévisualisation en temps réel pour voir ce qu’un petit texte donne.

- Sketchpad : plusieurs centaines de polices disponibles.

- UrbanFont : un très joli site, assez connu, qui vous propose également plusieurs centaines de polices. Vous pourrez les choisir par catégorie, par ordre alphabétique, via un top 100, … Le petit plus de ce site est de vous permettre de tester aussi bien diverses couleurs d’écriture que de fond, ce qui vous permet de voir très vite si un type est adapté à votre site sans télécharger 36 fichiers.

- Simply The Best Font : quelques centaines de « fonts » disposant chacune d’une fiche particulière (ou l’ont apprend pas grand chose).

- Kids Font : des polices pour les petits n’enfants que nous sommes tous.

- Best free fonts : qui dispose d’un menu d’accès rapide à différentes catégories de polices (comme les styles « glace », « calligraphie », « école », …)

- 1001 Free Fonts : comme sont nom ne l’indique pas il dispose de plusieurs milliers de polices en stock. Choix entre les polices pour PC ou pour Mac notamment. A noter aussi un « super bouton » (payant) qui vous permet de télécharger en 1 clic plus de 6500 polices (comptez 15$ quand même).

- Acid Fonts : chaque jour une nouvelle police ajoutée.

- Better fonts : plus de 10.000 polices également. Prévisualisation possible, personnalisation du texte de présentation, …

- ShowFont.net : quelques unes de plus si vous n’êtes pas rassasié. Avec en prime la marche à suivre pour ajouter une police à votre windows.

- Enfin je vais terminer par la plus grosse base présente dans la liste : Search Free Font avec ses 13.000 polices et des brouettes. De quoi faire passer un paquet de nuit blanches aux plus accros d’entre vous ! Le site propose aussi 31.000 polices payantes.

Je pourrai aussi ajouter à la liste : Fontlet, Neatfonts, Typenow.net, Fontshop, Veer voir même Youfont, Moorstation, Free Fonts (qui n’est en fait qu’un aggrégateur de divers sites) ou Fun Fonts. Mais bon je pense que vous en avez assez non ?

Ah oui il y a les 9400 de chez Fawnt aussi (mais ça tout le monde en a déjà parlé), celles de chez Jabroo et de chez Fontica. Si vous préférez le style celtique c’est par là.

Enfin je suppose que toute cette exploration de police vous aura donné faim… allez retour à votre blog maintenant…

QuickRibbon est un générateur à la sauce web2 qui va vous permettre de créer le vôtre et cela de manière très rapide. Tout d’abord rendez-vous à la bonne adresse.

La première étape sera d’entrer le texte que vous voulez, choisir sa couleur, sa police d’écriture et sa taille. Facile comme simple donc (évitez quand même de dépasser 22-23 caractères). Le seul reproche est qu’au niveau taille du texte vous ne pourrez choisir qu’entre 12 et 24 px, ce n’est pas complètement personnalisable à ce niveau donc.

Ensuite vous sont proposés 4 types de bandeaux (simple, à créneau, à escalier et à demi-cercle) et 3 couleurs différentes. L’une sera celle utilisée en arrière plan et les 2 autres seront bien utile si vous voulez appliquer un dégradé quelconque. Des palettes couleurs sont disponible afin que vous puissiez choisir précisément la teinte voulue.

Enfin vous allez pouvoir (si vous le voulez) faire de ce ruban, un lien cliquable vers où vous voulez et choisir si vous préférez qu’il s’ouvre dans une nouvelle fenêtre ou pas.
Il vous suffira alors de récupérer le code Javascript final et à le positionner sur votre blog ou site. Si vous ne savez pas comment ça s’intègre, un lien vous indiquera précisément ce qu’il faut faire (explications existant pour les blogs WordPress et Blogger jusqu’à présent).

Tout au long de la démarche vous pourrez voir « en live » directement sur la page ce que donne votre création. C’est donc très simple et très rapide à faire.

Bon amusement :)

Un autre générateur de rubans : http://www.websiteribbon.com/

Pour ce dernier, Guillaume vous le présente plus longuement que moi ;)

Flavicon se propose de vous simplifier la vie en ce qui concerne la création de vos favicons.

Pour ceux qui ne le savent pas, les favicons sont les petites icônes que vous pouvez voir dans les onglets ou la barre d’adresse de votre navigateur pour les sites en proposant un. Comme par exemple :

Ces images sont en général au format .ico qui est un format un peu particulier pas toujorus simple à créer (ou alors via plusieurs manipulation).

Avec Flavicon vous allez avoir 3 options :

Favicon Converter : la plus simple. Il vous suffira de sélectionner une image sur votre disque dur (format jpg, gif ou png) et de la convertir en 1 clic. Non seulement votre image de base sera convertie au format .ico mais en plus elle sera redimensionnée en 16×16 (16 pixels de côté), ce qui est la taille standard.

Comble du bonheur une prévisualisation vous permet de voir ce que cela donnera comme résultat final et un petit tutoriel vous explique la marche à suivre pour le mettre en place sur votre site/blog.

Browse Favicon : met à votre disposition quelques favicons tout prêt à l’emploi. Classés par catégories, au total ça fait quelques dizaines d’icônes toutes prêtes à l’emploi (même s’il faut avouer qu’elles ne sont pas vraiment terribles).

Custom Favicon : pas encore existante, cette section devrait permettre de commander et acheter ses propres favicons personnalisées. A voir donc ce que cela va réserver à l’avenir.

Il existe pas mal de services proposant la même chose mais j’aime bien celui-ci, c’est très rapide

Il a aussi cet exemple sur fond noir.

Comment installer le script ?

Tout d’abord il vous faudra installer les scripts prototype, script.aculo.us, builder et reflection dans votre code html (entre les balises <head> et </head> de votre en-tête) :

1. <script src= »javascript/prototype.js » type= »text/javascript »></script>
2. <script src= »javascript/scriptaculous.js?load=builder » type= »text/javascript »></script>
3. <script src= »javascript/reflection.js » type= »text/javascript »></script>

Note : 4 scripts sont fournit dans l’archive et vous devez tous les placer sur votre serveur. Ensuite il vous faudra créer un élément <div> dans lequel l’image va apparaitre :

1. <div id = « blabla »>
2. <img src= »image.jpg » />
3. </div>

Et la dernière étape est de créer une instance pour la class reflixion3d :

1. <script type= »text/javascript »>
2. new Reflect3D(‘blabla’);
3. </script>

(le premier paramètre est celui de l’ID de la <div> créée). Cette instance sera à placer dans l’en-tête si possible (toujours entre <head> et </head>) mais absolument après les 3 lignes de la première étape.

Le système vous permet de créer plusieurs réflexions sur une même page (il faudra juste répéter la manipulation pour chaque image sur laquelle appliquer le reflet).

Voilà voilà

Merci à k-ny pour la relecture ;)

Elles vous sont proposées au format .PNG avec fond transparent et sont distribuées sous licence Creative Commons. Idéal pour les webdesigners et webmasters désireux d’agrandir un peu leur ressources disponible pour divers projets.

Ca peux toujours servir ;)

(Cliquez sur l’image pour vous rendre sur la page de téléchargement et de présentation)

Be Funky propose un service simple mais assez fun pour tous les habitués des forums, blogs, réseaux sociaux, etc… concrètement il vous propose de dessiner votre portrait en mode « cartoon ».

Vous lui fournissez une ou plusieurs photo de votre visage et les dessinateurs lui donne un aspect plus graphique, voici des exemples :

En fait le service, toujours en beta privée, se compose de 3 grandes parties.

La première comprend tout ce qui est relatif à votre profil (photo, présentation, infos perso, messagerie interne, votre galerie, vos favoris, etc…). Jusque là rien de bien neuf.

La seconde, nommé « Uvatar« , vous permettra par la suite de construire vous même votre avatar (une version gratuite est dispo pour le moment mais une autre à 4.99$ servira à rentabiliser un peu le système). Un peu comme pour Skaaz ou lors de la création d’un personnage dans un jeu, vous pourrez choisir parmi différentes options telles que la couleur de peau, la forme du visage, les vêtements, etc.. en quelques secondes vous obtiendrez un résultat dans ce genre :

Comme on le voit ça reste assez basique pour le moment (ça pourrait ressembler à plein de monde cet avatar) mais plus de personnalisation sera surement possible une fois l’ouverture au public (et l’accès payant) lancé.

La dernière section « Cartoonizer » est certainement la plus intéressante. Vous allez pouvoir y charger des images présentes sur votre PC ou encore vous prendre en vidéo via votre webcam directement, il semble également possible de cartooniser des films. Ensuite il vous sera possible de retravailler un peu l’image, de la déformer, afficher le négatif, …

Enfin tout cela c’est ce que vous pouvez faire par vous même sur Be Funky car ce service est basé sur Iamcartoon. Ce dernier fait tout pareil sauf qu’au lieu que ce soit vous le « dessinateur » ce sont des artistes. Dans ce cas, vous fournissez les photos, vous pouvez ajouter des notes (je veux un pull bleu, …) et dans les 72 heures vous devriez recevoir votre commande. Les tarifs débutent à 15$ et cela donne un résultat plutôt probant :

Conclusion : si j’ai compris le but du système c’est de faire de BeFunky une vitrine « free & low-cost » de ce que les personnes sont capables de réaliser pour un peu plus cher sur IamCartoon. Pas mal vu si c’est le cas parce qu’en solo on peux faire des choses moyennement bien faite, et lorsqu’on voit ce qu’eux peuvent nous sortir ça donne plutôt envie (enfin si on est tenté par avoir sa représentation graphique et si on est pas doué avec Photoshop quoi).