Comment faire un screencast pour votre site Web

Avoir une vidéo sur votre site Web peut grandement améliorer votre taux de conversion. Que l'objectif soit que les utilisateurs s'inscrivent à votre application Web ou que les utilisateurs vous contactent via un formulaire Web, une vidéo augmente la probabilité que cela se produise.

Vous n'avez qu'à accéder à la page d'accueil de tout nouveau démarrage basé sur Internet et vous verrez une vidéo incorporée avec un très grand appel à l'action vous invitant à lire son introduction vidéo de deux ou trois minutes.

Les vidéos présentant des applications Web ou des services Web sont souvent appelées screencasts car ils capturent généralement des événements sur le site Web de l'entreprise. Ces screencasts peuvent résumer en seulement deux minutes ce qui pourrait autrement nécessiter beaucoup de pages à expliquer, de sorte qu'ils apportent de puissants ajouts aux sites Web.

Est-ce facile de faire un screencast? Combien cela coûte-t-il et quels outils sont nécessaires? Répondons à ces questions.

Faire votre propre screencast

Supposons que vous ayez une application Web ou un service Web à promouvoir. Vous voulez créer un screencast pour montrer ce qu'il fait. Voici quelques conseils pour vous aider à démarrer.

Planification

Comme pour tout, la planification est essentielle. Alors, avant de faire quoi que ce soit d'autre, planifiez très soigneusement votre screencast . Considérez les questions suivantes:

Quel message global voulez-vous que la vidéo transmette?
Combien de temps la vidéo devrait être?
La vidéo doit-elle être un aperçu rapide et percutant de votre produit ou un screencast informel plus long et détaillé?
Voulez-vous que la vidéo soit personnelle, avec une voix off amicale, ou préférez-vous vous en tenir à la musique et aux titres?

Les tutoriels prennent souvent la forme d'un screencast informel. Les screencasts sont généralement non scénarisés mais suivent un storyboard de base. Les avantages sont que votre produit sera présenté de manière amicale et que ces screencasts peuvent être rapides à produire. Ils sont également plus informatifs et instructifs pour montrer comment fonctionne un produit.

Les inconvénients sont qu'ils peuvent paraître peu professionnels et peuvent être assez longs et moins attrayants pour les visiteurs. Donc, encore une fois, la planification de l'emplacement de votre vidéo (par exemple, la section d'aide ou la page d'accueil) et le message que vous souhaitez transmettre vous aideront à décider de l'approche à adopter.

Supposons que vous vouliez créer un screencast court, bien écrit et bien édité.

Le storyboard

Après avoir réfléchi à l’ensemble de la vidéo, sortez votre bloc-notes et votre stylo fidèles et dessinez un storyboard. Un storyboard est une représentation approximative du screencast et peut être utilisé comme une chronologie générale des scènes. Chaque scène aborderait un aspect différent de votre produit. Par exemple:

Introduction et résumé de votre service
Caractéristiques clés ou points de vente uniques;
Témoignages de clients;
Comparaison des plans de prix ou même une comparaison avec des produits concurrents;
Résumé final , avec logo et slogan.

Si vous avez beaucoup à couvrir dans votre screencast, diviser chaque scène en sous-scènes peut être utile, pour plus de détails. Plus vos storyboards sont détaillés, plus la phase d'édition sera facile.

Planifiez chaque scène et chaque sous-scène de la vidéo et, en dessous, écrivez des points sur ce que vous allez couvrir. Les puces peuvent inclure des exemples de parties de l'application Web sur lesquelles les utilisateurs doivent cliquer, des expressions particulières que vous pouvez utiliser dans la voix-off et tous les effets vidéo ou transitions dont vous avez besoin.

Votre storyboard vous aidera à rester organisé tout au long du processus, et si vous vous perdez dans la production de la vidéo, le storyboard vous permettra de reprendre le chemin.

Le script Voiceover

Si vous ne prévoyez pas de doubler la voix (bien que l’on puisse certainement vous aider), vous pouvez passer cette étape.

Une fois que vous avez esquissé votre storyboard, vous pouvez commencer à écrire votre script de voix off. Sur un autre morceau de papier, écrivez les titres de chaque scène, puis écrivez chaque scène en fonction des points que vous avez écrits plus tôt.

Assurez-vous de laisser un espace pour les modifications, car vous voudrez probablement ajuster le script lorsque vous enregistrez l'enregistrement.

Le bon logiciel

L'étape suivante consiste à enregistrer et à produire la vidéo. Vous aurez besoin des outils suivants.

Logiciel de capture d'écran

De nombreuses applications de capture d'écran existent, dont certaines sont gratuites et open source, d'autres que vous devez payer.

Screenium , disponible sur Synium, est une application basée sur Mac OS X, facile à utiliser et contenant de nombreuses fonctionnalités. Le logiciel coûte 29,00 $ et peut être téléchargé en ligne.

Jing est un outil Web gratuit qui vous permet de capturer des événements d'écran et de les partager sur le Web. Une version PC ou Mac complète est disponible pour 14,95 $ par an.

D'autres applications incluent open-source CamStudio , Je te montre pour Mac et Adobe Captiver .

Logiciel d'édition de film

Vous n'avez pas besoin d'un grand nombre de fonctionnalités pour éditer les screencasts. Les modules de montage simples fournis avec votre système d'exploitation suffisent généralement.

Si vous avez un Mac, ne cherchez pas plus loin que iMovie. Sinon, vous pouvez utiliser n'importe quelle application de montage vidéo numérique telle que Premier Pro, Final Cut ou même Windows Movie Maker.

Voici quelques fonctions d'édition utiles:

Transitions (ou "lingettes") entre les scènes;
Exporter vers des formats web
Changer la vitesse des clips;
Enregistrement de voix off dans l'application.

Les versions récentes d'iMovie (version 8+) présentent les fonctionnalités ci-dessus.

Musique de fond

Votre screencast nécessite un niveau élevé d’ engagement de la part des utilisateurs . La musique peut vous aider, surtout si elle est pertinente pour le screencast. Vous connaîtrez le style de musique à utiliser en fonction de votre public.

Assurez-vous d'avoir le droit légal d'utiliser la musique que vous choisissez. Certaines ressources en ligne utiles offrent une musique de fond (généralement classique) sans droits , et certaines vendent des CD de musique de fond qui pourraient convenir; check-out Tracks uniques et Musique libre de droits .

Bien entendu, la musique est entièrement facultative, car vous pouvez impliquer les utilisateurs autrement.

Armé de votre plan d'ensemble, de votre story-board, de votre script de doublage et de votre logiciel, vous pouvez maintenant commencer à enregistrer la vidéo.

Enregistrement de la vidéo

Pour les besoins de cet article, nous supposons que vous utilisez une application de capture de bureau telle que Screenium et iMovie pour la modification.

Commencez par capturer les scènes dans l'ordre de votre storyboard. Comme vous éditez la vidéo ultérieurement, vous pouvez continuer à enregistrer jusqu'à obtenir la prise parfaite.

Capturez une partie de votre écran , pas tout l'écran. Cela empêchera la vidéo d'être encombrée (par le Dock ou la barre des tâches, par exemple), et vous ne devrez pas recadrer la vidéo plus tard.
Vous voulez des actions fluides, claires et précises lors de l'enregistrement. Gardez le mouvement de la souris au minimum et assurez-vous que vos clics de souris sont évidents. Votre application d'enregistrement peut avoir une fonctionnalité où les clics de la souris déclenchent une aide visuelle, ce qui peut être utile.
Gardez le script de voix off devant vous et imaginez que le script est prononcé lorsque vous enregistrez les actions de la souris. Cela aidera avec le moment où vous aurez à éditer plus tard.
Faites correspondre le nom du fichier pour chaque clip avec le nom de la scène correspondante, de manière à ce que vous sachiez où se trouve le clip lors de l'édition (par exemple 1. Intro ).
Prévoyez un espace au début et à la fin de vos actions enregistrées. Cela vous aidera lorsque vous coupez les clips et les transitions (par exemple, en atténuant un clip dans le suivant).

Modification de la vidéo

Une fois que vous avez enregistré tous les clips pour chaque scène, vous pouvez passer au bit fun, qui est l'édition.

En utilisant votre application de montage de film, importez tous les clips dans votre bibliothèque et mettez-les dans le bon ordre (si vous avez enregistré les clips avec des noms de fichiers séquentiels, ils devraient déjà être dans le bon ordre).

L'étape suivante consiste à découper vos vidéos pour que le timing soit approprié pour la voix off, puis déposez-les dans la chronologie.

Le meilleur moyen d'obtenir le bon timing est de commencer la lecture et de lire le script pour cette scène; vous saurez alors s'il faut ajouter une ou deux secondes au début ou à la fin du clip. Ne laissez pas trop d'espace vide car la vidéo sera longue et perdra toute participation de l'utilisateur.

Continuez à faire circuler la vidéo et assurez-vous qu'il y a toujours quelque chose à regarder ou à écouter. Pour les scènes plus compliquées, vous pouvez laisser un peu plus d'espace à la fin avant de continuer, pour permettre aux utilisateurs d'absorber ce qu'ils viennent de voir.

Une autre astuce consiste à ajouter des transitions entre les scènes, qui accomplissent deux choses. Tout d'abord, ils ont tout simplement l'air cool. Deuxièmement, ils fusionnent des scènes que vous n'aviez pas prévu de rejoindre. Par exemple, vous pouvez avoir deux scènes adjacentes montrant la même page de votre site Web, mais l'emplacement de la souris passe brusquement d'un clip à l'autre.

Une transition brouille le mouvement et rend la coupe transparente.

Enfin, montrez la marque de votre entreprise au début et à la fin du screencast. Importez simplement un fichier JPG haute résolution de votre logo dans le film. Certains éditeurs de films (tels que iMovie) ont un effet d'image automatique appelé "Ken Burns", qui effectue un zoom avant ou arrière subtil sur une image. Cela rend votre film plus professionnel qu’il ne l’aurait fait avec un logo statique placé juste au milieu du cadre. "Subtil" est le mot-clé, cependant: assurez-vous que tous vos effets sont subtils; exagérer et vous risquez de regarder non professionnel.

La voix off

Une voix off n'est pas indispensable. Certaines vidéos se contentent d'utiliser uniquement des superpositions de titres pour mettre en évidence des fonctionnalités clés. Mais une voix humaine engage davantage les utilisateurs et leur fait sentir qu’ils ont affaire à un produit réel fabriqué par une entreprise réelle. En outre, une voix-off vous permet de communiquer beaucoup plus d'informations sur votre produit ou service, car les utilisateurs utiliseront leurs oreilles et leurs yeux.

Pour faire une voix off, branchez simplement un microphone de bonne qualité et enregistrez quelqu'un qui a une bonne voix en lisant votre script sur chaque scène. Il est préférable d'enregistrer chaque scène individuellement, car vous pouvez ensuite déplacer le clip audio au bon endroit après chaque prise et obtenir un timing parfait. Assurez-vous que votre voix-off est lue clairement, lentement et avec un sourire, de manière à ce qu’elle sonne bien.

Exportation et téléchargement de la vidéo

Une fois que vous avez terminé, exportez la vidéo et prenez une tasse de café. De nombreuses applications de montage vidéo, y compris iMovie, ont une fonction "Export to Web"; vous pouvez donc simplement choisir le format vers lequel exporter (par exemple, iPhone ou YouTube). Choisissez une qualité moyenne à élevée, avec une largeur d'au moins 600 pixels.

Lorsque vous téléchargez votre vidéo sur l'hôte Web, celle-ci subit une compression supplémentaire: ce que vous mettez en mémoire est ce que vous obtenez . Si vous placez un fichier de grande taille et de haute qualité, la vidéo obtenue sur le site Web sera beaucoup mieux que si vous aviez téléchargé une vidéo fortement compressée de taille inférieure.

Après avoir téléchargé la vidéo, la société d'hébergement doit vous envoyer une notification par e-mail dès que l'encodage est terminé. À ce stade, vous êtes pratiquement prêt à mettre le code d’incorporation sur votre site Web. Vous voudrez peut-être personnaliser le lecteur en premier; Par exemple, en faisant correspondre la couleur du bouton "Lecture" à votre marque et en ajustant la taille du lecteur.

Enregistrez le code HTML mis à jour du code d’incorporation et vous êtes prêt à partir!

Suivi des conversions d'objectifs

Assurez-vous qu'un package d'analyse (tel que Google Analytics) est configuré sur votre site Web pour que vous puissiez voir d'où viennent les visiteurs et suivre les conversions d'objectifs .

Si votre site Web exécute déjà un logiciel d'analyse et que vous avez des conversions d'objectifs existantes, il s'agit d'une occasion idéale de voir comment votre nouvelle vidéo affecte ces conversions. Si votre site Web est nouveau, il sera difficile de voir quelle différence fera la vidéo, mais vous pouvez toujours suivre les conversions d'objectifs et utiliser les données plus tard.

Configurez un objectif qui suit l'utilisateur de la page d'accueil à la page vidéo (s'il se trouve sur une page distincte) jusqu'à la page d'inscription. Après quelques semaines, passez en revue les statistiques et analysez votre taux de conversion ou d'inscription.

Et si vous apportez des modifications à la vidéo ou à la page, par exemple en déplaçant la vidéo ailleurs dans l'architecture des informations, vous pouvez voir si la conversion de vos objectifs est affectée par ces modifications.

Exemples de bonnes utilisations des screencasts

Thounds

Thounds vous appelle pour cliquer sur son lien "vidéo promo", qui vous amène à une fenêtre contenant la vidéo.

La vidéo décrit clairement le service de Thounds dans une vidéo de deux minutes rédigée, écrite et bien produite.

Bketketch

Bketketch intègre sa vidéo YouTube à mi-chemin de la page après une brève explication de son produit.

Wistia

Wistia a un appel grand et évident à regarder sa vidéo de 30 secondes. La vidéo est au - dessus du pli et proéminente.

Commentaires sur le concept

Commentaires sur le concept a une vidéo sur le côté droit qui montre clairement son produit. L'appel à l'action n'est cependant pas très clair.

FileShareHQ

FileShareHQ démontre clairement son produit en quatre minutes. La vidéo réside sur sa page "Tour".

MakeSomeTime

MakeSomeTime a une vidéo qui montre son produit en trois minutes. L'appel à l'action est en dessous du pli.

Projet bulle

Sous ses caractéristiques de produit, Projet bulle a un appel à l'action qui s'ouvre en tant que vidéo pop-up. Sa vidéo de trois minutes est hébergée sur Vzaar , donc le joueur est sans marque.

CushyCMS

CushyCMS est un excellent exemple car sa vidéo est au - dessus du pli , a un appel à l'action clair et s'ouvre dans une grande fenêtre contextuelle qui illustre le produit en trois minutes .

Notable

Notable fournit un appel clair à l'action à droite de la description de l'application. La vidéo est hébergée par Vimeo.

Conseils sur l'utilisation de la vidéo sur votre site Web

Les vidéos ci-dessus maintiennent les visiteurs engagés en dépassant rarement quatre minutes. Une bonne longueur pour une vidéo de démonstration est de deux à trois minutes , et idéalement pas plus de cinq minutes . Certains sites Web gardent leurs vidéos aussi courtes que 30 secondes, comme vous l'avez vu avec Wistia.
Faites attention à l'endroit où vous hébergez votre vidéo. Certains fournisseurs déclarent explicitement que toutes les vidéos téléchargées sur leur service doivent être destinées à un usage non commercial; ainsi, si votre vidéo montre un produit professionnel, vous violeriez alors ses conditions d'utilisation. En outre, certains hébergeurs mettent beaucoup de temps à encoder des clips et certains affichent des vidéos de très faible qualité. Donc, si vous voulez un service rapide et de haute qualité, vous pourriez envisager de payer pour un hôte premium.
Assurez-vous que la vidéo s'ouvre correctement , surtout si vous avez une démonstration détaillée d'un produit. Une bonne solution est une application Lightbox telle que Facebox : l'utilisateur clique sur un bouton qui déclenche une fenêtre contextuelle dans laquelle la grande vidéo est présentée. Une bonne taille pour la vidéo est de 600 pixels ou plus.
Un appel clair à l'action au-dessus du pli augmente les chances que les visiteurs cliquent dessus. Certains concepteurs préfèrent expliquer le produit en premier et ensuite afficher la vidéo ci-dessous. Une bonne architecture de l'information est essentielle, en particulier sur la page d'accueil, alors réfléchissez bien à votre emplacement.
Assurez-vous qu'un bouton "Lire" apparaît clairement sur la vidéo intégrée dans son état de non-lecture, afin que les visiteurs le reconnaissent comme une vidéo. Si la vidéo est dans une fenêtre contextuelle, jouez-la automatiquement une fois la fenêtre pop-up activée.

Fournisseurs d'hébergement vidéo

Voici quelques-uns des nombreux fournisseurs d'hébergement vidéo:

Youtube - Le choix évident Les avantages sont que c'est gratuit et bien connu. Les inconvénients sont que la qualité n'est pas exceptionnelle et que les vidéos mettent parfois du temps à être encodées. Un autre inconvénient est son omniprésence: si vous essayez de projeter une image professionnelle de qualité, la présentation d’une vidéo sur YouTube risque de ne pas refléter cette esthétique.
Vimeo - Vimeo est devenu très populaire l'an dernier. Les avantages sont qu’il a une grande communauté et un très bon joueur. Les inconvénients sont que ses conditions de service sont assez strictes, alors lisez-les avant de télécharger des vidéos.
Vzaar - Une nouvelle entreprise qui propose un hébergement vidéo de qualité supérieure. Les avantages sont que les vidéos encodent rapidement, le lecteur est bon et vous êtes autorisé à télécharger des vidéos commerciales. Un autre pro est que Vzaar ne met pas sa marque sur les vidéos. Les inconvénients sont que c'est un service payant; et parce que la société est assez récente, son processus de téléchargement est légèrement buggé.
Wistia - Comme présenté ci-dessus. Les avantages sont un lecteur sans marque, un encodage rapide et des outils marketing tels que des statistiques et des cartes de chaleur. Le con est la forte prime à utiliser le service.

Vous pouvez toujours héberger la vidéo sur votre propre serveur et utiliser un lecteur tel que le JW Player de Long Tail Video. Si vous faites cela, vous devrez peut-être encoder la vidéo au format FLV.

Écrit exclusivement pour WDD par Stu Green. Il est un concepteur Web du Royaume-Uni et gère Haloweb , une entreprise de conception d'applications Web.

Avez-vous un screencast sur votre site Web qui a augmenté les conversions d'objectifs? Si c'est le cas, faites-le nous savoir et expliquez le processus de construction. En outre, si vous avez des conseils sur la production ou l’intégration de vidéos, partagez-les avec la communauté.

comment faire un screencast screencast