Bonsoir tout le monde,
Pas l'habitude de beaucoup poster mais je crois qu'il est temps d'avoir des réponses pour un remaniement du flux de production webdesign/intégration. je suis peut être à la limite du hors sujet sur ce forum étant donné que cela déborde sur deux domaines.
En ce moment, j'essaye de revoir mon workflow car je trouve qu'il n'est plus adapté avec les nouvelles technologies web du moment c'est pour cela que j'aimerai avoir des retours d'expériences, témoignages et comprendre certaines choses. Je m'explique:
Avec la démocratisation du responsive design, je n'arrive plus à faire le lien entre le maquettage, prototypage et intégration. Le coeur du problème serait les grilles. En effet aujourd'hui concevoir un site, c'est aussi faire du responsive design et donc faire des maquettes adaptées à diverses résolutions écrans (desktop, tablettes et mobiles). Sauf que faire appel aux media queries c'est aussi faire appel à des unités relatives et des grilles fluides. Ok ça c'est du côté CSS, mais qu'en est il du côté logiciel graphique ?J'ai toujours fait des maquettes pour structurer ma page, logique me direz vous !. Mon processus était celui-ci jusqu'à maintenant: réaliser les mockups type wireframe (noir et blanc) qu'on valide avec le client, ensuite les créer sur photoshop pour proposer le style graphique final...Sauf que Photoshop ou Illustrator gère du statique. Donc créer ses maquettes avec une grille type 960gs ça fonctionnait plutôt pas mal il y a encore 3 ans, mais j'ai l'impression que "ça c'était avant" - Krys.
Maintenant avec l'arrivée du responsive et les résolutions desktop de plus en plus grandes, je ne voit pas sur quel type de grille photoshop je peux partir et quelle taille de document étant donné qu'il gère les pixels (tailles fixes) et non les proportions, sachant qu'il faudrait une grille de type fluide pour gérer l'ensemble des maquettes mobiles et desktop. J'ai trouvé d'ailleurs cet article intéressant http://www.adviso.ca/blog/2013/01/03/design-web-la-fin-de-photoshop
Du coup, suite à mes recherches, j'ai découvert les frameworks comme boostrap, zurb foundation et un autre qui m'a l'air prometteur Knacss (je vais flatter l'ego. de R. G.) qui intègre un système de grille fluide.
Mais alors cela voudrait dire, que le webdesign se tourne vers cette pratique et sauterait l'étape fastidieuse de la maquette graphique photoshop ? Et c'est là que je remets en cause ma méthode de travail. De plus j'ai découvert la méthode de Samantha Warren qui consiste à utiliser le logiciel graphique pour créer une planche tendance (style tiles). Bon ça, je suis d'accord de moins perdre de temps sur photoshop/illustrator et d'aller à l'essentiel. Mais d'imaginer et réaliser la mise en page directement sur un framework avec le code, j'ai du mal à le concevoir.
Du coup je suis un peu perdu, je me dis qu'alors mon futur processus serait de faire les maquettes wireframes tout en les validant avec le client, ce qui me paraît essentiel. Ensuite de créer une planche tendance avec quelques aspects graphiques pour donner l'ambiance et de prototyper les maquettes directement dans le css via un framework pour profiter du système de grilles fluides, qui auront les mêmes proportions quelque soit la résolution de l'écran (le nombre de colonnes change certes). J'avais même penser à introduire Edge Reflow qui je trouve est entre la maquette photoshop et le prototypage html/css et qui permet de garder une homogénéité dans la grille car il gère le côté responsive.
Voilà je ne sais pas si j'ai été assez clair. En gros je ne sais plus trop dans quelle direction faire partir mon site pour faire reposer la structure sur un système de grille tout en ne perdant pas trop de temps à créer et reproduire des maquettes. Comment faites vous ? (Les grandes étapes). Partez vous toujours d'une grille à l'ancienne 960 ou autre pour tout votre site responsive? Éliminez vous tout logiciel graphique type photoshop dans la phase maquettage ? Les frameworks sont ils pour vous la nouvelle façon de maquetter un site ?
Merci à tous pour votre contribution!
Pas l'habitude de beaucoup poster mais je crois qu'il est temps d'avoir des réponses pour un remaniement du flux de production webdesign/intégration. je suis peut être à la limite du hors sujet sur ce forum étant donné que cela déborde sur deux domaines.
En ce moment, j'essaye de revoir mon workflow car je trouve qu'il n'est plus adapté avec les nouvelles technologies web du moment c'est pour cela que j'aimerai avoir des retours d'expériences, témoignages et comprendre certaines choses. Je m'explique:
Avec la démocratisation du responsive design, je n'arrive plus à faire le lien entre le maquettage, prototypage et intégration. Le coeur du problème serait les grilles. En effet aujourd'hui concevoir un site, c'est aussi faire du responsive design et donc faire des maquettes adaptées à diverses résolutions écrans (desktop, tablettes et mobiles). Sauf que faire appel aux media queries c'est aussi faire appel à des unités relatives et des grilles fluides. Ok ça c'est du côté CSS, mais qu'en est il du côté logiciel graphique ?J'ai toujours fait des maquettes pour structurer ma page, logique me direz vous !. Mon processus était celui-ci jusqu'à maintenant: réaliser les mockups type wireframe (noir et blanc) qu'on valide avec le client, ensuite les créer sur photoshop pour proposer le style graphique final...Sauf que Photoshop ou Illustrator gère du statique. Donc créer ses maquettes avec une grille type 960gs ça fonctionnait plutôt pas mal il y a encore 3 ans, mais j'ai l'impression que "ça c'était avant" - Krys.
Maintenant avec l'arrivée du responsive et les résolutions desktop de plus en plus grandes, je ne voit pas sur quel type de grille photoshop je peux partir et quelle taille de document étant donné qu'il gère les pixels (tailles fixes) et non les proportions, sachant qu'il faudrait une grille de type fluide pour gérer l'ensemble des maquettes mobiles et desktop. J'ai trouvé d'ailleurs cet article intéressant http://www.adviso.ca/blog/2013/01/03/design-web-la-fin-de-photoshop
Du coup, suite à mes recherches, j'ai découvert les frameworks comme boostrap, zurb foundation et un autre qui m'a l'air prometteur Knacss (je vais flatter l'ego. de R. G.) qui intègre un système de grille fluide.
Mais alors cela voudrait dire, que le webdesign se tourne vers cette pratique et sauterait l'étape fastidieuse de la maquette graphique photoshop ? Et c'est là que je remets en cause ma méthode de travail. De plus j'ai découvert la méthode de Samantha Warren qui consiste à utiliser le logiciel graphique pour créer une planche tendance (style tiles). Bon ça, je suis d'accord de moins perdre de temps sur photoshop/illustrator et d'aller à l'essentiel. Mais d'imaginer et réaliser la mise en page directement sur un framework avec le code, j'ai du mal à le concevoir.
Du coup je suis un peu perdu, je me dis qu'alors mon futur processus serait de faire les maquettes wireframes tout en les validant avec le client, ce qui me paraît essentiel. Ensuite de créer une planche tendance avec quelques aspects graphiques pour donner l'ambiance et de prototyper les maquettes directement dans le css via un framework pour profiter du système de grilles fluides, qui auront les mêmes proportions quelque soit la résolution de l'écran (le nombre de colonnes change certes). J'avais même penser à introduire Edge Reflow qui je trouve est entre la maquette photoshop et le prototypage html/css et qui permet de garder une homogénéité dans la grille car il gère le côté responsive.
Voilà je ne sais pas si j'ai été assez clair. En gros je ne sais plus trop dans quelle direction faire partir mon site pour faire reposer la structure sur un système de grille tout en ne perdant pas trop de temps à créer et reproduire des maquettes. Comment faites vous ? (Les grandes étapes). Partez vous toujours d'une grille à l'ancienne 960 ou autre pour tout votre site responsive? Éliminez vous tout logiciel graphique type photoshop dans la phase maquettage ? Les frameworks sont ils pour vous la nouvelle façon de maquetter un site ?
Merci à tous pour votre contribution!
. C'est assez rapide de le faire sous illustrator aussi 
.
. 