Aller au contenu
Guide7 min de lecture

Démo portfolio Windsurf

Une rangée de captures d'écran se ressemble. Une rangée de démos fonctionnelles non.

Construisez un portfolio de projets Windsurf autour d'images en fonctionnement plutôt que de captures, pour que chaque entrée mérite un regard attentif.

Voir comment ça marcheLes 60 premières secondes de vidéo sont gratuites, avec un filigrane. Vérifiez votre adresse e-mail pour la télécharger.

Un portfolio construit à partir de plusieurs projets Windsurf a un problème qu'une page de projet unique n'a pas : un relecteur qui compare des entrées côte à côte remarquera immédiatement une incohérence. Si une entrée a une vidéo fonctionnelle et la suivante seulement une capture d'écran, l'entrée avec la capture d'écran se lit comme plus faible même si le projet sous-jacent est tout aussi solide, simplement parce que le relecteur ne peut pas le savoir. Traiter le portfolio entier comme un seul livrable, plutôt que plusieurs livrables séparés, change la façon dont chaque vidéo individuelle doit être planifiée.

Windsurf est un éditeur de code, pas un hébergeur, donc chaque projet du portfolio est accessible là où il a réellement été déployé, et cela peut varier d'un projet à l'autre. Avant de planifier l'ensemble de vidéos du portfolio, confirmez quels projets sont actuellement accessibles, puisqu'un ancien projet qui a depuis été retiré ne peut pas être représenté honnêtement par un enregistrement récent. Un portfolio est un document vivant, et certaines entrées devront être retirées ou représentées différemment une fois que leur version en ligne disparaît.

Les entrées plus anciennes méritent un audit avant une recherche d'emploi ou une nouvelle campagne de prospection client, plutôt que de supposer qu'une vidéo enregistrée il y a des mois correspond toujours au projet en ligne. Une dépendance peut se casser, un niveau d'hébergement gratuit peut expirer, ou un projet peut simplement être retiré une fois son but initial atteint. Un portfolio qui relie plusieurs routes mortes se lit plus mal qu'un portfolio plus petit où chaque entrée fonctionne encore.

Quels projets méritent une vidéo ?

Tous les projets ne méritent pas ce traitement. Un projet qui n'a jamais atteint un état démontrable fonctionnel est mieux décrit en texte que mal représenté par un enregistrement qui ne montre qu'une interface sans rien derrière. Réservez le format vidéo aux projets où une interaction réelle peut être montrée de manière convaincante, et laissez les projets plus anciens ou plus petits rester des entrées textuelles avec un lien vers le code à la place.

Soyez honnête avec vous même sur la différence entre un projet que vous avez terminé et un projet que vous avez arrêté de développer. Les deux sont courants dans un portfolio personnel, et il n'y a rien de mal à inclure le second type, mais il doit être étiqueté et présenté pour ce qu'il est plutôt qu'habillé d'une vidéo qui laisse entendre plus d'achèvement que le projet n'en a réellement atteint.

État du projetMeilleur traitement pour le portfolioPourquoi
Entièrement fonctionnel, déployéUne courte vidéo de l'interaction centraleLa preuve vaut mieux que la description
Fonctionnel localement, non déployéUne vidéo du parcours local, clairement étiquetéeMontre encore une fonction réelle
Incomplet ou abandonnéUne description textuelle et un lien vers le codeUne vidéo exagérerait son degré d'avancement

Une situation liée mais distincte est un projet destiné à accompagner de la documentation plutôt qu'une page de portfolio, ce que le guide de la vidéo de démo produit pour README couvre séparément, puisqu'un public de README a déjà plus de contexte qu'un visiteur de portfolio.

Comment garder cohérent un portfolio multi projets ?

Décidez d'une structure partagée avant d'enregistrer la première vidéo, et appliquez la à chaque entrée par la suite. Une durée cohérente, un rythme cohérent, et une manière cohérente de présenter l'état de départ aident tous un relecteur à parcourir plusieurs entrées rapidement sans avoir à se réorienter pour chacune. L'incohérence coûte plus cher à travers un portfolio qu'elle ne le ferait pour une seule page autonome.

Écrivez la structure partagée une fois, même brièvement, plutôt que de compter sur votre mémoire en enregistrant plusieurs entrées à travers différentes sessions. Une courte liste de vérification couvrant la durée, le plan d'ouverture et le style de sous-titrage garde la troisième entrée cohérente avec la première, en particulier si le portfolio se construit progressivement sur des semaines plutôt qu'en une seule séance.

  • Fixez une durée cible pour chaque entrée et respectez la à travers tout le portfolio.
  • Ouvrez chaque vidéo de la même manière, sur l'état de départ avant l'action.
  • Préparez les données de chaque projet pour qu'aucune entrée ne paraisse nettement plus soignée que les autres.
  • Enregistrez les entrées par lots quand c'est possible, afin que le rythme reste similaire tout du long.

Si une connexion est requise pour un projet, demandez un compte de démonstration plutôt que de réutiliser une connexion personnelle pour chaque entrée. Rappelez vous que sur GogoScreen, les identifiants sont chiffrés, utilisés pour un seul rendu, puis supprimés. Si un storyboard est planifié en premier, les identifiants restent chiffrés pendant cette session et sont supprimés au plus tard deux heures après leur dernière utilisation. Préparer un ensemble de comptes de démonstration à l'avance, avant d'enregistrer tout le lot, évite d'interrompre le lot à mi chemin.

Il est aussi utile d'écrire à l'avance le travail prévu pour chaque projet, de la manière dont vous rédigeriez un court brief pour quelqu'un d'autre faisant le travail. Une liste de travaux préparée à l'avance garde le lot en mouvement et rend évident après coup si chaque entrée a bien reçu le traitement prévu, plutôt que de découvrir à mi relecture qu'un projet a été enregistré contre le mauvais écran entièrement.

Comment chaque sous-titre doit il être rédigé ?

  1. Choisissez les projets qui peuvent réellement montrer un résultat, pas seulement une interface.
  2. Gardez chaque entrée à la même durée et structure, afin qu'un relecteur puisse les comparer rapidement.
  3. Sous-titrez chaque vidéo avec le travail qu'elle prouve, pas une description générale du projet.

Rédigez chaque sous-titre autour du travail précis que la vidéo démontre, pas une reformulation de la pile technique du projet. Un relecteur qui parcourt rapidement les sous-titres devrait pouvoir dire ce que prouve chaque vidéo sans toutes les regarder, ce qui n'est possible que si les sous-titres décrivent des résultats plutôt que de répéter que le projet utilise Windsurf.

Et si un enregistrement ne se passe pas comme vous le vouliez ?

Comparez un enregistrement d'écran manuel à ce flux de travail avec le guide de l'enregistrement d'écran contre la démo automatisée si vous hésitez sur l'approche la mieux adaptée à un lot de plusieurs projets plutôt que d'enregistrer chacun à la main. Si un rendu précis ne réussit pas, le guide sur l'échec de rendu d'une vidéo de démo explique quoi vérifier avant de réessayer, et le temps n'est utilisé que lorsqu'un rendu réussit réellement, donc une tentative échouée pendant la construction du portfolio ne coûte rien au delà de l'attente.

Un portfolio vieillit aussi différemment d'un actif de lancement unique. Une vidéo de lancement est jugée par rapport au moment où elle a été publiée, tandis qu'un portfolio est jugé chaque fois que quelqu'un de nouveau le regarde, des mois ou des années plus tard. Revisitez l'ensemble périodiquement plutôt que de le traiter comme terminé, et soyez prêt à retirer une entrée une fois que le projet derrière elle cesse de représenter le travail que vous voulez qu'on vous attribue.

Si l'un des projets du portfolio se dirige vers son propre lancement public plutôt que de rester une entrée de portfolio, c'est un brief différent. Une vidéo de démo Base44, une vidéo de page de destination Base44, une vidéo de lancement Product Hunt Base44, ou une passation Base44 share with a client répondent chacune à une question plus précise qu'une entrée de portfolio n'en a besoin. Une relecture d'une application Windsurf est le bon format à la place si le but est de prouver qu'une demande précise a été accomplie pour quelqu'un qui a déjà commandé le travail, et une démo Product Hunt d'un agent IA ou une liste de vérification de lancement d'un agent IA s'appliquent une fois qu'un projet sort de l'étape du portfolio entièrement.

Que faut il vérifier avant de publier l'ensemble ?

Regardez tout l'ensemble d'un bout à l'autre, de la manière dont le ferait un relecteur qui parcourt le portfolio. Confirmez que le rythme reste cohérent et qu'aucune entrée ne paraît nettement plus brute que les autres. Comparez l'approche générale à Clueso si vous hésitez entre des outils pour ce genre de travail par lots.

Chaque nouveau compte reçoit 60 secondes de vidéo une seule fois, avec filigrane, et après cela le temps acheté en recharge n'expire jamais et le temps n'est utilisé que lorsqu'un rendu réussit. Cette structure tarifaire favorise la construction progressive du portfolio, projet par projet, plutôt que d'essayer de terminer tout l'ensemble en une seule séance. Consultez les tarifs pour les forfaits, parcourez plus de guides et de comparaisons, ou partez de la page d'accueil de GogoScreen avec la route et l'indication du premier projet.

Précisions

Avant de commencer

Combien de projets Windsurf devraient avoir une vidéo dans un portfolio ?

Seulement ceux qui peuvent montrer une interaction réellement fonctionnelle. Un projet pas assez avancé pour démontrer un résultat réel est mieux laissé comme une description écrite plutôt que représenté par un enregistrement trompeur ou vide.

Chaque vidéo de portfolio doit elle utiliser le même format ?

La cohérence aide un relecteur à passer rapidement d'une entrée à l'autre, donc une durée et une structure partagées à travers le portfolio valent plus que la variété pour elle même.

Que faire si un rendu échoue pendant la construction du portfolio ?

Environ un rendu sur cinq a besoin d'une nouvelle tentative. Le temps n'est utilisé que lorsqu'un rendu réussit, donc une tentative échouée ne coûte rien au delà de l'attente.

Collez une URL, décrivez un parcours et obtenez une vidéo de démonstration de votre application web.

Les 60 premières secondes de vidéo sont gratuites, avec un filigrane. Vérifiez votre adresse e-mail pour télécharger la vidéo.