👉This task is not a blocker to get started with the implementation of V4. Transitions are defined in T240196.
Why are we doing this?
Suggested edits V4 is currently in the making and is scheduled to be released in the beginning of 2020 (FY FY 19/20). This week, we’re going to perform usability tests in order to improve the suggested user flow (Link to V4 prototype).
The suggested user flow that’s going to be tested in usability testing:
 |  |  |  |  |  |  |
This task focuses on the aspect of loading and publishing tags to images:
| |
Joy of use, clarity and gratification after publishing image tags are limited in the prototype.
What do we need?
A) We would like to explore ways to make the experience of adding tags to images more satisfying and confirming. Usage of animation / illustration helps in accomplishing this.
The phases when publishing image tags:
- Loading indication when tags are being published (indefinite), e.g. tags that are being added to the onboarding illustration as an animation loop.
- Animated success illustration when tags are published (not a loop). Constraint: “Tags published“ is added below the illustration/animation.
- Transition to the next suggestion in the feed, e.g. how should it feel like? Should it switch instantly or timed, a prototype transition to the next image can be helpful here.
B) Another area to explore for this is sound. Could usage of sound/some kind of jingle help to in emphasizing that tags have been published. Also it contributes to satisfaction when tags have been published.
C) Bonus: Explore if onboarding screen could profit from a subtle animation to communicate what the feature is about as well, e.g. a variation of the illustration in A1 with tags that turn into blue.
Guidelines to create illustrations / animations and useful links related to Suggested edits
- 👉Sketch source and font files to get started 👈
- Wikimedia illustration guidelines
- Wikipedia Android theme guidelines
- Google Material Design
- Wikimedia Design Style Guide
- Suggested edits FAQ
- Wikipedia Android on Zeplin
- Suggested edits V4 prototype (made with Anima, a Sketch plugins)
- https://shapeshifter.design/ - web app for creating animated vector drawables
