My Profile Tutorial Storyboard
Format: 1920x1080 landscape Duration: 42 seconds Design source: root DESIGN.md
| Time | Beat | Visual Direction | Motion |
|---|---|---|---|
| 0.0-8.8 | Tutorial goal | Dark command-surface frame, source route, usage note, and Playwright feature screenshot | Elements enter in staggered order; hero frame gets a subtle scale push |
| 8.8-9.3 | Transition | Amber cue-light wipe | CSS transition panel covers the outgoing scene before the next scene appears |
| 9.3-19.4 | Primary workflow | Three operational steps drawn directly from the feature page | Cards enter from varied directions, no jump cuts |
| 19.4-19.9 | Transition | Amber cue-light wipe | Same primary transition for consistency |
| 19.9-30.0 | Result check | Three checks the viewer can perform after the task | Cards build from the completed task outward |
| 30.0-30.5 | Transition | Amber cue-light wipe | Topic reset into usage guidance |
| 30.5-42.0 | Usage boundary | Usage caveat plus quick reference rows | Quick reference enters last; final scene fades down only at the end |
Source Facts
- Promise: Update your personal profile, upload a headshot, and save optional cast measurement details when your project role includes them.
- Workflow framing: Update your profile and save it Open the modal from your avatar, make the edits, and save before closing.
- Result-check framing: Confirm where the profile update appears After saving, check the places that depend on your profile so you know the update synced.
- Status: Profile details may be visible to production staff according to project permissions.
- Usage guidance: Closing without saving discards edits Profile data can be visible to production staff. Save intentionally, collect only the details the production needs, and do not assume unsaved modal changes persist.