background preloader

Zoning, wireframe, maquettage, prototype ... : les meilleures pratiques

Zoning, wireframe, maquettage, prototype ... : les meilleures pratiques
Zoning, wireframe, maquette, prototype, voici des termes qui ne vous sont pas anodins, puisque nous les rencontrons de plus en plus dans le monde du Web, notamment dans les phases d’initialisation des projets. Mais savez-vous réellement ce qui se cache derrière chacun de ces termes, qui désignent l’ensemble des techniques et des outils qui permettent de maquetter graphiquement, fonctionnellement, ergonomiquement un site Web ? Tout d’abord utilisée dans la création de logiciels lourds avant la phase de développement, cette technique de conception a progressivement été adoptée, et est aujourd’hui conseillée par les professionnels du Web. ceci dit, il arrive encore couramment que l’on fasse l’amalgame entre les différents termes. Parallèlement, le nombre d’applications permettant de réaliser des wireframes ou des prototypes ne cesse d’augmenter, avec à chaque fois de nouvelles spécialisations. Les différentes notions derrière ces termes Un zoning Exemple de zoning Un wireframe Une maquette 1. Related:  critères de l'ergonomie web

Ainsi fond font Fontes 8 critères ergonomiques importants pour votre site web Internet est un outil créé par des humains, pour des humains. Chaque jour, de nouveaux sites web et de nouvelles pages s’ajoutent pour être utilisés par les internautes. Cependant, il arrive encore souvent de trouver des interfaces dont l’utilisation est une torture. Le travail des designers d’expérience utilisateur, ou UX designers, est de simplifier le plus possible ces expériences. Internet étant un outil mondialement accessible, il convient d’essayer d’uniformiser son langage, grâce à des critères ergonomiques claires, pour rendre la conception des sites web et leur utilisation plus fluide. Parmi les ressources permettant de rendre un système informatique utile et utilisable, on retrouve les critères ergonomiques de Bastien et Scapin. 1. Le guidage désigne tous les moyens mis en place pour conseiller, informer et conduire l’utilisateur dans ses interactions. 2. Il convient de réduire au minimum la charge de travail effectué par l’utilisateur. 3. 4. 5. 6. 7. 8. Sources

pixelcreation.fr magazine du graphisme design illustration video 3D: Accueil Principes à suivre pour un site web de qualité : Ergonomie, Compatibilité, Accessibilité Les enjeux d'un site web sont multiples et sa compatibilité ainsi que sa qualité comptent parmi les premiers critères de sa réussite, tant au niveau quantitatif (trafic, nombre de commandes) que qualitatif. Pour être de qualité, un site doit être à la fois Utile (répondre à un besoin) et Utilisable (par tous). Les principes universels de qualité peuvent être regroupés dans trois grandes parties, s'appliquant pour tous les sites web quel que soit leur thème (ludique, sobre, académique, artistique), leur concept (professionnel, commercial, associatif, amateur,...), leur objectif et le public visé. Règles d'ergonomie L'ergonomie est la façon de rendre un site utilisable par le plus grand nombre de personnes avec un maximum de confort et d'efficacité. Cette définition est souvent peu respectée au profit des technologies propriétaires (Flash, scripts, balises IE,...) qui rendent l'utilisation des sites souvent difficile et d'une mauvaise utilisation des principes de base en design d'IHM. Liens

Les cours faciles pour les débutants en Flash Quelques conseils pour bien commencer : Enregistrer son travail : Dès la création d’une nouvelle animation, il est indispensable d’enregistrer son document pour deux raisons : il est toujours plus prudent de travailler sur un document que vous sauvegardez au fur et à mesure de votre progression dans l’animation et un fichier supplémentaire (.swf) se créera automatiquement dès la première lecture dans le même dossier que votre animation. donc indispensable de l’enregistrer. Utiliser les raccourcis claviers : Pour gagner du temps (puisque le temps c'est de l'argent), vous devez impérativement utiliser les raccourcis clavier. voici une sélection des raccourcis à connaître (conseil de l'un de l'équipe de Yazo qui est développeur et enseignant) : F8 : Créer un symbole Pomme-F8 (Mac) ou CTRL-F8 (PC) : créer un symbole vierge hors de la scène. F5 : Insérer une image F6 : créer une image clé Pomme-L (Mac) ou CTRL-L (PC) : Afficher la bibliothèque Des bibliothèques trompeuses :

Quel est le bon nombre de pages sur un site web pour qu'il soit performant ? Lors de nos échanges avec les propriétaires de sites web et leurs webmasters, il s’agit d’une question qui revient constamment. Idéalement, combien faudrait-il de pages ou de contenus sur un site web pour qu’il soit bien référencé, qu’il satisfasse l’internaute et apporte les résultats attendus à l’entreprise. 10, 100 ou 10000 pages sur un site web : quel est le bon nombre ? Et la bonne réponse est… ça dépend. Référencement naturel ou publicité ? Lorsque l’on écrit du contenu pour être bien placé dans Google pour répondre au besoin de l’internaute ET être bien placé dans Google, il y a forcément des règles que l’on respecte pour plaire aux moteurs. À l’inverse, si le trafic provient essentiellement de publicité, l’objectif est toujours de plaire l’internaute mais beaucoup moins aux moteurs. Gros mots clés ou longue traîne ? La boucle est bouclée : la longue traîne correctement organisée dans l’architecture du site favorise les mots clés plus concurrentiels. Passif SEO ou petit nouveau ?

2 ou 3 choses que je sais d’elle… la typographie » 2 ou 3 choses que je sais d’elle… la typographie Il y a près de quatre ans, sur l’invitation généreuse de Renaud Huberlant, j’entamais, avec la co-animation de ce blog, un exercice de balisage du flux informationnel de la toile et une tentative modeste de décryptage des enjeux et des élans du graphisme contemporain. Aujourd’hui, après avoir chaleureusement remercié Renaud pour son invitation et Simon Lagneaux pour son travail de développement et de suivi de cet interface, je vais poursuivre cette aventure critique et pédagogique au sein de l’espace plus collectif proposé par la revue en ligne Tombolo. Cet article est donc le dernier que je produirai, non sans quelque émotion, sur 2 ou 3 choses que je sais d’elle… la typographie. Un tombolo c’est ce genre de talus qui protège ou constitue le lien littoral entre deux étendues terrestres. Une forme d’isthme, une langue de sable dans la mer qui s’accroche à une île. Tombolo a été initié par officeabc (Catherine Guiral, Brice Domingues) et votre serviteur.

Related: