Replace onboarding video with animation#778
Merged
microbit-grace merged 36 commits intobetafrom Mar 12, 2026
Merged
Conversation
|
Preview build will be at |
- Unify timings to avoid magic numbers - Tidy
- Improve color contrast - Arrow placement around the pills
|
Should we start paused for prefers-reduced-motion folks? Would need to take care to skip to content not e.g. white screen pre fade in. |
microbit-grace
commented
Mar 12, 2026
Author
microbit-grace
left a comment
There was a problem hiding this comment.
Should we start paused for prefers-reduced-motion folks? Would need to take care to skip to content not e.g. white screen pre fade in.
That makes sense, working on it...
Author
microbit-matt-hillsdon
approved these changes
Mar 12, 2026
microbit-matt-hillsdon
left a comment
There was a problem hiding this comment.
Looking great.
My framer-motion experiment didn't result in meaningful improvement.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
New animation layout introduced for portrait mobile / narrower screen sizes.
Accessibility-wise, the role is set as img (similar to a GIF). It requires alt text, a pause and resume button (see https://www.w3.org/WAI/WCAG21/Understanding/pause-stop-hide.html). I also tried setting the role as video using a visually hidden component, but the voice over seems to skip the alt text provided and read "Unable to play media", presumably because it's not an actual playable video. Descriptive transcript is not required because the role is img, not video.