{"id":"4d033b42-7348-4a45-a320-f1c8c5a867d7","shortId":"2HJruR","kind":"skill","title":"media-asset-management","tagline":"Plan and run a media pipeline for images, video, and downloadable assets. Use this skill when designing image storage and delivery, choosing formats (WebP, AVIF), setting up responsive images, picking a video host, organizing a brand asset library, or auditing a slow image pipeli","description":"# Media Asset Management\n\nDesign how images, video, and downloadable files get stored, processed, organized, and served. Stack-agnostic. The principles apply whether you're running a custom pipeline or using a hosted service.\n\n---\n\n## When to use\n\n- Designing or redesigning the image and media pipeline\n- Choosing a media CDN or image service\n- Setting up responsive image delivery\n- Planning a digital asset management (DAM) system\n- Auditing media performance issues\n- Picking video hosting and embedding strategy\n- Setting up workflows for designers and writers to upload assets\n- Migrating media from one platform to another\n\n## When NOT to use\n\n- Performance optimization beyond media (use `performance-optimization`)\n- Brand identity or photography direction (use `brand-identity`, `art-direction`)\n- Content production strategy (use `content-strategy`)\n- Single-image optimization (covered in `performance-optimization`)\n\n---\n\n## Required inputs\n\n- Current media inventory: where assets live, in what formats\n- Volume: how many assets, how much storage, how much traffic\n- Sources: who creates and uploads media (designers, writers, automated tools)\n- Platforms: where media is consumed (web, email, app, partners)\n- Performance baseline: current image sizes, load times\n- Budget reality: hosted services have monthly costs\n\n---\n\n## The framework: 4 stages\n\nThe media pipeline has four stages. Each has its own decisions.\n\n### Stage 1: Source\n\nWhere assets enter the system.\n\n**Sources:**\n- Designers (Figma exports, Photoshop, Illustrator)\n- Photographers (RAW or JPEG from camera)\n- Stock photo libraries\n- AI-generated images\n- User-generated content (uploads)\n- Automated systems (e.g., screenshots, generated thumbnails)\n\n**At source, decide:**\n- File formats accepted (RAW, TIFF, PSD, AI vs delivered formats)\n- Naming conventions\n- Required metadata (alt text, captions, credits, rights)\n- Maximum source resolution (high enough to derive any size; not so high it's wasteful)\n- Where source files live (separate from delivered assets)\n\n**Anti-pattern:** sources and delivered assets in the same place. Hard to find masters. Hard to regenerate. Hard to audit usage.\n\n### Stage 2: Process\n\nTransforming source files into delivery formats.\n\n**Processing decisions:**\n- Resize to standard sizes (e.g., a fixed set of widths: 320, 640, 960, 1280, 1920, 2560)\n- Compress (lossy or lossless, with quality targets)\n- Convert formats (JPEG, WebP, AVIF for raster; SVG for vector)\n- Generate thumbnails and previews\n- Strip metadata (EXIF, GPS) unless intentionally retained\n- Color profile management (sRGB for web)\n\n**Process options:**\n- **Build-time:** Static assets processed during deploy. Predictable, fast at runtime, hard to vary.\n- **On-demand:** A service generates the right format/size when requested. Flexible, requires a processing layer.\n- **Hybrid:** Static processed sizes plus on-demand for edge cases.\n\nFor sites with many image variants and ongoing change, on-demand wins. For tightly controlled marketing sites, build-time can be simpler.\n\n### Stage 3: Deliver\n\nGetting assets to users efficiently.\n\n**Delivery decisions:**\n- CDN: required for any non-trivial volume. Edge caching, global distribution.\n- Format negotiation: serve AVIF to browsers that support it, WebP otherwise, JPEG as fallback. Use the `<picture>` element or content negotiation.\n- Responsive images: `srcset` and `sizes` attributes so browsers pick the right size for the viewport.\n- Lazy loading: `loading=\"lazy\"` for below-the-fold images.\n- Async decoding: `decoding=\"async\"` for non-critical images.\n- Width and height attributes: always set, prevents layout shift.\n\n**Modern HTML pattern:**\n\n```html\n<img \n  src=\"/image-1280.jpg\" \n  srcset=\"/image-640.jpg 640w, /image-960.jpg 960w, /image-1280.jpg 1280w, /image-1920.jpg 1920w\" \n  sizes=\"(max-width: 768px) 100vw, 50vw\"\n  width=\"1280\"\n  height=\"720\"\n  loading=\"lazy\"\n  decoding=\"async\"\n  alt=\"Descriptive alt text\">\n```\n\nOr for format negotiation:\n\n```html\n<picture>\n  <source type=\"image/avif\" srcset=\"/image.avif\">\n  <source type=\"image/webp\" srcset=\"/image.webp\">\n  <img src=\"/image.jpg\" alt=\"Descriptive alt text\" width=\"1280\" height=\"720\">\n</picture>\n```\n\n### Stage 4: Manage\n\nKeeping the system organized and useful over time.\n\n**Management decisions:**\n- Asset library or DAM (digital asset management): centralized place for the team to find assets\n- Tagging and search\n- Version control (designers updating an asset, old version still in use)\n- Rights and licensing tracking\n- Audit and cleanup (what's not used anymore?)\n- Permissions (who can upload, edit, delete)\n\nA simple shared folder works at low scale. A real DAM is necessary above a few thousand assets or with multiple teams.\n\n---\n\n## Format reference\n\nFor typical web use:\n\n| Format | Use for | Avoid for |\n|---|---|---|\n| AVIF | Photographs, complex images. Best compression. | Browser support edge cases (rare in 2026, ubiquitous now) |\n| WebP | Photographs, illustrations. Good compression. Wide support. | Print, archival |\n| JPEG | Photographs (fallback). Universal support. | Sharp-edged graphics, transparent backgrounds |\n| PNG | Sharp-edged graphics, transparent backgrounds, screenshots. Lossless. | Photographs (file size) |\n| SVG | Logos, icons, simple illustrations. Scalable. | Photographs, complex art |\n| GIF | Effectively obsolete. Use video formats for animation. | Anything modern |\n| MP4 (H.264) | Video, universal support. | Static content |\n| WebM (VP9 / AV1) | Video, better compression. | Older browsers |\n\nFor most sites: serve AVIF/WebP for modern browsers, JPEG/PNG fallback. SVG for vector. MP4 for video.\n\n---\n\n## Workflow\n\n### Step 1: Inventory\n\nWhat assets exist? Where? In what state?\n\n- Image count and total storage\n- Average sizes (KB) per format\n- Image-related performance metrics\n- Number of pages with broken or missing images\n- Source files vs delivered files\n\n### Step 2: Audit performance\n\nFor a sample of pages:\n- Image weight per page (target: under 500KB total for marketing pages)\n- Number of image requests\n- Are responsive images used?\n- Are modern formats served?\n- Is there layout shift from missing dimensions?\n\nTools: Lighthouse, WebPageTest, your CDN's analytics.\n\n### Step 3: Pick the pipeline\n\nThree reasonable patterns:\n\n**Pattern A: Static, build-time**\n- Assets in repo or storage bucket\n- Build process generates sizes and formats\n- Served via CDN\n- Good for: static sites, low asset churn, tight performance control\n\n**Pattern B: Image CDN with on-demand**\n- Source uploads to a bucket or service\n- An image CDN (Cloudinary, imgix, Cloudflare Images, Bunny, etc.) processes on-demand via URL parameters\n- Good for: mid-to-large sites, frequent asset changes, multiple variants\n\n**Pattern C: Headless CMS with built-in image API**\n- CMS holds source assets\n- CMS provides image API for resizing, format conversion\n- Good for: content-heavy sites, non-technical content uploaders, when CMS is already chosen\n\nThe patterns aren't mutually exclusive. Big sites often use Pattern A for design assets, Pattern B for content images.\n\n### Step 4: Define standards\n\nDocument:\n- Naming conventions\n- Required metadata (alt text, attribution)\n- Maximum source dimensions\n- Minimum source dimensions per use case\n- Approved formats\n- File size targets\n\nMake these enforceable through tooling where possible (CI checks on file sizes, alt text required by CMS).\n\n### Step 5: Set up workflows\n\nFor each source type:\n\n| Source | Workflow |\n|---|---|\n| Designer | Export from Figma, drop into bucket, automated processing handles the rest |\n| Writer | Upload through CMS, CMS prompts for alt text |\n| Photographer | RAW into source bucket, designer or automation creates web variants |\n| User upload | Pass through the image service, automatic moderation if applicable |\n\nDocument who does what. Workflows that aren't documented break.\n\n### Step 6: Build the asset library\n\nFor all but the smallest sites:\n- Centralized DAM or shared library\n- Tag taxonomy (subject, style, brand, campaign, etc.)\n- Search across tags and metadata\n- Documented rights for each asset (stock license, custom commission, work-for-hire, etc.)\n- Sunset workflow (rights expire, asset retires)\n\n### Step 7: Monitor and audit\n\n- Performance metrics on image-heavy pages\n- Storage costs\n- CDN costs\n- Broken image alerts (404 on referenced media)\n- Unused asset cleanup (storage costs accumulate)\n\n### Step 8: Document the pipeline\n\nA pipeline document covers:\n- Diagram of source → process → deliver → manage\n- Tools used at each stage\n- Standards and naming conventions\n- Workflows for common cases\n- Escalation when something breaks\n\n---\n\n## Failure patterns\n\n**Source files in the delivery bucket.** 50MB RAW files served to users. Fix: separate sources from delivered.\n\n**Single image format for every browser.** JPEG-only when AVIF could be 30-50% smaller. Use format negotiation.\n\n**Missing width and height attributes.** Causes layout shift, hurts CLS metric. Set always.\n\n**Lazy loading hero images.** Above-the-fold images shouldn't be lazy-loaded. Lazy below the fold.\n\n**Eager loading everything.** All images load on page load. Use `loading=\"lazy\"` for below-fold.\n\n**No responsive images.** Mobile gets the desktop image. Wasteful, slow. Use `srcset` and `sizes`.\n\n**One source resolution.** Source is the delivery resolution. Can't generate retina or larger. Source should be 2-3x the largest delivered size.\n\n**Stripping all metadata.** Removes alt text, removes attribution. Strip GPS and personal EXIF; keep semantic metadata.\n\n**Random naming.** `IMG_4823.jpg`, `Screenshot 2024-03-15.png`. Hard to find later. Use a naming convention.\n\n**No alt text.** Accessibility failure, SEO failure. Make alt text required at upload.\n\n**Storage growing unbounded.** Old, unused assets pile up. Quarterly cleanup or automated lifecycle policies.\n\n**One person knows the pipeline.** When they're out, no one can fix issues or onboard new sources. Document.\n\n---\n\n## Output format\n\nA media pipeline document includes:\n\n- **Inventory:** current asset count, formats, storage\n- **Pipeline diagram:** source → process → deliver → manage with tools at each stage\n- **Format and size standards:** what gets generated, when\n- **Naming and metadata conventions:** with examples\n- **Workflows by source type:** designer, writer, photographer, user\n- **Performance baseline and targets:** weight per page, format adoption, etc.\n- **Asset library:** tool, taxonomy, search, rights tracking\n- **Monitoring:** performance, costs, broken assets\n- **Roadmap:** improvements over the next 1-2 quarters\n\n---\n\n## Reference files\n\n- [`references/responsive-image-patterns.md`](references/responsive-image-patterns.md): Copy-paste HTML patterns for common responsive image scenarios (hero, content, art-directed, format negotiation), with explanations.","tags":["media","asset","management","claude","skills","rampstackco","agent-skills","anthropic","awesome-claude-code","awesome-claude-prompts","awesome-claude-skills","claude-code"],"capabilities":["skill","source-rampstackco","skill-media-asset-management","topic-agent-skills","topic-anthropic","topic-awesome-claude-code","topic-awesome-claude-prompts","topic-awesome-claude-skills","topic-claude","topic-claude-code","topic-claude-skills","topic-good-first-issue","topic-mcp","topic-product-management","topic-seo"],"categories":["claude-skills"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/rampstackco/claude-skills/media-asset-management","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add rampstackco/claude-skills","source_repo":"https://github.com/rampstackco/claude-skills","install_from":"skills.sh"}},"qualityScore":"0.540","qualityRationale":"deterministic score 0.54 from registry signals: · indexed on github topic:agent-skills · 181 github stars · SKILL.md body (10,883 chars)","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill-github:v1","enrichmentVersion":1,"enrichedAt":"2026-05-18T18:55:17.952Z","embedding":null,"createdAt":"2026-04-30T01:01:29.250Z","updatedAt":"2026-05-18T18:55:17.952Z","lastSeenAt":"2026-05-18T18:55:17.952Z","tsv":"'-2':1482 '-3':1327 '-50':1242 '1':250,769,1481 '1280':378 '1920':379 '2':355,807,1326 '2024-03-15.png':1353 '2026':682 '2560':380 '3':484,853 '30':1241 '320':375 '4':236,578,993 '404':1167 '5':1036 '500kb':821 '50mb':1217 '6':1100 '640':376 '7':1149 '8':1178 '960':377 'above-the-fold':1264 'accept':292 'access':1365 'accumul':1176 'across':1124 'adopt':1462 'agnost':67 'ai':273,296 'ai-gener':272 'alert':1166 'alreadi':970 'alt':304,1001,1030,1065,1337,1363,1370 'alway':563,1259 'analyt':851 'anim':733 'anoth':139 'anti':333 'anti-pattern':332 'anymor':630 'anyth':734 'api':943,951 'app':218 'appli':70 'applic':1088 'approv':1013 'archiv':693 'aren':974,1095 'art':162,725,1501 'art-direct':161,1500 'asset':3,16,41,50,109,132,186,194,253,331,338,421,487,590,595,604,613,654,772,866,886,930,947,986,1103,1132,1146,1172,1380,1417,1464,1475 'async':550,553 'attribut':530,562,1003,1251,1340 'audit':44,113,352,623,808,1152 'autom':209,281,1053,1074,1386 'automat':1085 'av1':745 'averag':783 'avif':29,392,508,670,1238 'avif/webp':755 'avoid':668 'b':892,988 'background':704,711 'baselin':221,1455 'below-fold':1292 'below-the-fold':545 'best':674 'better':747 'beyond':146 'big':978 'brand':40,152,159,1120 'brand-ident':158 'break':1098,1208 'broken':797,1164,1474 'browser':510,532,676,750,758,1233 'bucket':871,903,1052,1071,1216 'budget':227 'build':418,478,864,872,1101 'build-tim':417,477,863 'built':940 'built-in':939 'bunni':913 'c':935 'cach':502 'camera':268 'campaign':1121 'caption':306 'case':458,679,1012,1204 'caus':1252 'cdn':97,493,849,880,894,908,1162 'central':597,1111 'chang':467,931 'check':1026 'choos':26,94 'chosen':971 'churn':887 'ci':1025 'cleanup':625,1173,1384 'cloudflar':911 'cloudinari':909 'cls':1256 'cms':937,944,948,968,1034,1061,1062 'color':409 'commiss':1136 'common':1203,1494 'complex':672,724 'compress':381,675,689,748 'consum':215 'content':164,169,279,523,742,959,965,990,1499 'content-heavi':958 'content-strategi':168 'control':474,609,890 'convent':301,998,1200,1361,1443 'convers':955 'convert':388 'copi':1489 'copy-past':1488 'cost':233,1161,1163,1175,1473 'could':1239 'count':779,1418 'cover':175,1185 'creat':203,1075 'credit':307 'critic':557 'current':182,222,1416 'custom':76,1135 'dam':111,593,647,1112 'decid':289 'decis':248,364,492,589 'decod':551,552 'defin':994 'delet':636 'deliv':298,330,337,485,804,1190,1227,1331,1425 'deliveri':25,105,361,491,1215,1315 'demand':434,455,470,898,918 'deploy':424 'deriv':315 'design':21,52,86,127,207,258,610,985,1046,1072,1450 'desktop':1301 'diagram':1186,1422 'digit':108,594 'dimens':844,1006,1009 'direct':156,163,1502 'distribut':504 'document':996,1089,1097,1128,1179,1184,1407,1413 'download':15,57 'drop':1050 'e.g':283,369 'eager':1279 'edg':457,501,678,701,708 'edit':635 'effect':727 'effici':490 'element':521 'email':217 'embed':121 'enforc':1020 'enough':313 'enter':254 'escal':1205 'etc':914,1122,1141,1463 'everi':1232 'everyth':1281 'exampl':1445 'exclus':977 'exif':404,1345 'exist':773 'expir':1145 'explan':1506 'export':260,1047 'failur':1209,1366,1368 'fallback':518,696,760 'fast':426 'figma':259,1049 'file':58,290,326,359,715,802,805,1015,1028,1212,1219,1485 'find':345,603,1356 'fix':371,1223,1401 'flexibl':443 'fold':548,1267,1278,1294 'folder':640 'format':27,190,291,299,362,389,505,574,659,665,731,787,836,877,954,1014,1230,1245,1409,1419,1432,1461,1503 'format/size':440 'four':242 'framework':235 'frequent':929 'generat':274,278,285,398,437,874,1319,1438 'get':59,486,1299,1437 'gif':726 'global':503 'good':688,881,922,956 'gps':405,1342 'graphic':702,709 'grow':1376 'h.264':737 'handl':1055 'hard':343,347,350,429,1354 'headless':936 'heavi':960,1158 'height':561,1250 'hero':1262,1498 'high':312,320 'hire':1140 'hold':945 'host':37,81,119,229 'html':569,571,576,1491 'hurt':1255 'hybrid':448 'icon':719 'ident':153,160 'illustr':262,687,721 'imag':12,22,33,47,54,90,99,104,173,223,275,463,526,549,558,673,778,789,800,815,828,832,893,907,912,942,950,991,1083,1157,1165,1229,1263,1268,1283,1297,1302,1496 'image-heavi':1156 'image-rel':788 'img_4823.jpg':1351 'imgix':910 'improv':1477 'includ':1414 'input':181 'intent':407 'inventori':184,770,1415 'issu':116,1402 'jpeg':266,390,516,694,1235 'jpeg-on':1234 'jpeg/png':759 'kb':785 'keep':580,1346 'know':1391 'larg':927 'larger':1322 'largest':1330 'later':1357 'layer':447 'layout':566,840,1253 'lazi':540,543,1260,1273,1275,1290 'lazy-load':1272 'librari':42,271,591,1104,1115,1465 'licens':621,1134 'lifecycl':1387 'lighthous':846 'live':187,327 'load':225,541,542,1261,1274,1280,1284,1287,1289 'logo':718 'lossi':382 'lossless':384,713 'low':643,885 'make':1018,1369 'manag':4,51,110,411,579,588,596,1191,1426 'mani':193,462 'market':475,824 'master':346 'maximum':309,1004 'media':2,9,49,92,96,114,134,147,183,206,213,239,1170,1411 'media-asset-manag':1 'metadata':303,403,1000,1127,1335,1348,1442 'metric':792,1154,1257 'mid':925 'mid-to-larg':924 'migrat':133 'minimum':1007 'miss':799,843,1247 'mobil':1298 'moder':1086 'modern':568,735,757,835 'monitor':1150,1471 'month':232 'mp4':736,764 'much':196,199 'multipl':657,932 'mutual':976 'name':300,997,1199,1350,1360,1440 'necessari':649 'negoti':506,524,575,1246,1504 'new':1405 'next':1480 'non':498,556,963 'non-crit':555 'non-techn':962 'non-trivi':497 'number':793,826 'obsolet':728 'often':980 'old':614,1378 'older':749 'on-demand':432,453,468,896,916 'onboard':1404 'one':136,1309,1389,1399 'ongo':466 'optim':145,151,174,179 'option':416 'organ':38,62,583 'otherwis':515 'output':1408 'page':795,814,818,825,1159,1286,1460 'paramet':921 'partner':219 'pass':1080 'past':1490 'pattern':334,570,859,860,891,934,973,982,987,1210,1492 'per':786,817,1010,1459 'perform':115,144,150,178,220,791,809,889,1153,1454,1472 'performance-optim':149,177 'permiss':631 'person':1344,1390 'photo':270 'photograph':263,671,686,695,714,723,1067,1452 'photographi':155 'photoshop':261 'pick':34,117,533,854 'pile':1381 'pipe':48 'pipelin':10,77,93,240,856,1181,1183,1393,1412,1421 'place':342,598 'plan':5,106 'platform':137,211 'plus':452 'png':705 'polici':1388 'possibl':1024 'predict':425 'prevent':565 'preview':401 'principl':69 'print':692 'process':61,356,363,415,422,446,450,873,915,1054,1189,1424 'product':165 'profil':410 'prompt':1063 'provid':949 'psd':295 'qualiti':386 'quarter':1383,1483 'random':1349 'rare':680 'raster':394 'raw':264,293,1068,1218 're':73,1396 'real':646 'realiti':228 'reason':858 'redesign':88 'refer':660,1484 'referenc':1169 'references/responsive-image-patterns.md':1486,1487 'regener':349 'relat':790 'remov':1336,1339 'repo':868 'request':442,829 'requir':180,302,444,494,999,1032,1372 'resiz':365,953 'resolut':311,1311,1316 'respons':32,103,525,831,1296,1495 'rest':1057 'retain':408 'retina':1320 'retir':1147 'right':308,439,535,619,1129,1144,1469 'roadmap':1476 'run':7,74 'runtim':428 'sampl':812 'scalabl':722 'scale':644 'scenario':1497 'screenshot':284,712,1352 'search':607,1123,1468 'semant':1347 'seo':1367 'separ':328,1224 'serv':64,507,754,837,878,1220 'servic':82,100,230,436,905,1084 'set':30,101,123,372,564,1037,1258 'share':639,1114 'sharp':700,707 'sharp-edg':699,706 'shift':567,841,1254 'shouldn':1269 'simpl':638,720 'simpler':482 'singl':172,1228 'single-imag':171 'site':460,476,753,884,928,961,979,1110 'size':224,317,368,451,529,536,716,784,875,1016,1029,1308,1332,1434 'skill':19 'skill-media-asset-management' 'slow':46,1304 'smaller':1243 'smallest':1109 'someth':1207 'sourc':201,251,257,288,310,325,335,358,801,899,946,1005,1008,1042,1044,1070,1188,1211,1225,1310,1312,1323,1406,1423,1448 'source-rampstackco' 'srcset':527,1306 'srgb':412 'stack':66 'stack-agnost':65 'stage':237,243,249,354,483,577,1196,1431 'standard':367,995,1197,1435 'state':777 'static':420,449,741,862,883 'step':768,806,852,992,1035,1099,1148,1177 'still':616 'stock':269,1133 'storag':23,197,782,870,1160,1174,1375,1420 'store':60 'strategi':122,166,170 'strip':402,1333,1341 'style':1119 'subject':1118 'sunset':1142 'support':512,677,691,698,740 'svg':395,717,761 'system':112,256,282,582 'tag':605,1116,1125 'target':387,819,1017,1457 'taxonomi':1117,1467 'team':601,658 'technic':964 'text':305,1002,1031,1066,1338,1364,1371 'thousand':653 'three':857 'thumbnail':286,399 'tiff':294 'tight':473,888 'time':226,419,479,587,865 'tool':210,845,1022,1192,1428,1466 'topic-agent-skills' 'topic-anthropic' 'topic-awesome-claude-code' 'topic-awesome-claude-prompts' 'topic-awesome-claude-skills' 'topic-claude' 'topic-claude-code' 'topic-claude-skills' 'topic-good-first-issue' 'topic-mcp' 'topic-product-management' 'topic-seo' 'total':781,822 'track':622,1470 'traffic':200 'transform':357 'transpar':703,710 'trivial':499 'type':1043,1449 'typic':662 'ubiquit':683 'unbound':1377 'univers':697,739 'unless':406 'unus':1171,1379 'updat':611 'upload':131,205,280,634,900,966,1059,1079,1374 'url':920 'usag':353 'use':17,79,85,143,148,157,167,519,585,618,629,664,666,729,833,981,1011,1193,1244,1288,1305,1358 'user':277,489,1078,1222,1453 'user-gener':276 'vari':431 'variant':464,933,1077 'vector':397,763 'version':608,615 'via':879,919 'video':13,36,55,118,730,738,746,766 'viewport':539 'volum':191,500 'vp9':744 'vs':297,803 'wast':323,1303 'web':216,414,663,1076 'webm':743 'webp':28,391,514,685 'webpagetest':847 'weight':816,1458 'whether':71 'wide':690 'width':374,559,1248 'win':471 'work':641,1138 'work-for-hir':1137 'workflow':125,767,1039,1045,1093,1143,1201,1446 'writer':129,208,1058,1451 'x':1328","prices":[{"id":"e81a9ba8-ebaa-4fd6-913b-5cb3625a2484","listingId":"4d033b42-7348-4a45-a320-f1c8c5a867d7","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"rampstackco","category":"claude-skills","install_from":"skills.sh"},"createdAt":"2026-04-30T01:01:29.250Z"}],"sources":[{"listingId":"4d033b42-7348-4a45-a320-f1c8c5a867d7","source":"github","sourceId":"rampstackco/claude-skills/media-asset-management","sourceUrl":"https://github.com/rampstackco/claude-skills/tree/main/skills/media-asset-management","isPrimary":false,"firstSeenAt":"2026-04-30T01:01:29.250Z","lastSeenAt":"2026-05-18T18:55:17.952Z"}],"details":{"listingId":"4d033b42-7348-4a45-a320-f1c8c5a867d7","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"rampstackco","slug":"media-asset-management","github":{"repo":"rampstackco/claude-skills","stars":181,"topics":["agent-skills","anthropic","awesome-claude-code","awesome-claude-prompts","awesome-claude-skills","claude","claude-code","claude-skills","good-first-issue","mcp","product-management","seo","show-hn","showcase","showdev","web-design","web-development"],"license":"mit","html_url":"https://github.com/rampstackco/claude-skills","pushed_at":"2026-05-10T22:40:22Z","description":"Stack-agnostic Claude Skills covering the full website lifecycle: brand, design, content, SEO, dev, ops, growth, and research. Build, ship, audit, optimize.","skill_md_sha":"85511d5f9bdc53e1ada83d11f3b9039e9f72357f","skill_md_path":"skills/media-asset-management/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/rampstackco/claude-skills/tree/main/skills/media-asset-management"},"layout":"multi","source":"github","category":"claude-skills","frontmatter":{"name":"media-asset-management","description":"Plan and run a media pipeline for images, video, and downloadable assets. Use this skill when designing image storage and delivery, choosing formats (WebP, AVIF), setting up responsive images, picking a video host, organizing a brand asset library, or auditing a slow image pipeline. Triggers on image pipeline, asset library, DAM, image optimization, WebP, AVIF, responsive images, video hosting, image CDN, asset workflow, media management. Also triggers when images are slow, broken, or scattered across systems."},"skills_sh_url":"https://skills.sh/rampstackco/claude-skills/media-asset-management"},"updatedAt":"2026-05-18T18:55:17.952Z"}}