Umfrage zur Community-Wunschliste 2021/Echtzeitvorschau für den Wikitext-Editor

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 72% complete.
Outdated translations are marked like this.

Halle allesamt, und danke dafür, dass Ihr hier hergekommen seid um mehr über die Echtzeitvorschau zu erfahren. Dieser Wunsch war #4 im Community Wishlist Survey 2021 Dieser Artikel soll unseren Ansatz eine Lösung zu entwickeln darstellen. Wir bitten Euch um Euer Feedback und Einsichten, damit wir die bestmögliche Verbesserung entwickeln können.

Zusammenfassung der Ziele des Wunsches: Erlaube es den Wikiautor*innen, die Formatierungen beim Schreiben in Echtzeit zu sehen.

Originaltext

Hintergrund & Problemschilderung

HINWEIS: Um Verwirrung zu vermeiden haben wir den Wunsch von Live-Vorschau nach Echtzeitvorschau umbenannt. Dies geschah, weil es bereits ein Feature mit dem Namen Live Preview (Live-Vorschau) gibt.

Wikitext ist eine Wiki-Auszeichnungssprache. Sie wird von vielen Autor*innen benutzt um in den Wikis zu formatieren. Sie sieht anders aus als das, was die Leser*innen sehen. Bei der Arbeit mit Wikitext kann es schwer sein, sich vorzustellen, wie das Endergebnis aussehen wird. Deshalb benutzen viele AutorInnen die Vorschaufunktion vor der Veröffentlichung einer Änderung. Das bedeutet allerdings einen extra Schritt, getrennt vom Schreiben des Wikitextes.

Im Großen und Ganzen können wir das Problem der Originalwunsches wie folgt zusammenfassen:

Wie stellen AutorInnen sicher, das die Änderungen, die sie vornehmen, das gewünschte Ergebnis haben?

Aus Produktentwicklungssicht kann die Ermöglichung der Echtzeitansicht der Auszeichnungen folgendes bedeuten:

  • Verbesserung der Erfahrungen als Autor durch Reduktion der Schritte (Klicks) während des Prozesses des Schreibens.
  • Es den Autor*innen erlauben, Tippfehler und fehlerhafte Syntax sofort zu erkennen und somit die Qualität der Wikis zu verbessern.

Vorgeschlagene Lösungen

Anforderungen an das Design

Im Folgenden wird eine Reihe von Design-Anforderungen aufgeführt, die es Autor*innen ermöglichen, eine Vorschau ihrer Inhalte anzuzeigen.

Als Nutzer, der mit einem Bildschirm in Desktop-Größe Wikitexte bearbeitet, kann ich:

  • Eine Option wählen, um eine Vorschau des ausgegebenen Wikitextes anzuzeigen
  • Durch die Vorschau scrollen, sodass ich ganz leicht die Vorschau für Elemente anzeigen kann ohne dass der ganze Bildschirm davon eingenommen wird

Wichtige Einschränkungen

Die Echtzeit-Vorschau-Schaltfläche wird verfügbar sein für/auf:

  • Bearbeitungswerkzeuge, die auf Wikitext beruhen. Wir werden nicht den Visuellen Editor verändern.
  • Bearbeitung am Desktop-PC
  • Bildschirm mit mehr als 1200 px im Querformat (horizontales Layout). Das ist die Standardbreite, um alle Seitenelemente unterzubringen ohne ein Durcheinander zu verursachen. Die minimale Breite kann schwanken. Im Hochformat (horizontales Layout) wird dies standardmäßig verfügbar sein.

Datenermittlungen

Wir arbeiten mit Hochdruck daran, die folgenden Fragen zu beantworten, die dabei helfen werden, unser Verständnis des Problems zu vertiefen:

  • Wie viele Autor*innen benutzen die Vorschau für ihre Änderungen?
    • Führt die Vorschau von Änderungen zu weniger Rücksetzungen?
  • Wie viele Autor*innen benutzen Bildschirme in Desktop-Größe, um Bearbeitungen auf den Wikis vorzunehmen?
  • Ist es sinnvoll, das Hochformat zum Standard zu machen?

Warum und wie haben wir diesen Wunsch angenommen?

Community Tech Wishes Prioritization Score.png

Dieser Wunsch schnitt bei unserem Priorisierungsablauf 2021 sehr gut ab. Er war sehr beliebt in Bezug auf die Anzahl der Stimmen, einflussreich in Bezug auf den Nutzen für die Gemeinschaft und hatte schätzungsweise eine relativ niedrige Komplexität. Bitte informiert euch hier zum gesamten Ablauf.

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 2022-05-24
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


Status-Updates

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. September 2021: Weitere Schritte zum Design

Danke für euer Feedback

Hallo an alle, wir sind wieder da mit einem Update zu den vorgeschlagenen Designs für diesen Wunsch. Danke an alle, die auf der Diskussionsseite kommentiert haben. Wir haben es uns zu Herzen genommen und das Feedback wie folgt umgesetzt:

  • Die Schaltfläche für die Vorschau der Wikitext-Ausgabe sollte intuitiver sein. Die Person, die sie anklickt, sollte ihre Funktion kennen.
  • Die Schaltfläche zur Vorschau des Textes sollte sich in der Werkzeugleiste befinden.

Wir haben dann einen zweiten Versuch unternommen, das folgende Set an Designs zu erstellen. Wir schlagen eine neue Schaltfläche vor, die in der Werkzeugleiste erscheint:

RTpreview-legacy-vertical-untoggled.png

Wir schlagen vor, dass die Vorschau-Schaltfläche "blau" bleibt, wenn der Nutzer eine Vorschau der Inhalte anzeigen lässt, um zu signalisieren, dass die Vorschau gerade aktiviert ist:

RTpreview-legacy-vertical-toggled.png

Die Vorschau-Schaltfläche würde wieder schwarz werden, wenn Nutzer sie auf Aus stellen und die Vorschau würde verschwinden.

Horizontal vs Vertikal

Bitte beachtet, dass diese Designvorschläge nur der Veranschaulichung dienen. Wir haben nur eine vertikale Version berücksichtigt, weil wir momentan prüfen, ob die Möglichkeit, einen Widescreen zu haben, weiterhin eine Option bleibt, im Hinblick auf die geplanten Web Desktop Verbesserungen, die die Seite auf 960px in der Breite beschränken würden und eine horizontale Ansicht zu unübersichtlich machen würden.

Offene Fragen: Wir wollen von euch hören!

  • Wirkt die Platzierung der neuen Schaltfläche intuitiver zu den Workflows in der Werkzeugleiste?
  • Scheint es bei dem vorgeschlagenen Layout genug Platz zu geben, um sowohl den Wikitext als auch die Ausgabe anzuzeigen?

Ein großes Dankeschön für euer ständiges Feedback auf der Diskussionsseite!

27. August 2021: Erstes Feedback zum Design

Designvorschläge

Horizontales Desktop-Layout

Eine neue Schaltfläche wird erscheinen. Das gibt Autor*innen die Möglichkeit, eine Vorschau des Texts an der Seite in Echtzeit anzuzeigen:

Live Preview-collapsed-horizontal annotated.png

Hinweis: Der pinke Rahmen oben soll lediglich auf die Schaltfläche aufmerksam machen und wird für die Nutzer nicht sichtbar sein.

Autor*innen werden die oben markierte Schaltfläche anklicken können. Wird das gemacht, würde das folgende Layout eine Option zum Anzeigen einer Vorschau der Ausgabe in einer scrollbaren festen Umgebung geben:

Live Preview-expanded-horizontal.png

Vertikales Desktop-Layout

Das folgende neue Benutzeroberflächen-Element für Nutzer wird erscheinen, wenn ein Nutzer einen vertikalen Desktop-Bildschirm verwendet:

Live Preview-collapsed-vertical annotated.png

Hinweis: Der pinke Rahmen oben soll lediglich auf die Schaltfläche aufmerksam machen und wird für die Nutzer nicht sichtbar sein.

Autor*innen werden die oben markierte Schaltfläche anklicken können. Wird das gemacht, würde das folgende Layout eine Option zum Anzeigen einer Vorschau der Ausgabe in einer scrollbaren festen Umgebung geben:

Live Preview-expanded-vertical.png

Die Ingenieure haben bereits mit der Arbeit an diesen Änderungen begonnen. Wir führen die Änderungen innerhalb des MediaWiki-Kerns durch. Wir würden uns sehr freuen, wenn ihr eure Meinung zu unseren Designvorschlägen mit uns teilen könntet. Wir freuen uns besonder über Feedback zu:

  • Kopie und Schaltflächen-Platzierungen intuitiver gestalten
  • Der Gesamteindruck zu den vorgeschlagenen Designs

Wir erwarten mit Spannung eure Gedanken zu unseren Designvorschlägen und anderen Ideen!

Offene Fragen: Wir wollen von euch hören!

Die obigen Lösungen sind Vorschläge und stecken noch in einer frühen Phase. Wir freuen uns über euer Feedback auf der Diskussionsseite. Eure Meinung kann uns dabei helfen, andere Ansätze, Risiken und Lösungen besser zu verstehen.

Hier sind unsere Fragen an euch:

  • Wie wird die Änderung wohl euer Bearbeitungsverhalten beeinflussen?
  • Macht das Symbol auf der Erweitern-Schaltfläche die Funktion nachvollziehbar? Stört es eher?


Relevante Links