Pesquisa de desejos comunitários 2021/Pré-visualização em tempo real para wikitexto

From Meta, a Wikimedia project coordination wiki
Jump to navigation Jump to search
This page is a translated version of the page Community Wishlist Survey 2021/Real Time Preview for Wikitext and the translation is 71% complete.
Outdated translations are marked like this.

Olá a todos e obrigado por terem vindo para ler mais detalhes sobre Visualização em tempo real. Este foi o quarto desejo na pesquisa de desejos da comunidade 2021. Este artigo irá delinear nossa abordagem para construir uma solução para esse desejo. Solicitamos seus comentários e percepções para que possamos fazer a melhor melhoria possível.

Resumo do objetivo do desejo: Permita que os editores do Wikitexto visualizem a página em tempo real durante a edição.

Desejo original

Contexto & problemas

NOTA: Para evitar confusão, renomeamos o título do desejo e o nome do projeto de Visualização ao vivo para Visualização em tempo real. Isso ocorre porque já existe um recurso diferente chamado Visualização ao vivo.

Wikitexto é uma linguagem de edição wiki. Isso é usado por muitos usuários para formatação em wikis. Parece diferente do que os leitores veem. Trabalhando com o wikitexto, pode ser difícil prever como seria o resultado final. É por isso que muitos editores usam a funcionalidade de visualização antes de publicar a alteração. No entanto, isso requer uma etapa extra separada do processo de escrita do wikitexto.

Em um alto nível, podemos resumir o problema do desejo original da seguinte forma:

Como os editores garantem que as mudanças que estão fazendo produzam o resultado que desejam?

Do ponto de vista do artigo, permitir que os editores visualizem o resultado final em tempo real poderia:

  • Melhore a experiência do editor reduzindo o número de etapas extras (cliques) dentro da jornada de edição
  • Permita que os editores detectem erros de digitação, revisem o wikitexto e corrijam-no imediatamente, mantendo a qualidade das wikis

Soluções propostas

Requisitos de concepção

A seguir está um conjunto de designs que podem fornecer aos editores uma maneira de visualizar seu conteúdo.

Como um usuário que edita em wikitexto usando uma tela do tamanho de um desktop, posso:

  • Tem a opção de visualizar o resultado do wikitexto
  • Torne a pré-visualização rolável para que eu possa visualizar facilmente o resultado final sem ocupar a tela inteira

Escopo e restrições

O botão de visualização em tempo real estará disponível para/em:

  • Ferramentas de edição baseadas em wikitexto. Não mudaremos o Editor Visual.
  • Edição em computador.
  • Telas com mais de 1200px para o modo paisagem (layout horizontal). Essa é a largura padrão para ajustar todos os elementos da página sem ser confusa. A largura mínima pode mudar. No modo retrato (layout horizontal), isso estará disponível por padrão.

Pesquisa de dados

Estamos trabalhando para responder às seguintes perguntas, que ajudarão a aprofundar nossa compreensão do problema:

  • Quantos editores visualizam suas alterações?
    • A visualização das alterações leva a menos reversões?
  • Quantos editores usam telas do tamanho sugerido para editar nas wikis?
  • O layout vertical faz sentido ser padronizado?

Por que e como aceitamos esse desejo?

Community Tech Wishes Prioritization Score.png

Esse desejo teve uma pontuação elevada em nosso processo de priorização para 2021. Foi muito popular em termos de número de votos, impactante em termos de benefício para a comunidade e teve uma estimativa de complexidade relativamente baixa. Leia sobre nosso processo completo aqui.

Release Timeline

Release Timeline
Item Status Actual Date Target Date Notes
Deploy to test wiki for user testing purposes Complete 2022-03-30 2022-03-30
Enable on Beta cluster – Beta English Wikipedia and Wikisource only, since Realtime Preview changes the UI slightly for everyone even when you don't have it turned on Complete 2022-03-30 2022-03-30
Merge MVP for QA to Review Complete 2022-04-26 2022-04-08
Confirm MVP Top Priority tasks merged and QAd Complete 2022-04-26 2022-04-08
Get a final greenlight from Design QA In Progress 2022-04-15
Train w work deployed to Polish Wiki Complete 2022-04-26 2022-04-27 Designer to schedule user video calls to observe users and design accordingly
First pilot wiki as an opt-out beta feature: plwiki Complete 2022-04-26 2022-04-27
Announcement on project page & any tool-specific pages Not Started 2022-04-30
Pilot wikis as an opt-out beta feature: huwiki, cawiki, viwiki, fawiki, fiwiki Not Started
Get greenlight from Performance Review In Progress 2022-05-24
Announcement on project page & any tool-specific pages Not Started
Announcement in #release-announcements Slack channel Not Started
Bugs identified and cut Not Started Should happen as soon as we release to the first wiki
Bugs triaged Not Started Should happen as soon as we release to the first wiki
Announcement in Tech/News Not Started To be done when releasing to all wikis
Release to group 0 and group 1 as opt-in Beta Not Started Target: October or later
Bigger pilot wikis as opt-in Beta Not Started Target: October or later
All wikis as opt-in Beta Not Started Target: October or later
Graduate Beta Feature to Feature for All Not Started

Atualizações

May 3, 2022: Launching to partner projects

We have launched a version of the Realtime preview feature to Polish Wikipedia. Its community has agreed to partner with us and give us feedback on how to improve it before we launch to the rest of the users. Please find our complete Release Plan.

This feature touches one of the most used editors (Wikitext 2010) across wiki projects. We've thus decided to roll it out as a Beta Feature before we release the feature to everyone. This will allow us to collect feedback and make improvements before we release to everyone.

We are partnering with users early on to understand behavior on the new tool and make improvements. Depending on the user’s connection, we are aiming to observe and evaluate patterns regarding the automatic and manual reloads of the preview pane, as follows:

  • Automatic reload: Debounce time. When the preview pane is automatically reloading, is our debounce time sufficient to provide a fluid experience?
  • Automatic reload: Discoverability of the manual reload button. When the preview pane is automatically reloading, is the manual reload button that appears while hovering over the preview pane easy to find?

and/or

  • Manual reload: Discoverability/Display time of the manual reload status bar.

When the preview pane is NOT reloading automatically, the user will see a status bar inviting them to manually reload. Is the discoverability of the bar sufficient? Is the status bar obstructive to the users’ workflows?

We will aim to observe both of these scenarios for users with stable high-speed internet connections. In both cases, we will be performing the test on two pages: one short article without images (for faster reload time) and another one with a large content and multimedia assets (for slower reload time).

Aside from our main investigation, we will also be observing the following during our screen-sharing sessions with users:

  • Discoverability of the overall feature: although users will be notified of the existence of the realtime preview feature, and the potential relationship between the latter and the "Show preview" feature.
  • User screen sizes- This data could be helpful to understand how useful the Realtime Preview is for folks with a smaller screen. Does this make their experience too crowded?
  • Usage of syntax highlighting/Code Mirror
  • Understanding that both panes do not have a synced scrolling behavior.

If you would like to give us any feedback on any of the open questions above, please reach out to us in the talk page as we are eager to hear about the usability of this new feature. Thanks for building with us!

November 2, 2021: Findings from user testing of designs

Hello everyone,

Many thanks for your support and great feedback on the proposed designs. Thank you for comments on the talk page, as well as the latest "Talk to Us" video call. We have learned more about how experienced users edit.

Also, we have conducted usability testing on the usertesting.com platform. 5 editors took part. Below you will find some of the findings and insights:

  • Half of the users found the new "Preview" button in the toolbar. One of the reasons for this could be behavioral patterns developed over the existing "Show preview" button in the footer of the editor box. We are designing a low-friction pulsating dot with a guide popup. We hope this will make it easier to notice the new feature.
  • All users found the existing "show preview" button.
  • All users understood the difference between both buttons. One could be used while editing (offering a quick glimpse at the output). The other could be more helpful for proofreading before publishing the changes.
  • One user reported that it might always be easy to understand the relationship between the Wikitext input and the preview output. To mitigate this, we are exploring ways to highlight the text in both panes and align the scrolling or editing behavior.

Acknowledgments:

  • Not all of these editors are experienced users. Although this wish is intended to be helpful for every user – we assume that less experienced editors will tend to use the Visual Editor over the wikitext editor. This will make the new feature less relevant for them.
  • We are also working on improving the scaling of both panes. We want to allow for optimal support to both small and ultra-wide displays alike.

Again, thanks so much for your feedback!

14 de setembro de 2021: Próximas etapas sobre o design

Obrigado pelo seu comentário

Olá a todos, estamos de volta com uma atualização dos designs propostos para este desejo. Obrigado por todos os seus comentários na página de discussão. Ouvimos o que você disse e sintetizamos o feedback da seguinte maneira:

  • O botão para visualizar o resultado do wikitexto deve ser mais intuitivo, a pessoa que clica nele deve saber o que ele faz.
  • O botão para visualizar o texto deve estar na barra de ferramentas.

Em seguida, fizemos uma segunda tentativa de criar o seguinte conjunto de designs. Estamos propondo que um novo botão apareça na barra de ferramentas:

RTpreview-legacy-vertical-untoggled.png

Estamos propondo que, quando o usuário visualizar o conteúdo, o botão de visualização permanecerá "azul" para indicar que o estado de visualização está ativado:

RTpreview-legacy-vertical-toggled.png

O botão de visualização voltaria a ficar preto se os usuários clicarem e a visualização desapareceria.

Horizontal vs Vertical

Observe que esses projetos propostos são ilustrativos. Incluímos apenas uma versão vertical porque estamos investigando se a capacidade de ter uma tela ampla ainda será uma opção, dado o trabalho planejado nas melhorias na área de trabalho, que limitará as páginas em 960px de largura, tornando assim muito confuso a visualização.

Perguntas abertas: Queremos ouvir você!

  • O novo posicionamento do botão parece mais intuitivo para os trabalhos na barra de ferramentas?
  • No layout proposto atual há espaço suficiente para visualizar o wikitexto e o resultado final?

Muito obrigado por seus comentários na página de discussão!

27 de agosto de 2021: Feedback inicial do projeto

Designs propostos

Layout horizontal no computador

Um novo botão aparecerá. Isso dá aos editores a opção de visualizar o texto na lateral em tempo real:

Live Preview-collapsed-horizontal annotated.png

Observação: a caixa rosa acima é apenas para chamar a atenção para o botão, ela não aparecerá para os usuários.

Os editores poderão clicar no botão destacado acima. Se eles fizerem isso, o layout a seguir permitirá que eles visualizem o resultado em um contêiner fixo rolável:

Live Preview-expanded-horizontal.png

Layout vertical no computador

O novo elemento de interface do usuário a seguir aparecerá quando um usuário tiver uma tela vertical:

Live Preview-collapsed-vertical annotated.png

Observação: a caixa rosa acima é apenas para chamar a atenção para o botão, ela não aparecerá para os usuários.

Os editores poderão clicar no botão destacado acima. Se eles fizerem isso, o layout a seguir permitirá que eles visualizem o resultado em um contêiner fixo rolável:

Live Preview-expanded-vertical.png

Os engenheiros começaram a trabalhar nessas mudanças. Estamos introduzindo as mudanças dentro do núcleo do MediaWiki. Adoraríamos ouvir sua opinião sobre nossos designs propostos. Gostaríamos especialmente de receber feedback sobre:

  • Tornando a colocação de cópias e botões intuitiva
  • A sensação geral dos designs propostos

Estamos ansiosos para ouvir sua opinião sobre nossos designs propostos e quaisquer outras considerações!

Perguntas abertas: Queremos ouvir você!

As soluções acima são propostas e em estágios iniciais. Adoraríamos ouvir seus comentários na página de discussão. Sua visão pode nos ajudar a entender outras abordagens, riscos e soluções.

Estas são as nossas perguntas para você:

  • Como você acha que isso influenciará a maneira como você edita?
  • O ícone no botão de expansão prepara os editores para entender o que ele faz? É perturbador?


Links relevantes