Le design de mon portFolio

Voici le design d’interface de mon portfolio que j’ai fait en début de 2ème session 2006-2007.



Ce que j’aime du design, c’est le fait d’avoir réussi mon concept tout en respectant les règles du design, et remarquez comment le design est décadré. Rien n’est carré, et tout est magnifique. L’utilisateur pour naviguer très facilement à l’aide du menu de gauche, et seulement en un seul clic. De plus, un sous titre est affiché afin de spécifier la section auquel vous être en train de visualiser.

Pour ce qui est des couleurs et du style, mon but était de faire un genre fantastique (parchemin). Enfin, je vous souhaite une bonne visite et dites vous que j’ai fait ça avant mes 2 cours de design !

Il est temps de « splasher » les cadres

Bonjour chers lecteurs,

Savez-vous qu’il y a au moins 25 façons de décadrer le design d’interface d’un site ? Et savez-vous que cela vous apporte 25 bonnes avantages de donner un style plus attirent ?

Alors il serait temps que je vous en montre une. Pour l’exemple, j’ai pris le site de cyberpress.ca et je lui ai appliqué un graffiti en arrière plan afin de créer une image explosive qui se marie avec le cadre du site. Donc le site devient décadré.



Comme vous pouvez le voir, le « décadrement » ce n’est pas compliquer, il suffit de trouver la bonne méthode qui conviendrait le plus pour notre design. Le superbe « splash » que je lui ai fait pourra très bien être appliqué pour plein d’autres sites, mais l’arrangement des couleurs serait probablement à retravailler.

La bonne pizza Donini

C'est dans mon cours de design d’interface que l’on a eu le défit de faire une maquette d’un site Internet en très peu de temps. Et oui, comme vous pouvez le voir, j’ai dû faire une page d’accueil du site Donini, dont leur propre site est actuellement en construction et ne verra probablement pas le jour d’ici tôt.



J’ai donc commencé par me créer une texture d’arrière plan qui semble être une croute de pizza. Le logo bien visible en haut à gauche. J’ai donc adapté le design aux couleurs que porte le logo, donc vert et rouge, par contre j’ai dû foncer le rouge pour qu’elle soit abordable à l’œil. Le menu est assez simple, mais bien conçu, puisque j’ai séparé les différents éléments par des teintes de couleurs, puis j’ai séparée les choix par un simple espacement qui lui donne un style moins monotone. J’ai aussi choisi une police d’écriture au style de menu de restaurant.

Enfin, le reste des éléments sont totalement négociable, le contenue est placé afin de donner un exemple sur le placement de l’information, mais pour le reste, tout tourne autour du concept de départ.

En espérant vous avoir donné faim, bonne appétit et à bientôt.

Le design interactif

En naviguant sur le Web, je suis arrivé sur un article vraiment super. On y parle du design interactif via le Web, et l’information est très intéressante puisqu’il se rapporte à la matière vue dans un cours de design interface. Il est certain que le contenue est discutable avec l’actualisation et les nouvelles tendances, mais en gros tout est assez claire et précis.

Je vous invite donc à visiter le lien ici dessous et de regarder la superbe diapositive de 37 pages.

Design Interactif

Le design dans tous ses sens

Bien bonjour chers lecteurs,

Cela fait longtemps que l’actualité n’a pas fait face sur Le monde du design. Alors c’est aujourd’hui que le design va se révéler dans tous ses sens.

En navigant sur des sites, j’ai tombé sur un site vraiment super. http://www.elogodesign.com/ Ce site est consacré à la création d’éléments design, c'est-à-dire des logos, la typographies, de l’interface, les couleurs, et plusieurs autres éléments. Le site est en anglais, alors je vais tout simplement vous donner l’adresse directe vers la page qui m’a surtout le plus intéressé. http://www.elogodesign.com/tips-tutorials/ Vous allez y retrouver de l’information et des tutoriaux sur plusieurs éléments de design.

Sinon, si vous vous intéressé à la création d’un logo, les étapes de création sont assez bien expliqué sur le site, dont à ce lien ici: http://www.elogodesign.com/logo/process

De plus, le site regroupe des commentaires sur des logos, cela est assez intéressant pour s’inspirer sur le concept.

Enfin, vous vous demandez peut être que viens faire se site sur mon blog consternant le design d’interface ? La réponse est simple, la plupart des compagnies qui vous demanderont de faire leur design d’interface de leur site, ils vont aussi avoir besoin d’un logo qui s’adaptera au site ainsi qu’à la compagnie. De plus, parfois il a des entreprises qui ont déjà leur logo, alors le site devrait avoir un style de couleur propre au logo. Donc le logo est un élément très important sur une interface d’un site web. Le logo n’est non seulement important sur un site, mais aussi sur n’importe quel produit, c’est la représentation de votre signature, c’est votre maison, votre signe. En parlant de maison, comme sur tous les sites, le logo apporte généralement à la page d’accueil du site, alors n’oubliez pas le logo lorsque vous ferai une interface.

Malheureusement, le site que je fais référence n’on même pas adapté l’idée du lien vers la page d.’accueil à partir du logo, enfin croyez moi, c’est l’une des plus grandes importances d’une interface.

Bonne visite et à bientôt.

Google Earth

Avez-vous essayez l’interface de Google Earth ? Probablement que oui, mais encore, avez-vous essayez de voyager dans l’espace ? Sinon, profitez de cette vidéo qui vous explique l’utilisation du superbe design de google Earth pour voyager dans l’espace :

De plus, avez vous remarquez l'interface 3D dans google Earth, bien qu'il soit fait à partir de millions d'images pris à partir d'un satellite, il se son quand même forcé pour rendre l'aspect du logiciel bien plus intéressant que l'on peut le croire.

Et pour finir, savez vous que la maison des teletubbies se retrouve sur Google Earth, et oui, vous ne me croyez pas ? Allez voir par vous-même.

Photoshop CS3 Extend

Il ne serait pas très intéressant si une compagnie t’elle que adobe changerai le design de ses nouvelles version de ses logiciels par de quoi de anti-design. C’est bien car c’est loin d’être le cas et même il l’on amélioré et optimisé.

Je m’explique, sous la gamme CS2 et les anciennes, on a toujours été pris dans une armée de fenêtre. Maintenant sous la gamme CS3 tout ça à été optimisé pour le bien de l’utilisateur.

Par exemple, regardons notre ami Photoshop:

P CS3 sous son style optimisé:

PhotoShop sous son style CS2:

Regardez bien l'interface du design, surtout du côté du menu, vous pouvez le rendre en une seule colonne ou 2 comme l'ancienne version et j'aurai pus faire de même avec les fenêtres de droite.

Vive adobe et leurs logiciels bien désigné !

Transition StarCraft

Il sera désormais très facile de faire la transition entre le super classique StarCraft vers son successeur StarCraft2.

Blizzard à annoncé l’arrivé de son nouveau jeu StarCraft 2 d’ici une date complètement aléatoire. Cela est très valable de leurs par puisque StarCraft est le RTS qui a été le plus joué lors de sa sortie et encore pendant plusieurs années qui on suivit.

Pourquoi sera-t-il si facile de passer de StarCraft à StarCraft 2 ? , la réponse se répond par elle-même, c’est le 2 et non un autre style complètement refait. Le design d’interface du jeu restera le même avec quelques retouches.

Regardez par vous-même ses 2 images :

StarCraft:

StarCraft2:

Comme on le voit assez bien. Tout se tien aux même place, la carte à gauche, les informations sur la sélection au centre, un peut à droite un aperçu dynamique puis le menu d’options, et enfin les ressource en haut à droite. Rien de plus simple que de garder le même design pour aider le joueur à s’adapter rapidement.

Microsoft contre Apple

Depuis toujours, Microsoft se livre bataille contre Apple, ou plus précisément, Bill Gates contre Steve jobs. Mais la question est pourquoi, à quel sujet ? La réponse est simple, il suffi de regarder le design de chacun et de comparer dans le temps.

Il est remarquable d’avoir enfin une interface beaucoup plus adapté sous Windows Vista que la version précédente (Windows XP). Par contre il est assez évident que le style est facilement le miroir du style Aqua de Apple. Mais est-ce un mal pour ses utilisateurs ?

Le plus gros est de savoir quand est-ce que Windows vista sera-t-il différent des Mac, dans quel service pack ? Enfin je crois qu’il voudra mieux être bien patient pour voir un jour une différence entre les 2.

Pour conclure cette bataille de design, maintenant que tous savent qu’il existe le Boot Camp sous Mac OS X, Microsoft veux faire pareille avec son Boot Scout, une copie ? Certainement, mais disons qu’il n’a pas trop le choix s’il veut prouver que cela fonctionne. Par contre je me demande vivement à quoi cela servira t’il ? Tout le monde se procure des Mac pour y installer Windows afin de bénéficier des 2, mais si Microsoft réussi à faire de même, qu’est-ce qui sera plus avantageux entre le MAC et le PC ? Surtout que les 2 ont un design presque identique.

Une bataille qui en dit long, et comme toujours, les fans des MAC resteront sur MAC et les fans de Windows resteront sur Windows… à moins que… C’est à voir.

Je vous invite à aller voir la vidéo à l’adresse suivante et ainsi son article :

cliquer ici pour aller au lien

Un design fantastique de la part de Unknown Worlds

Depuis mai 2001, Unknown Worlds a été fondé. Puis c’est en 2002 que j’ai eu la chance de tester leur premier jeu Natural-Selection v1.0. Depuis je teste tous leurs version jusqu’à la plus récente v3.2. Depuis peu, il on créer le jeu Zen of Sudoku (en 2006) afin de commencer la création du jeu le plus attendu, Natural-Selection 2.

Pour vous mettre dans le contexte, Natural-Selection c’est un jeu de combat à la première personne (first-person combat) avec un style de stratégie en temps réel (real-time strategy). Donc c’est 2 clans, les marines contre les aliens. C’est un jeu qui n’est joué que par des joueurs humains, donc pas de combat contre l’ordinateur. Du côté des marines, il y a un commandant qui à la perspective du dessus au style (real-time strategy) et les autres joueur de se clan sont des marines. Puis les aliens sont tous unis et individualisés en même temps. Les ressources générales sont en équipe, mais tous peuvent s’aider à la construction de leurs évolutions extra-terrestre. Enfin, pour plus de détail, vous pouvez regarder les 2 vidéos ici dessous.

Version 1.0

Version 3.0

Bien, maintenant revenons en au fait. Depuis bien longtemps, le design du site était plus ou moins intéressant. L’organisation était simple, mais pas très organisé. Le menu était représenté par des images, ce qui n’était pas très convenable, puis il y avait pour plusieurs heures de lecture sur la page d’accueil. Donc imaginez comment la barre de défilement comment elle était petite. Et ce n’est pas tout, les informations sur les 3 jeux étaient mélangés dans la section Natural-Selection, ce qui était très mal pensé. Enfin dernièrement, le site a été tout refait à partir de rien. Et c’est pourquoi que j’ai été impressionné par leurs nouvelles interfaces.

Je vous laisse visité le site à partir des liens ici dessous.

UnknownWorlds
Natural-Selection
Natural-Selection 2
Zen of Sudoku

Lorsqu’on parle d’une interface autant bon côté interface du design et graphique, bien en voici un exemple. L’organisation est très compréhensible, le menu est bien meilleur que l’ancien, Nous pouvons toujours grâce au soulèvement du bouton savoir dans quel section que nous sommes. Le texte et les liens sont très visibles, les couleurs se marient bien. Et côté technique, il n’y a rien qui nous dérange. Puis les sections sont bien réparties entre elles, c'est-à-dire la page d’accueil qui nous présente les 3 jeux. Mais nous avons aussi l’options de naviguer dans le menu afin d’en apprendre davantage sur l’entreprise. Puis le style répétitif entres elles, donc après d’avoir entré dans une section, nous savons parfaitement comment naviguer dans tous les autres sections.

Enfin, pour terminer mon « raplapla » sur tout ça, je vous invite à regarder la vidéo du fameux jeu Zen of Sudoku juste ici dessous.

Sinon il y a deux autre vidéo sur la page d'accueilZen of Sudoku

Avant de parler de loin, parlons de proche...

Cela fait plus d’une semaine que le blog est plus ou moins vivant, alors je crois bien qu’il est temps de vous parler du nouveau design du blog. Comme vous l’avez probablement assez bien remarqué, le design a été remanié et retouché. Enfin, le concept digne de son titre « Le monde du design » a été appliqué à mon style, c'est-à-dire le style tendance high-tech.


Maintenant, voyons en détail les modifications que j’y ai apportées. Le design de base avait un en-tête assez simple avec des bordures décoratives en vert. Le bas de page était très petit et simple. Les marges de droit et de gauche étaient grises, simples et répétitifs. Et le menu et le contenue était séparé par une ligne imaginaire entre deux couleurs. Et comme désastre, la petite courbe grise en haut du menu qui n’était même pas alignée correctement. Pour le reste, dont la typographie, les couleurs, les icônes, tout était assez simple de base et n’allant pas avec mon concept.

Puisque le but était de rendre le blog à la tendance high-tech, je me suis permit de remanier le style graphique à 100%. Donc le design était de rendre se qui était simple et monotone (forme de rectangle) par une variation futuriste. J’ai donc commencé par les nouvelles bordures, j’ai donné un style de forme métallique en variant la descente. Puis pour rendre le contenue plus intéressant, j’ai créé une bordure séparatrice entre le menu et le contenue. De plus, le dégradé me permet de varier la couleur de la police, ce qui donne une plus grande différence entre c’est 2 sections. La minivague a été remplacée par menu futuriste et bien mieux adapté au design. Sans oublier que maintenant il est bien aligné. Et pour finir, le bas de page a été agrandit à mon goût, puis j’y ai inscrit ma signature. Enfin, le haut de page est tout simplement merveilleux. Un titre bien adapté, un message bien placé et lisible, une photo pour marier le tout. Remarquez que le haut et le bas de page sont tout les deux adapté pour qu’il se relie au contenue du site.

Tous les autres détails sont autant importants, mais moins frappant. Premièrement il a les icônes, j’ai pensé d’y allé simple et compréhensible, car le but est bien de démontrer le sujet grâce à une image. Comme nous le savons bien, une image vaux mille mots. Ensuite, il y a l’arrière plan que j’ai créé une texture qui peut se répéter sans que l’on croit voir une mosaïque séparé par des coupures dérangeantes. Puis le fait de rendre l’arrière plan attaché à la fenêtre, donc fixé en place, nous donne l’impression que la page flotte au dessus du vide.

Alors voilà, donnez vos commentaires, que se soit bon ou mauvais, car tout ce qui y sera dit, ne fera nulle autre chose que m’aider à m’améliorer davantage.

Le design d'interfaces, c'est quoi ?

Bien qu’il soit simple à lire, le design n’est pas aussi simple à faire. Est-ce de l’art ? Est-ce une méthode de dessin ? Le design est loin d’être de l’art, d’ailleurs, il a des gens qui se disent designer pendant qu’ils sont plus des artistes du côté graphisme, tendis que d’autres croient être des artistes pendant qu’ils sont en fait, des designers. Pourquoi cette confusion entre ses 2 sens qui sont pourtant 2 étapes près de la perfection. Lorsqu’on fait de l’art on a juste à imaginer et créer. Mais lorsqu’on fait du design, se doit être pensé, réfléchit, il doit y avoir un concept, rien n’est fait par le hasard, rien n’est fait pour rien et tout a été prévu et conçu. Le design est loin d’être une panoplie de formes placées au hasard sur une feuille.

Posez-vous la question suivante, est-ce qu’il est mieux d’avoir un design laid en graphisme et bien pensé qui fonctionne ou un design super beau mais que le concept est complètement nulle est raté ?

Par simple logique nous pouvons être certain que le concept du design est le noyau de la réussite. Le côté graphique, et l’art d’un design apporte tout simplement qu’un simple ajout sur la perfection qui devrais déjà être réussi. Donc c’est avec ses 2 étapes que nous pouvons surpasser nos talents.

Maintenant que vous savez qu’est ce que le design, nous allons aller dans un domaine du design encore plus précis, c’est dire à la source du sujet, le design d’interfaces.

Cela ajoute qu’une seule spécification que vous avez probablement devinées, c'est-à-dire les interfaces, simple et pratique. Donc le design sur les interfaces d’un jeu, d’un site Internet, d’un logiciel, d’un blog et autres.

Enfin, le design d’interfaces c’est de concevoir, de penser, de réfléchir sur le concept et la création d’une interface en particulier, afin que tout soit utile et parfaitement à leurs places.

Pensez créativité, multimédia et graphisme, pensez design

Bonjour chers bloggers,

J’aimerais tout d’abord vous souhaitez la bienvenue sur Le monde du design. Dans ce monde qui est le mien, vous allez y découvrir le design, plus précisément le design d’interfaces.

Je vous invite donc à visiter mon blog afin de découvrir et de penser design.

Bonne visite à tous!