background preloader

Approche Théorique du Webdesign

Approche Théorique du Webdesign
Heather (Thomas Vuillermet) explique quelques bases du webdesign dans un tutoriel théorique. Bonjour à tous, voilà un petit dossier pour vous parler de méthodologie et de théorie, en matière de webdesign. Je pense que si vous en êtes à lire ceci, c’est que le domaine vous intéresse et que vous avez pu observer durant de longues années les sites web sur lesquels vous êtes tombés. Je ne prétends pas être expert en la matière, loin de là , simplement, il y a 2-3 ans, un tutoriel de ce style m’aurait été d’une grande aide. Un point sur vous. Le webdesign est un métier, et il est très important de prendre l’approche qu’il faut avec ce mot là . Un point sur le Design Design veut dire « concevoir, réaliser ». Et aujourd’hui, les communautés graphiques, les écoles, les magazines, ont tendance à « donner » une technique plutôt poussée pour apprendre à maitriser des logiciels, mais très peu abordent le sujet de la simplicité du message et de sa mise en forme. Le contenu L’arborescence Le Zoning Related:  Veille WebdesignOutils et Blogs

Tendance du webdesign : double scroll | WebdesignerTrends - Ressources utiles pour le webdesign, actus du web, sélection de sites et de tutoriels - Directement inspirés par les interfaces mobiles, certains sites osent ce que l’on pourrait nommer le « double scroll« … L’utilisation du défilement de page pour créer des effets originaux sur les sites est en vogue depuis maintenant bien 2 ou 3 ans, voir plus. Avec la ligne de flottaison définitivement enterrée, plus de soucis aujourd’hui les gens scrollent. La parallaxe, le scroll « story-telling« , entre autres ont permis d’apporter de la dynamique et de la profondeur dans notre expérience de navigation. Terminé le scroll long et fastidieux, terminé les sites plats et sans intérêt, vive le one-page et le scrolling à gogo ! Comme toutes les tendances, la parallaxe s’est elle aussi essoufflée après avoir lassé les concepteurs web et les internautes. Une expérience en deux colonnes Découlant directement des ces tendances passées, mixées avec une expérience utilisateur très représentée sur tablette et mobile, voici le double scroll. ACTV/ RCVR de Puma Fade or Eddy Carles Palacio Vespillo

Les phrases à ne pas dire devant un graphiste Toujours dans l’idée d’améliorer les relations entre graphistes/designers et les clients, je vous propose aujourd’hui une liste de phrases à éviter lorsque vous échangez avec un graphiste. Que ce soit lors du premier contact ou au cours du projet. 1. Peux-tu refaire le même site / le même logotype ? Donner des exemples de création qu’on apprécie est vraiment une bonne idée, cela permet au designer de cerner les envies. Vous pouvez même vous inspirer de communications différentes : une typo sympa par ci, une couleur dynamique par là, une mise en page professionnelle que j’aime, etc… Attention juste à ne pas copier/coller un site ou un logo que vous aimez. En plus de potentiels risques juridiques pour contre-façon, comme je le rappelle plus bas chaque création doit répondre à un besoin : Copier à l’identique n’est vraiment pas une bonne idée si vous voulez communiquer éfficacement. 2. Si vous pouviez éviter de le préciser fièrement. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. Pour les clients:

5 façons d'intégrer le social media à votre webdesign Blogging Publié le Mardi 26 mars 2013 | par Julie Mirande Depuis longtemps, blogging et social media font bon ménage. Intégrer votre stratégie Social Media au design et à l’ergonomie de votre site est véritablement devenu une étape indispensable du blogging. Non seulement, vous y gagnez des sources de trafic naturel mais vous augmentez également les chances de voir votre contenu commenté et partagé voire viralisé. Voici 5 façons d’intégrer les réseaux sociaux au webdesign de votre blog. #1 Montrez les réseaux sociaux sur lesquels vous êtes Votre site est au coeur d’un maillage qui concentre votre présence numérique. > Mettez en avant vos icônes de réseaux sociaux dans un élément de votre site qui est présent sur toutes les pages : l’entête, la barre latérale. > Les icônes des réseaux sociaux sont rentrées dans les usages et automatismes numériques. > Rappelez-vous que Facebook met à disposition de ses utilisateurs d’autres plugins sociaux que le bouton ‘J’aime’ et le bouton ‘Suivre’.

Design Spartan : Art digital, digital painting, webdesign, illustration et inspiration… | Le blog sur l'art digital, le webdesign, l'illustration et le digital painting Comment démarrer un projet web ? Hey ! Le site DesignModo présente souvent d’intéressantes infographies et cette fois-ci cela concerne le bon démarrage et la bonne tenue d’un projet web ! Cette infographie, réalisée récemment nous présente le processus général et la structure en détails d’un projet web. Lorsqu’il vous faut vous attaquer à un projet de conception de site web, au mieux vous avez votre propre méthodologie, au pire, vous faites ça comme ça vient.. Et le pire c’est que ça fonctionne ! Mais cette infographie sera particulièrement utile pour structurer votre projet parce que dans l’évolution du monde du webdesign, on découvre sans cesse de nouveaux workflow, de nouveaux outils, de nouveaux scripts ou de nouvelles techniques, il est facile pour un débutant d’être perdu. Un bon point de départ donc ! Et vous, vous retrouvez dans cette infographie ? source & source Ces articles peuvent aussi vous intéresser:

Générer des icônes Flat design personnalisées - CfmWeb dans Ressources par Gaëtan 30 janvier 2014 Si vous aimez le style « Flat design », voici un site à ne pas louper : le site Icons DB propose quelques milliers d’icônes customisables en téléchargement gratuit. Le gros plus de ce site est le coté « customisables » qui permet de générer toutes les icônes à la couleur désirée avec un grand choix de tailles allant de 16 à 512 pixels et un large choix de formats (.ICO, .PNG, .JPG, .GIF et ICNS pour les utilisateurs sous Mac). Mots-clésgénérateuriconesoutils Ui Tiles la ressource pour préparer vos web designs Cette semaine une ressource très intéressante à découvrir avec Ui Tiles qui propose un véritable kit pour réaliser des wireframes en toute simplicité ! Un kit complet pour préparer vos sites web Si vous avez l'habitude de réaliser en amont de vos web designs des wireframes ou croquis pour imaginer l'ensemble des pages et fonctionnalités de votre projet, vous devrez aimer Ui Tiles. Cette ressource regroupe une grande diversité de pages et d'éléments afin de composer facilement et rapidement vos idées. Ce travail peut s'avérer très utile pour valider avec un client son site web avant d'entamer la partie graphique, mais également poser à plat un site complexe. Une ressource complète, libre de droits et gratuite ! Ui Tiles propose 72 modèles de bases, ensuite vous êtes libre de pouvoir composer les vôtres selon vos idées et besoins. Si vous êtes webdesigner, chef de projet, ergonome ou simplement passionné par le web, cette ressource devrait vous servir.

9 basic principles of responsive web design Responsive web design is a great solution to our multi-screen problem, but getting into it from the print perspective is difficult. No fixed page size, no millimetres or inches, no physical constraints to fight against. Designing in pixels for Desktop and Mobile only is also the past, as more and more gadgets can open up a website. Therefore, let's clarify some basic principles of responsive web design here to embrace the fluid web, instead of fighting it. Responsive vs Adaptive web design It might seem the same but it isn't. The flow As screen sizes become smaller, content starts to take up more vertical space and anything below will be pushed down, it's called the flow. Relative units The canvas can be a desktop, mobile screen or anything in between. Breakpoints Breakpoints allow the layout to change at predefined points, i.e. having 3 columns on a desktop, but only 1 column on a mobile device. Max and Min values Nested objects Remember the relative position? Mobile or Desktop first

la Veilleuse Graphique - La Veilleuse Graphique : l'actu graphisme, de l'imprimé au webdesign! Web design 1001 Free Downloads une banque de ressources pratiques et gratuites | BlogDuWebdesign Aujourd'hui nous vous proposons la découverte de la plateforme 1001 Free Downloads qui vous sera pratique pour rechercher des ressources pour vos futurs projets. 1001 Free Downloads rejoint une grande série de sites qui proposent des ressources à télécharger gratuitement, on avait déjà Dribbble, Behance ou GraphicBurger qui proposent une grande multitude d'éléments, PSD, typographies, textures, mockups, etc. Sans oublier le BlogDuWebdesign, qui vous permet de découvrir des sélections spécialisées :) 1001 Free Downnloads se démarque par sa quantité de ressources et sa diversité, vous avez le choix entre 10 catégories qui sont : - Le vectoriel - La photographie - La typographie - Icônes - Wallpapers - Brushes - Styles Photoshop - Textures et Motifs - Clipart - La meilleure de toutes ! ... Les ressources présentes sont variées il y a un peu de tout, du bien mais aussi du moins bien qui sera dur à utiliser pour vos projets, sauf si vous recherchez un style "particulier".

#StartupBackPack : 30 outils pratiques pour construire sa visibilité sur Internet Quand on se lance dans la vie entrepreneuriale, difficile pour un porteur de projets de connaître tous les tenants et les aboutissants d’un univers totalement inconnu. Pour pallier à ce manque d’informations, mais aussi pour favoriser les premiers pas dans le monde des startups, Maddyness, en partenariat avec La Petite Etoile, a rédigé un ouvrage (baptisé Startup BackPack) permettant de construire son entreprise en 10 chapitres. La rédaction vous propose aujourd’hui de faire la lumière sur un chapitre indispensable : sa présence sur Internet. Personnaliser ses signatures d’email Au delà du contenu, s’il y a une chose à ne pas oublier dans un mail, c’est bien la signature. Créer son site web Le site web est une étape cruciale dans le développement de sa startup. Créer son application mobile Avec les nombreuses tablettes et smartphones qui pullulent sur le marché, l’avenir du web se trouve bel et bien au sein des applications mobiles. Booster sa productivité Masteriser les médias sociaux

Related: