Cineo · Onboarding — Anywhere
Cineo · Onboarding — Anywhere is a production-ready Streaming Flutter screen from FlutterKit Pro, installable with flutterkit add stream-onboarding-intro-2.
The second slide in Cineo's onboarding walkthrough, built to sell the "watch anywhere" promise. A top-right Skip TextButton sits above an Expanded, centered illustration zone rendered entirely by the _DevicesPainter CustomPainter: a radial brand-red glow behind a staged multi-device cluster of a back TV (with stand), a front-left tablet and a front-right phone, each drawn as a bezelled device body framing a seeded poster gradient with faux caption bars, and the phone carrying a white play-circle with a brand-red triangle. Below, a left-aligned block pairs an 800-weight 30px headline ("Watch anywhere, on any screen") with a muted-grey blurb about picking up where you left off across phone, tablet, laptop and TV. A bottom row places the _DotsPainter page indicator (index 1 of 3, active dot elongating into a brand-red pill) opposite a 62px circular _NextButton with a red-to-dark-red gradient and a forward arrow. The palette is a near-black 0xFF0B0B0F background, Netflix-style brand red 0xFFE50914, white and muted 0xFFA1A1AA text, all under a forced ThemeData.dark. It is self-contained pure Flutter — bundled Inter font, its own dark theme, SafeArea, no network images, every graphic painted — and backend-agnostic, wired through injected onNext and onSkip callbacks so it drops into any streaming onboarding flow.
Reveal the one-line command to drop this screen into your project.
Licensed for unlimited commercial projects · resale prohibited · License
What's included
- ✓_DevicesPainter CustomPainter that draws the TV-plus-stand, tablet and phone cluster over a radial brand-red glow with zero raster assets
- ✓A _drawScreen helper rendering bezelled device bodies, seeded poster gradients, faux caption bars, and an optional white play-circle with a red triangle
- ✓_DotsPainter three-dot page indicator whose active index elongates into a brand-red pill
- ✓_NextButton — a 62px circular FAB with a red-to-dark-red gradient and forward arrow, InkWell-tapped through onNext
- ✓Injected onNext and onSkip VoidCallback hooks plus a top-right Skip TextButton, keeping the slide backend-agnostic
- ✓Self-contained dark theme: bundled Inter font, 0xFF0B0B0F background, brand red 0xFFE50914, SafeArea and a responsive AspectRatio art frame
Use cases
- ✓Second step of a streaming app's first-run onboarding carousel highlighting multi-device playback
- ✓Marketing the resume-across-devices feature in a Netflix-style movies and TV product tour
- ✓A reusable onboarding slide template teams re-skin for other cross-platform media apps
- ✓Feature-education overlay shown after sign-up to promote watching on phone, tablet and TV
