Comment présenter des maquettes de conception web à un client?

Je travaille sur un projet de refonte de site Web. Je devrai présenter quelques maquettes différentes au client pour examen. Je veux m'assurer que le client peut tout voir dans son contexte. Je ne veux pas supposer que le client a le bon logiciel. Peut-être même ajouter quelques commentaires, questions ou informations sur l'orientation de la conception.

Quelle est la manière typique de présenter des maquettes à un client? Je suppose que la présentation de maquettes de sites Web par courrier électronique n'était pas la meilleure façon. Si le courrier électronique est un moyen efficace de présenter des maquettes, veuillez l'expliquer dans une réponse.

Eh bien, il existe plusieurs façons d'envoyer une maquette à un client. Si vous êtes préoccupé par les logiciels, vous pouvez exporter chaque conception en tant que .pdfet créer une multi-page .pdfdans Acrobat, et ajouter des commentaires pour faciliter la présentation si vous ne souhaitez pas simplement envoyer des images.

Une autre option est de les faire imprimer sur un panneau d'affichage et de faire une démonstration lors d'une réunion.

créer des diaporamas et les afficher dans une interview.

Codez le site Web en fil de fer, c'est pourquoi j'ai posté cela .

Si vous voulez acheter pas cher du papier à dessin comme celui-ci , procurez-vous une règle d'environ 36 "filaire votre site et utilisez des crayons de couleur pour illustrer le fil de fer.

Votre question est très vague et il existe plusieurs idées et solutions. Quand j'ai lu cette question, je ne sais pas à quelle étape vous en êtes dans la refonte. Lorsque vous faites référence à la maquette, je supposais que vous étiez au stade de la trame filaire.

EDIT: mais en réalité, si vous êtes si inquiet que le client ait la bonne idée du site, vous pourriez aussi bien le coder et vous assurer que votre fichier CSS est suffisamment modifiable pour ne pas vous creuser un trou avec les changements. Ce site est-il censé être un site CMS, un simple site HTML, un site de commerce électronique, etc. etc. Pourquoi ne pas simplement créer tout le site dans un cadre filaire CSS?

Si j'ai bien compris, vous vous demandez s'il existe un moyen «standard» de partager des maquettes (comme c'est le cas lors de l'envoi, par exemple, de conceptions de logo - où vous suivez généralement les directives de présentation).

En ce qui me concerne: non, il n'y en a pas.

Cela dépendra principalement des moyens de communication que vous utiliserez avec vos clients. Bien que les e-mails soient parfaitement valides dans la plupart des cas, vous devrez peut-être partager les résultats de votre travail avec une équipe plus importante, par exemple. Dans ce cas, vous voudrez peut-être utiliser une application qui permet aux gens d'interagir de manière plus dynamique.

Certains outils de gestion de projet que j'ai utilisés pour les commentaires de l'équipe sont BaseCamp et Trello . Mais il y en a beaucoup d'autres similaires que vous pourriez trouver très utiles (même Google Docs - Il y a une liste complète ici aussi). Leur avantage est de laisser différents membres laisser leur avis sur le développement, et comme vous le mentionnez dans le commentaire, il permet des suivis sur tout.

Balsamiq est un autre excellent outil pour ajouter facilement des commentaires et apporter des modifications aux maquettes en ligne (il ne nécessite pas vraiment d'expertise du client, c'est très intuitif), mais vous auriez probablement besoin d'obtenir une licence étendue pour pouvoir inviter des personnes plus de.

Je pense que vous posez des questions sur l'acte physique de présentation plutôt que sur les détails de la technologie.

Vous avez raison dans ce contexte est une grande partie d'une présentation réussie. L'envoi de maquettes à regarder sans que vous y soyez n'est pas idéal. Ce qui se passe généralement, c'est que vous obtiendrez des commentaires non focalisés ... souvent où les commentaires se concentreront sur les détails esthétiques sans conséquence et souvent subjectifs plutôt que sur les principaux problèmes stratégiques.

Ce que je recommanderais, c'est une forme de visite officielle avec eux. Idéalement en personne, mais sinon en personne, vous pouvez facilement le gérer via un appel téléphonique (envoyer les fichiers 5 minutes avant l'appel) ou via une sorte de technologie de partage d'écran telle que Skype.

De cette façon, vous pouvez non seulement montrer vos visuels, mais vous pouvez EXPLIQUER vos visuels. Vous pouvez parler des décisions esthétiques et stratégiques que vous avez prises pour tirer les conclusions auxquelles vous êtes parvenu. Vous pouvez aider à concentrer votre attention sur les aspects clés et à vous éloigner des détails les moins importants pour garder le projet dans les délais.

En ce qui concerne les éléments à montrer, je suis d'accord avec de nombreux autres commentaires selon lesquels afficher des maquettes visuelles statiques pour les sites Web n'est pas idéal et il existe probablement de meilleures façons de procéder, mais c'est vraiment une question entièrement différente.

En tant que développeurs et communicateurs, essayez de faire savoir à vos clients que ce qu'ils consultent est une image statique et plate de la conception de leur site potentiel. Voici quelques méthodes pour exposer une conception Web à un client:

Méthodes de présentation de maquettes de conception Web

• Placez l'image sur une page Web et envoyez-leur un lien

• Envoyer un JPEG ou PNG par e-mail

• Utilisez une sorte d'application Web

• Utilisez le site Web CodedPreview

• Créer un studio client

• Exporter des maquettes au format PDF

• Envoyez-leur un fichier JPEG ou PNG et demandez-leur de l'imprimer

J'ai contacté un de mes amis qui a recommandé ce qui suit:

• Si vous travaillez uniquement avec des images, il existe des applications comme mocku.ps
• Si vous recherchez un produit plus complet, il y a Pixelapse , qui se concentre davantage sur la collaboration. Il comprend le contrôle de version, les sauvegardes, les commentaires, etc.

Il n'y a pas de procédures standard à ma connaissance. Comme pour la plupart des choses, une fois que vous en savez plus sur le côté commercial du processus, différentes entreprises et différentes personnes ont des pratiques différentes.

J'ai travaillé avec une entreprise, qui était un peu plus sur le travail continu / marketing pour les clients, j'ai un système intelligent, où ils donnent à leurs clients une connexion à leur site Web, qui les amène à une page avec tous leurs ressources disponibles en téléchargement. Il s'agissait davantage de copies de leur logo et d'autres travaux divers dans différents formats de couleurs, résolutions et formats de fichiers, afin que les entreprises sans conception junky puissent en saisir différentes variantes, ou un fichier vectoriel si elles en avaient besoin pour une raison quelconque. Vous pouvez faire quelque chose de similaire à cela, avoir un journal qui affiche des images et des notes sur le travail en cours.

C'est une procédure assez lourde cependant. S'il s'agit d'un concert plus petit et unique, vous voudrez peut-être simplement envisager de compiler vos images dans un fichier pdf avec des notes expliquant ce qui, où vous ou ils sont dans le processus, ce qui est nécessaire de la part de qui et ce qui vient ensuite. Claquez votre logo en haut et formatez-le bien, et il aura l'air plus professionnel que de simplement joindre des images à un e-mail.

Il y a quelques mois, je suis tombé sur une application appelée InVision . Il offre la possibilité de télécharger des maquettes et de leurs révisions, de créer des prototypes interactifs et de laisser un commentaire sur une zone spécifique de la maquette. Cette application a amélioré la façon dont je donne / reçois des commentaires et communique avec mes concepteurs et clients.

Eh bien, vous créez des maquettes pour communiquer. Alors optez pour des ateliers en direct chaque fois que vous le pouvez.

Dans de tels ateliers, discutez des maquettes tout en peaufinant et annotant vos maquettes sur-le-champ. Vous créez quelque chose ensemble - cela en fait aussi leur bébé.

Notez que ci-dessus fonctionne si vous effectuez plusieurs étapes (par opposition à avoir une grande présentation lorsque vous avez déjà complètement terminé un prototype détaillé). Btw vous voulez d'abord modéliser vos écrans / pages principaux. Ensuite, allez dans les détails et faites-le un scénario à la fois.

Sur le dernier projet que j'ai dû présenter, nous avons eu une réunion avec le client et montré le png du story-board dans le navigateur. Rien d'extraordinaire mais il présentait les conceptions dans leur environnement «natif».

Mon expérience avec l'envoi d'images par e-mail au client est mauvaise - le client a généralement un problème avec le rapport et la taille des images dans leur client de messagerie. Cela pourrait entraîner un aperçu et une sensation un peu différents de la conception Web.

Nous utilisons un service en ligne pour publier nos travaux. Nous téléchargeons nos images vers un service d'hébergement tiers et envoyons les URL pour le client.

Plus tôt, dans les années 2000, l'envoi de mises en page par courrier électronique était efficace. Maintenant, la présentation du design au client a des services spéciaux. Est-il conçu spécifiquement pour cela.

Voyons comment le service (m) maquetter.com peut vous aider. Il est spécialement développé à cet effet que vous cound:

• Ajoutez rapidement les mises en page du site que vous dessinez;
• Distribuez les mises en page par sections de site Web (en répétant son menu, par exemple).

Il vous permet également:

• pour marquer les dispositions approuvées par le client
• mettre à jour la même mise en page et stocker son historique.

Ce service vous fournit un lien court. Vous l'envoyez (par mail, SMS ou Skype). Le client peut facilement visualiser vos mises en page dans n'importe quel navigateur. Vous pouvez voir comment cela fonctionne comme votre client peut le voir .

Le service est gratuit. Mais vous pouvez utiliser un plan tarifaire payé pour pouvoir présenter plus de mises en page.

Essayez-le vous-même

Pour plus d'informations, vous pouvez lire le blog

Vous pouvez créer une démo interactive avec vos captures d'écran / images. Jetez un œil à ces outils: http://www.appdemostore.com/ et http://giveabrief.com/ .

Les deux sont très faciles à utiliser; choisissez un cadre d'appareil, téléchargez vos images et ajoutez l'interaction dont vous avez besoin. Vous pouvez inclure des boutons, des icônes pour pincer, étendre, etc. J'espère que cela vous aidera. :)