Undersökning: Gemenskapens önskelista 2021/Förhandsgranskningar i realtid för Wikitext
This page documents a project the Wikimedia Foundation's Community Tech team has worked on or declined in the past. Technical work on this project is complete.
We invite you to join the discussion on the talk page.
Realtime Preview for Wikitext Wish Team  | |
|---|---|
| Allow 2010 wikitext editors to preview the page while editing | |
| Grupp: | Community Tech |
| Medlemmar: | Nicolas Ayoub, Harumi Monroy, MusikAnimal, Emanuele Leoni, Sam Wilson, Szymon Grabarczuk |
| Ledare: | Natalia Rodriguez (product owner) |
| Uppdateringar: | Updates |
Hej allesammans, och tack för att ni kommit för att läsa mer om förhandsgranskningar i realtid. Detta var den #4 önskningen i Gemenskapens önskelista 2021. Den här artikeln kommer beskriva vårt tillvägagångssätt för att bygga en lösning på önskningen. Vi ber er om er återkoppling och synpunkter så att vi kan göra den bästa möjliga föräbttringen.
Sammanfattning av målsättningen med önskningen: Möjliggöra för användare att använda 2010 års wikitextredigerare för att förhandsgranska sidan i realtid samtidigt som man redigerar.
Bakgrund och problembeskrivning
OBS: för att undvika sammanblandning har vi bytt namn på önskningen och projektet från Live förhandsgranskningar till Förhandsgranskningar i realtid. Detta gör vi för att det redan finns en annan funktion som Live förhandsgranskningar.
Wikitext är ett språk för wikimarkering. Det används av många användare för formatering på wikier. Det skiljer sig från hur vad läsarna ser. När man arbetar med wikitext kan det vara svårt att veta hur den färdiga resultatet kommer se ut. På grund av detta använder många användare förhandsgranskningsfunktionaliteten innan man publicerar sin ändring. Detta kräver dock ett extra steg utöver själva skrivarprocessen.
På en hög nivå kan vi sammanfatta problemet i ursprungsönskningen som följande:
Hur kan redigerare försäkra sig om att ändringarna de skapar uppnår önskar resultat?
From a product standpoint, allowing editors to view the markup output in realtime could:
- förbättra redigeringsupplevelsen genom att minska antalet extra steg (klick) i redigeringsresan
- låta redigerare hitta stavfel, rätta trasig wikitext och omedelbart åtgärda dem och på så sätt upprätthålla wikiernas kvalitet
Föreslagna lösningar
Designkrav
Följande är en uppsättning designkrav som skulle kunna erbjuda redigerare ett sätt att förhandsgranska sitt innehåll.
Som en användare som redigerar i wikitext med en skrivbordstor skärm kan jag:
- ha möjligheten att förhandsgranska resultatet från wikitexten
- göra förhandsgranskningens resultat skrollbar så jag lätt kan granska element av resultatet utan att det ska behöva ta upp hela skärmen
Omfattning och begränsningar
Knappen för förhandsgranskningar kommer vara tillgänglig på:
- wikitextbaserade redigeringsverktyg. Vi kommer inte ändra Visual Editor.
- Stationär redigering.
- Skärmar bredare än 1200 px för landskapsläge (horisontell layout). Det är standardbredd för att få plats med alla element på sidan utan att den blir allt för plottrig. Denn minsta tillåtna bredden kan komma att ändras. I porträttläge (vertikal layout), kommer detta vara förinställt.
Dataundersökningar
Vi arbetar på att besvara följande frågor som ska hjälpa oss fördjupa vår förståelse av problemet:
- Hur många redigerare förhandsgranskar sina ändringar?
- Leder förhandsgranskningar till färre återställningar?
- Hur många redigerare använder skrivbordstora skärmar för att redigera på wikierna?
- Känns det logiskt att ha den vertikala layouten som standard?
Varför och hur accepterade vi den här önskningen?
Denna önskningen fick höga betyg i vår prioriteringsprocess 2021. Den var väldigt populär i antalet röster, inflytelserik i talan om gemenskapsnytta och hade en relativt låg uppskattad komplexitet. Läs mer om vår fullständiga process här.
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 | Complete | 2022-05-19 | 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 | Complete | 2022-08-17 | 2022-04-30 | |
| Pilot wikis as an opt-in beta feature: huwiki, fiwiki | Complete | 2022-05-26 | 2022-05-24 | |
| Pilot wikis with Vector-2022, as an opt-in beta feature: cawiki, viwiki, fawiki | Complete | 2022-06-14 | 2022-06-14 | After phab:T307725 is complete |
| Get greenlight from Performance Review | Complete | 2022-10-17 | 2022-05-24 | |
| Announcement in WMF internal #release-announcements Slack channel | Not Started | |||
| Bugs identified and cut | In Progress | Should happen as soon as we release to the first wiki | ||
| Bugs triaged | In Progress | Should happen as soon as we release to the first wiki | ||
| Announcement in Tech/News | Complete | To be done when releasing to all wikis: | ||
| Release to group 0 as opt-in Beta (T314150) | Complete | 2022-08-02 | 2022-08-02 | |
| Release to group 1 as opt-in Beta (T314182) | Complete | 2022-08-23 | 2022-08-17 | |
| All wikis as opt-in Beta | Complete | 2022-08-31 | 2022-08-31 | |
| Graduate Beta Feature to feature for all | Complete | 2023-01-12 | 2023-01-09 |
Status uppdateringar
Aug 17, 2022: Available as an opt-in beta feature for most wikis
After gathering feedback from the pilot wikis (cawiki, viwiki, fawiki, plwiki, huwiki, and fiwiki – thank you all!) we have released this feature to group 0 and group 1 as an opt-in beta feature. We plan to release to group 2 this August 31st as an opt-in beta feature. We plan to let it sit behind the Beta feature tab for 6-8 weeks, listening to feedback and improving the feature if any bugs arise. After that time window, we plan on graduating it from a beta feature to a feature for all 2010 Wikitext Editor users. To enable this feature from inside your beta preferences, be sure that the Realtime feature is enabled, and that the New Wikitext mode is disabled.
We would love to hear about how you enjoy using this tool and any other feedback from all of you in the Talk page!
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!
September 14, 2021: Next steps about the design
Thank you for your feedback
Hello all, we are back with an update on the proposed designs for this wish. Thanks for all of your comments on the talk page. We heard what you said and synthesized the feedback as follows:
- The button to preview the wikitext output should be more intuitive, the person clicking it should know what it does.
- The button to preview the text should be in the toolbar.
We then took a second try at creating the following set of designs. We are proposing a new button appears in the toolbar:
We are proposing than when user previews the content, the preview button label remains "blue" to indicate that the preview state is on, and activated:
The preview button would turn back to black if users toggle it off and the preview would disappear.
Horizontal vs Vertical
Please note that these proposed designs are illustrative. We only included a vertical version because we are currently investigating if the ability to have a wide screen will still be an option given the planned and upcoming work on Web desktop improvements which would limit the page to 960px in width, making it too cluttered to have a horizontal view.
Open Questions: We want to hear from you!
- Does the new button placement seem more intuitive to the workflows in the toolbar?
- Does the current proposed layout feel like there is enough space to view both the wikitext and the output?
Thanks so much for your continued feedback on the talk page!
August 27, 2021: Initial Design Feedback
Proposed Designs
Horizontal Desktop Layout
A new button will appear. This gives editors the option to preview the text on the side in real-time:
Note: The pink box above is just to draw attention to the button, it will not actually appear to users.
Editors will be able to click on the button highlighted above. If they do that, the following layout would allow them to preview the output in a scrollable fixed container:
Vertical Desktop Layout
The following new user interface element will appear when a user has a vertical desktop screen:
Note: The pink box above is just to draw attention to the button, it will not actually appear to users.
Editors will be able to click on the button highlighted above. If they do that, the following layout would allow them to preview the output in a scrollable fixed container:
The engineers have begun work on these changes. We are introducing the changes inside of MediaWiki core. We'd love to hear your thoughts on our proposed designs. We'd especially love feedback on:
- Making the copy and button placements intuitive
- The overall feel of the proposed designs
We're looking forward to hearing your thoughts on our proposed designs and any other considerations!
Open Questions: We want to hear from you!
The solutions above are proposed and in early stages. We'd love to hear your feedback on the talk page. Your insight can help us understand other approaches, risks, and solutions.
These are our questions to you:
- How do you think this will influence the way you edit?
- Does the icon on the expand button prepare the editors to understand what it does? Is it distrupting?
Relevanta länkar
- Live förhandsgranskning (INTE det vi håller på med)
- Ursprunglig önskan
- Wikitext