skills.rest
masermediagroup-stack
masermediagroup-stackCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

managing-media

Implement media upload, gallery, player, and viewer components for web apps.

1|Updated Apr 8, 2026
Search Tags:#accessibility#video#media#audio#upload#gallery#pdf-viewer
One-click install
npx skills add https://github.com/masermediagroup-stack/CursorSkills --skill managing-media-masermediagroup-stack
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: managing-media
Source: https://github.com/masermediagroup-stack/CursorSkills/tree/main/skills-bundle/skills/community/ai-design-components/skills/managing-media
Command: npx skills add https://github.com/masermediagroup-stack/CursorSkills --skill managing-media-masermediagroup-stack

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires Pillow, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This skill provides a repeatable, scalable pattern for implementing media and file management components (uploads, galleries, players, viewers) across web apps, reducing boilerplate and ensuring consistency.

Core Features & Use Cases

  • File upload patterns: basic drag-and-drop, multi-file, resumable uploads.
  • Media display patterns: image galleries, lightboxes, carousels, video and audio players, PDF/document viewers.
  • Performance and accessibility: lazy loading, responsive images, captions, transcripts, ARIA roles, and CDN/cloud storage integration.
  • Use Case: Build a media-centric app that supports user uploads, gallery browsing, and embedded media with accessible controls.

Quick Start

Create or import a media management UI by adopting the managing-media patterns and reference implementations provided in the Skill, then plug in your data sources.

Frequently Asked Questions about managing-media

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I implement drag-and-drop file uploads with resumable chunked transfers in a web app?▼

Implement drag-and-drop file uploads with resumable chunked transfers by adopting the managing-media patterns, which support multi-file handling, chunked uploads, and cloud storage integration to reduce boilerplate. The skill provides reusable reference implementations for these upload workflows.

What is the best way to build an accessible image gallery with lazy loading and lightbox support?▼

The best way to build an accessible image gallery with lazy loading and lightbox support is using the media management patterns from this skill, which include responsive images, captions, ARIA roles, and design-token theming. These components ensure consistent structure and accessibility compliance.

How do I add a video and audio player with captions and transcripts to my application?▼

Add video and audio players with captions and transcripts by applying the media display patterns provided in this skill, which support embedded media playback with built-in accessibility controls. The reference implementations cover player structure and ARIA compliance.

Does this media management skill include a PDF viewer component for document display?▼

Yes, this media management skill includes a PDF viewer component for document display alongside its other media handling patterns. The skill provides reference implementations for PDF and document viewers with accessibility support.

Can I use these media components with cloud storage and CDN integration?▼

Yes, you can use these media components with cloud storage and CDN integration, as the skill explicitly supports cloud storage integration for file uploads and media display. This allows scalable media delivery across web applications.

Do I need Pillow installed to use the media management patterns?▼

Yes, you need Pillow installed as a dependency to use the media management patterns, as it is the only required external dependency. The skill leverages Pillow for image processing capabilities within its upload and gallery components.

Related Skills

Explore More Software Engineering Skills→
ThibautBaissacThibautBaissac
643

active-storage-setup

Configure Active Storage services, image variants, and direct uploads in Rails apps.

Community
Intermediate
skills-ilskills-il
9

cloudinary-assets

Manages digital media assets via Cloudinary's REST API, including upload, transform, optimize, and delivery of images/videos.

Official
Intermediate
davidrrowleydavidrrowley

frontend-design-review

Review frontend interfaces for design quality and WCAG accessibility compliance.

Community
Intermediate
SpiralCloudOmegaSpiralCloudOmega
1

juce-look-and-feel

Customize JUCE audio plugin UI with reusable LookAndFeel for rotary and linear sliders.

Community
Advanced