Saltar para o conteúdo
Guia7 min de leitura

Vídeo de Demonstração de Portefólio Bubble

Mostre a aplicação Bubble em funcionamento em vez de pedir ao avaliador que a imagine.

Transforme uma construção Bubble em funcionamento numa entrada de portefólio que mostra a aplicação em ação, não uma captura de ecrã, para um avaliador.

Ver como funcionaOs primeiros 60 segundos de vídeo são gratuitos, com marca de água. Verifique o seu correio eletrónico para o descarregar.

Uma entrada de portefólio Bubble tem um único trabalho: convencer alguém que não construiu a aplicação de que quem a construiu sabe o que está a fazer. Uma imagem estática do separador de desenho do editor não consegue fazer isso. Mostra disposição, não comportamento, e o trabalho em Bubble é sobretudo comportamento. O fluxo de trabalho que dispara quando um botão é premido, a regra de privacidade que decide que linhas de dados um utilizador com sessão iniciada pode ver, o motor responsivo que reordena elementos quando o navegador estreita: nada disso sobrevive a uma captura de ecrã. Um vídeo curto da aplicação realmente a funcionar fecha essa lacuna para um avaliador que tem trinta segundos e nenhuma intenção de abrir uma ligação de pré-visualização por conta própria.

O GogoScreen recebe o URL de uma aplicação web e uma linha a descrever o que mostrar, e devolve um MP4 narrado e editado cerca de dois minutos depois. Para uma aplicação protegida por início de sessão, pode usar uma conta de demonstração fornecida. A edição é mecânica em vez de criativa: aproximações nos cliques, suavização do cursor, tempo morto removido, legendas gravadas. Isso é suficiente para transformar um fluxo funcional em algo que um avaliador vê em vez de algo que lhe pedem para acreditar.

O que deve mostrar realmente uma demonstração de portefólio Bubble?

Escolha o único fluxo na aplicação que um cliente que contrata ou o responsável de uma agência perguntaria primeiro. Para uma construção de mercado isso costuma ser um anúncio a ser criado e depois a aparecer num resultado de pesquisa. Para uma ferramenta interna costuma ser um registo a ser inserido e uma vista posterior a atualizar-se porque um fluxo de trabalho correu. Resista à vontade de percorrer todas as páginas que a aplicação tem. Um avaliador a decidir se contrata alguém não precisa de uma visita completa, precisa de prova de que uma peça de lógica real funciona do início ao fim.

A maioria das aplicações Bubble construídas para um portefólio fica no subdomínio predefinido bubbleapps.io em vez de num domínio comprado, e isso é aceitável mostrar tal como está. O que importa é se o URL aponta para a versão ao vivo ou para uma construção version-test ainda em revisão interna. Diga qual das duas é no texto que rodeia a página para que ninguém assuma que um trabalho em curso é o produto acabado.

Decisão de portefólioO que transmite ao avaliadorO que evitar
Mostrar a versão ao vivoA construção está concluída e assume-se por elaApresentar version-test como se estivesse já lançada
Um fluxo, do início ao resultadoUma competência específica foi provada, não apenas uma disposiçãoUma visita a todas as páginas sem uma ação concluída
Dados de demonstração preparados com antecedênciaO avaliador vê uma aplicação credível, não uma tabela vaziaDados reais de clientes ou um tipo de dados em branco

Como se lida com um ecrã de início de sessão no fluxo?

Um número significativo de construções Bubble que vale a pena mostrar num portefólio está protegido pelo tipo de dados User incorporado na aplicação, porque o comportamento interessante, a vista personalizada ou o registo ligado a uma conta, só aparece depois de alguém ter sessão iniciada. Forneça uma conta de demonstração em vez de saltar o fluxo ou narrar em torno dele. No GogoScreen as credenciais fornecidas são cifradas, utilizadas para uma única renderização e depois eliminadas. Se for planeado primeiro um storyboard, as credenciais ficam cifradas durante essa sessão e são eliminadas, no máximo, duas horas após a última utilização. É assim que a situação é realmente tratada, descrita com clareza em vez de subestimada.

Se um ecrã real está atrás de etapas de integração irrelevantes para a competência a provar, semeie a conta de demonstração para além delas com antecedência, de modo a que o fluxo gravado comece no momento que importa. Um observador que veja alguém clicar em cinco ecrãs de configuração antes de chegar à funcionalidade real vai deixar de ver antes de essa funcionalidade aparecer.

  1. Escolha uma construção Bubble no portefólio que prove uma competência real, não apenas um modelo.
  2. Abra a versão ao vivo da aplicação e prepare dados de demonstração seguros para mostrar.
  3. Escreva a indicação de uma linha, peça o vídeo, e reveja o resultado antes de o adicionar ao portefólio.

Que dados devem estar na aplicação quando ela grava?

Um tipo de dados Bubble vazio faz até a lógica correta parecer avariada, porque o observador não consegue saber se uma lista está vazia por conceção ou porque nada foi inserido. Preencha duas ou três linhas de conteúdo credível de exemplo antes de pedir a renderização. Use nomes e organizações inventados em vez das informações de um cliente real, mesmo que a construção tenha sido feita para um cliente real, a menos que esse cliente tenha aprovado explicitamente ser mostrado.

Dados preparados também protegem a gravação de um estado vazio acidental. Se um resultado de pesquisa, uma contagem no painel, ou uma lista filtrada não tiver nada para mostrar, a renderização vai mostrar exatamente isso e não há forma de editar isso depois. Verificar a aplicação manualmente antes de submeter uma renderização, da mesma forma que qualquer construção em fase de testes é verificada antes de ser gravada, evita isto antes de se reservar tempo para uma renderização que tem de ser refeita.

Onde é que isto se encaixa junto a uma captura de ecrã estática ou a um GIF?

Uma captura de ecrã responde a "como é que parece." Um vídeo responde a "isto funciona." A maioria dos portefólios beneficia de ter os dois, com o vídeo a fazer o trabalho mais pesado. Quem já tentou comprimir um fluxo de várias etapas num GIF em ciclo conhece as trocas envolvidas, e o guia de alternativa em GIF à demonstração do produto cobre por que um vídeo curto e narrado normalmente comunica mais em menos espaço do que uma imagem animada consegue.

Escreva a indicação de uma linha da mesma forma que descreveria a um colega por cima do seu ombro: nomeie o ecrã inicial, a ação, e o resultado que espera ver. O guia de indicação de vídeo de demonstração de agente de IA tem mais detalhes sobre como formular uma indicação com precisão suficiente para a renderização corresponder ao que pretendia, em vez de algo próximo disso.

Tenha o som em mente mesmo numa entrada de portefólio que provavelmente será vista com áudio desligado primeiro. Um observador a percorrer uma página de portefólio num portátil num escritório não vai desativar o silêncio de nada, por isso a sequência visual precisa de fazer sentido sem narração, um ponto coberto diretamente no guia de vídeo de demonstração de produto com som desligado. Legendas gravadas na renderização carregam o ponto quando o áudio não é uma opção.

Como se compara isto a uma entrada de portefólio Firebase Studio?

A disciplina subjacente é a mesma entre plataformas de construção, mesmo que as especificidades da plataforma sejam diferentes. Um vídeo de demonstração Firebase Studio enfrenta uma questão diferente, já que as aplicações Firebase Studio normalmente são implementadas no Firebase Hosting e a pré-visualização dentro do espaço de trabalho não é algo que um cliente possa abrir sem acesso ao projeto. O guia de vídeo de página de destino Firebase Studio e o guia de vídeo de lançamento no Product Hunt Firebase Studio lidam ambos com colocar uma aplicação diante de um estranho que nunca a viu, o que está próximo do problema de portefólio mas não é idêntico, já que um observador de portefólio já sabe quem construiu a coisa e está a avaliar o construtor em vez de decidir se se regista. O guia de partilha Firebase Studio com um cliente está ainda mais próximo, porque entregar trabalho a alguém que não vai clicar numa ligação de pré-visualização é o mesmo problema que uma página de portefólio resolve para um avaliador que contrata.

Para uma construção feita com um agente de codificação de IA em vez de à mão no editor Bubble, a questão de revisão muda de novo, e o guia de vídeo de pull request de agente de IA cobre o que um avaliador precisa de ver quando a alteração em revisão veio de um pull request gerado em vez de uma pessoa a arrastar elementos para uma tela.

Antes de adicionar uma renderização concluída a um portefólio, veja-a uma vez da forma como um estranho veria: sem contexto, som desligado, num telemóvel se o portefólio for visto num. Se o fluxo continuar a fazer sentido a frio, está pronto. Se precisar de uma explicação escrita por baixo para fazer sentido, o fluxo era demasiado amplo e deve ser reduzido antes da próxima tentativa. Para o resto do fluxo de trabalho, desde a entrega ao avaliador de uma construção Bubble até alternativas Bubble a uma ferramenta de gravação de ecrã guiada, a página de preços para os planos e carregamentos, a biblioteca completa de guias, as páginas de comparação, e a página inicial do GogoScreen para o próprio fluxo de trabalho de URL e indicação, trate isto da mesma forma que qualquer outra construção em revisão: verifique-a manualmente antes de mais ninguém o fazer.

Esclarecimentos

Antes de começar

Por que falha uma captura de ecrã como entrada de portefólio Bubble?

Uma captura de ecrã mostra um único plano do separador de desenho. Não consegue mostrar um fluxo de trabalho a disparar, uma regra de privacidade a libertar os dados certos, ou o motor responsivo a reorganizar uma página em diferentes larguras, e é exatamente isso que um avaliador de uma construção Bubble quer verificar.

Um vídeo de portefólio Bubble deve usar a versão ao vivo ou a versão de teste?

Use a versão em que o avaliador deve confiar. Uma versão ao vivo no próprio domínio da aplicação transmite trabalho concluído. Uma construção version-test é aceitável para uma construção ainda em revisão, mas diga qual das duas é para que ninguém confunda um rascunho com a aplicação já lançada.

E se a aplicação Bubble exigir início de sessão para chegar ao ecrã interessante?

Forneça uma conta de demonstração descartável através do processo aprovado. No GogoScreen a credencial é cifrada, utilizada para uma única renderização e depois eliminada. Se for planeado primeiro um storyboard, as credenciais ficam cifradas durante essa sessão e são eliminadas, no máximo, duas horas após a última utilização. Nunca entregue um início de sessão real de um cliente para este fim.

Cole um URL, descreva um fluxo e obtenha um vídeo de demonstração da sua aplicação web.

Os primeiros 60 segundos de vídeo são gratuitos, com marca de água. Verifique o seu correio eletrónico para descarregar o vídeo.