Background
As users are writing alt text, they should be able to review relevant image information by visiting the image's page on Wikimedia Commons. We also want to movivate users to keep alt text short, under 125 characters. They should be able to find and open guidance on how to write good alt text while completing the task.
In this first task, we built the MTV version of the add alt text modal sheet: T370232. This task adds the final elements to the alt text sheet.
Requirements
- "Next" button is not active until user has added input into "Describe the image"
- Input box does not allow line breaks
- Embed all content in half sheet modal within scroll view
- Add image thumbnail
- Add image filename
- Character counter below the input box starts at 0/125 and automatically updates as user types text
- Show warning message in standard format if what the user has typed exceeds 125 characters.
- "Next" is still active, and users can still publish with over 125 characters
- Add link for "Guidance for writing alt text"
- Typed text is retained if user navigates away to Guidance, image information, etc and then back
- Relevant events are instrumented according to Data instrumentation plan and completed slides have been marked with a green background
- Translations are added for target languages from UI Copy for Suggested edits Alt text on iOS (T370725)
Nice to have:
- Input box does not allow pasting into it (to avoid users copy/pasting the caption)
Design:
Add alt text sheet | Commons img details | Active text field | Warning for exceeding 125 characters |