[{"data":1,"prerenderedAt":1136},["ShallowReactive",2],{"/blog/how-to-make-a-saas-launch-video-2026/":3,"/blog/how-to-make-a-saas-launch-video-2026/-related":355,"/blog/how-to-make-a-saas-launch-video-2026/-resources":1123},{"id":4,"title":5,"author":6,"body":10,"category":335,"createdAt":336,"description":337,"extension":338,"location":339,"meta":340,"navigation":346,"ogImage":347,"path":348,"readingTime":349,"seo":350,"stem":351,"tags":352,"updatedAt":336,"url":353,"__hash__":354},"blog/blog/how-to-make-a-saas-launch-video-2026.md","How to Make a SaaS Launch Video From Your Real Product Screens (2026)",{"name":7,"social":8},"Simon Dziak",{"twitter":9},"@SzymonDziak",{"type":11,"value":12,"toc":316},"minimark",[13,21,35,40,43,46,74,77,81,84,103,107,110,136,146,150,176,180,183,250,253,257,260,264,276,280,285,288,292,295,299,302,306,309,313],[14,15,16,20],"p",{},[17,18,19],"strong",{},"A good SaaS launch video shows the product doing one valuable thing, fast."," You don't need actors, a studio or 3D animation. You need a tight script, sharp recordings of your real screens, motion that guides the eye, and the right cuts for each place the video will run. Sixty seconds is enough for a homepage hero, a launch post or an ad.",[14,22,23,24,29,30,34],{},"This is the process App369 follows for its ",[25,26,28],"a",{"href":27},"/fixed-price/#saas-launch-video","fixed-price SaaS Launch Video",". Simon makes the product videos and Shorts for his own SaaS, Workspace369, the same way; there is a 30-second reel on the ",[25,31,33],{"href":32},"/fixed-price/#reel","fixed-price page",".",[36,37,39],"h2",{"id":38},"step-1-write-the-script-first","Step 1: Write the script first",[14,41,42],{},"The script decides whether the video works; animation can't rescue a vague one. For 60 seconds, plan on roughly 140 words of voiceover, or fewer words on screen if you go captions-only.",[14,44,45],{},"A structure that fits most launches:",[47,48,49,56,62,68],"ol",{},[50,51,52,55],"li",{},[17,53,54],{},"The problem, in the viewer's words (5–8 s)."," \"Chasing clients for payment again?\"",[50,57,58,61],{},[17,59,60],{},"The product in one sentence (5 s)."," What it is and who it's for.",[50,63,64,67],{},[17,65,66],{},"Three features, each as an outcome (35–40 s)."," Not \"automated reminders\" but \"clients get a reminder before the invoice is late\".",[50,69,70,73],{},[17,71,72],{},"The call to action (5–8 s)."," One action, the same one as on your page: \"Start free at …\".",[14,75,76],{},"Get the script approved in writing before anyone records or animates anything. Changing a sentence later means re-timing everything after it.",[36,78,80],{"id":79},"step-2-record-the-screens-properly","Step 2: Record the screens properly",[14,82,83],{},"The video can only be as sharp as the recordings.",[85,86,87,90,97,100],"ul",{},[50,88,89],{},"Record at the highest resolution you can; a 2× (retina) display gives crisp text after scaling down. Never upscale a small recording.",[50,91,92,93,96],{},"Use ",[17,94,95],{},"test data"," that looks real: believable names, amounts and dates. Never show real customer data.",[50,98,99],{},"Hide everything that isn't the product: bookmarks bar, notifications, other tabs, the cursor where it isn't needed.",[50,101,102],{},"Record each feature as a short separate clip, slower than feels natural. It's easy to speed up in editing; it's impossible to slow down a rushed click.",[36,104,106],{"id":105},"step-3-motion-that-guides-the-eye","Step 3: Motion that guides the eye",[14,108,109],{},"Motion graphics turn screen recordings into something people watch:",[85,111,112,118,124,130],{},[50,113,114,117],{},[17,115,116],{},"Animated UI shots."," Crop into the part of the screen that matters, then zoom or pan to follow the action, so viewers never hunt for the cursor.",[50,119,120,123],{},[17,121,122],{},"Kinetic type."," Short on-screen phrases timed to the voiceover carry the message for people watching without sound.",[50,125,126,129],{},[17,127,128],{},"Clean transitions."," Cut on the beat of the music, and keep transitions consistent. One style, used everywhere, looks deliberate.",[50,131,132,135],{},[17,133,134],{},"Your brand."," Use your colors, fonts and logo, so the video looks like your product and not a template.",[14,137,138,139,145],{},"Code-driven tools such as ",[25,140,144],{"href":141,"rel":142},"https://www.remotion.dev/",[143],"nofollow","Remotion"," make it practical to keep one source and export several formats from it, which matters in step 5.",[36,147,149],{"id":148},"step-4-sound-voice-and-captions","Step 4: Sound, voice and captions",[85,151,152,158,164,170],{},[50,153,154,157],{},[17,155,156],{},"Music and sound design"," must be licensed for commercial use. Subtle UI sounds on clicks and transitions make screen recordings feel alive.",[50,159,160,163],{},[17,161,162],{},"Voiceover:"," your own recording reads as most authentic for founder-led products. A synthetic voice can work if you approve and license it. Captions-only is a valid choice for feeds where most people watch muted.",[50,165,166,169],{},[17,167,168],{},"Loudness:"," master to around −14 LUFS integrated, a common target for online platforms, so your video isn't quieter or louder than what plays before it.",[50,171,172,175],{},[17,173,174],{},"Captions:"," burn them into vertical cuts, and ship an SRT file for players that support closed captions.",[36,177,179],{"id":178},"step-5-export-the-cuts-youll-actually-use","Step 5: Export the cuts you'll actually use",[14,181,182],{},"One video rarely fits every placement. From the same build, export:",[184,185,186,202],"table",{},[187,188,189],"thead",{},[190,191,192,196,199],"tr",{},[193,194,195],"th",{},"Cut",[193,197,198],{},"Format",[193,200,201],{},"Where it runs",[203,204,205,217,228,239],"tbody",{},[190,206,207,211,214],{},[208,209,210],"td",{},"60-second master",[208,212,213],{},"16:9, 1920×1080, H.264",[208,215,216],{},"Homepage, YouTube, launch posts",[190,218,219,222,225],{},[208,220,221],{},"15-second cut",[208,223,224],{},"16:9",[208,226,227],{},"Ads, social posts, email GIF previews",[190,229,230,233,236],{},[208,231,232],{},"Vertical cut with captions",[208,234,235],{},"9:16, 1080×1920",[208,237,238],{},"Shorts, Reels, TikTok, LinkedIn mobile",[190,240,241,244,247],{},[208,242,243],{},"Cover frame",[208,245,246],{},"1280×720 PNG",[208,248,249],{},"YouTube thumbnail, video poster",[14,251,252],{},"For the vertical cut, keep text and key UI out of the bottom and right edges, where platforms overlay buttons and captions.",[36,254,256],{"id":255},"step-6-review-in-two-rounds","Step 6: Review in two rounds",[14,258,259],{},"Plan two rounds of feedback, each in writing: the first on a full rough cut (story, order, timing), the second on the polished cut (details, typos, sound). Collect all comments from your team before sending them; contradictory notes from different people are the most common cause of delays.",[36,261,263],{"id":262},"what-it-costs","What it costs",[14,265,266,267,270,271,275],{},"Freelance and agency prices for a 60-second motion-graphics product video vary widely, depending on how much is custom-animated versus built from screens. App369 makes them at a ",[25,268,269],{"href":27},"fixed $1,500",", in 10 business days: script first, a 60-second 1080p master, a 15-second cut and a vertical cut with captions, licensed music or sound design, a cover frame and two rounds of revisions. If you'd rather have a steady stream of short videos, ",[25,272,274],{"href":273},"/fixed-price/#shorts-as-a-service","Shorts-as-a-Service"," delivers twelve a month.",[36,277,279],{"id":278},"frequently-asked-questions","Frequently Asked Questions",[281,282,284],"h3",{"id":283},"how-long-should-a-saas-launch-video-be","How long should a SaaS launch video be?",[14,286,287],{},"Sixty seconds works for most homepage and launch uses, with a 15-second cut for ads. Longer walkthroughs belong in your help center or on YouTube, not in the launch video.",[281,289,291],{"id":290},"do-i-need-a-voiceover-for-a-product-video","Do I need a voiceover for a product video?",[14,293,294],{},"No. Many people watch muted in feeds, so on-screen text and captions carry the message either way. A voiceover helps on your homepage and YouTube; your own voice works best for founder-led products.",[281,296,298],{"id":297},"can-i-make-a-launch-video-from-screenshots-instead-of-screen-recordings","Can I make a launch video from screenshots instead of screen recordings?",[14,300,301],{},"Yes. Motion graphics can animate still screenshots convincingly, with zooms, highlights and simulated clicks. High-resolution screenshots are better than a blurry recording.",[281,303,305],{"id":304},"what-resolution-should-a-saas-product-video-be","What resolution should a SaaS product video be?",[14,307,308],{},"Export the master at 1920×1080 (16:9) in H.264, and a 1080×1920 (9:16) version for vertical feeds. Record your screens at a higher resolution than that so text stays sharp.",[281,310,312],{"id":311},"how-do-i-keep-real-customer-data-out-of-my-product-video","How do I keep real customer data out of my product video?",[14,314,315],{},"Record in a test or demo account filled with realistic sample data, and check every frame before publishing. Blurring real data afterwards is error-prone; it is easier to never record it.",{"title":317,"searchDepth":318,"depth":318,"links":319},"",2,[320,321,322,323,324,325,326,327],{"id":38,"depth":318,"text":39},{"id":79,"depth":318,"text":80},{"id":105,"depth":318,"text":106},{"id":148,"depth":318,"text":149},{"id":178,"depth":318,"text":179},{"id":255,"depth":318,"text":256},{"id":262,"depth":318,"text":263},{"id":278,"depth":318,"text":279,"children":328},[329,331,332,333,334],{"id":283,"depth":330,"text":284},3,{"id":290,"depth":330,"text":291},{"id":297,"depth":330,"text":298},{"id":304,"depth":330,"text":305},{"id":311,"depth":330,"text":312},"AI & Technology","2026-10-12T12:00:00.000Z","How to make a 60-second SaaS launch video from your real product screens: script, screen capture, motion graphics, sound, captions and the cuts you need for your homepage, YouTube and vertical feeds.","md","Boynton Beach, FL",{"readingTimeStats":341},{"text":342,"minutes":343,"time":344,"words":345},"5 min read",4.535,272100,907,true,null,"/blog/how-to-make-a-saas-launch-video-2026","8 min",{"title":5,"description":337},"blog/how-to-make-a-saas-launch-video-2026","saas launch video, product video, motion graphics, explainer video, saas marketing video, product demo video","https://app369.com/blog/how-to-make-a-saas-launch-video-2026/","m6GdVIhLILzV6VHwAkAd95B6LSq7Wj-tcZMvY7rAMbA",[356,565],{"id":4,"title":5,"author":357,"body":359,"category":335,"createdAt":336,"description":337,"extension":338,"location":339,"meta":562,"navigation":346,"ogImage":347,"path":348,"readingTime":349,"seo":564,"stem":351,"tags":352,"updatedAt":336,"url":353,"__hash__":354},{"name":7,"social":358},{"twitter":9},{"type":11,"value":360,"toc":546},[361,365,371,373,375,377,395,397,399,401,413,415,417,435,440,442,460,462,464,510,512,514,516,518,524,526,528,530,532,534,536,538,540,542,544],[14,362,363,20],{},[17,364,19],{},[14,366,23,367,29,369,34],{},[25,368,28],{"href":27},[25,370,33],{"href":32},[36,372,39],{"id":38},[14,374,42],{},[14,376,45],{},[47,378,379,383,387,391],{},[50,380,381,55],{},[17,382,54],{},[50,384,385,61],{},[17,386,60],{},[50,388,389,67],{},[17,390,66],{},[50,392,393,73],{},[17,394,72],{},[14,396,76],{},[36,398,80],{"id":79},[14,400,83],{},[85,402,403,405,409,411],{},[50,404,89],{},[50,406,92,407,96],{},[17,408,95],{},[50,410,99],{},[50,412,102],{},[36,414,106],{"id":105},[14,416,109],{},[85,418,419,423,427,431],{},[50,420,421,117],{},[17,422,116],{},[50,424,425,123],{},[17,426,122],{},[50,428,429,129],{},[17,430,128],{},[50,432,433,135],{},[17,434,134],{},[14,436,138,437,145],{},[25,438,144],{"href":141,"rel":439},[143],[36,441,149],{"id":148},[85,443,444,448,452,456],{},[50,445,446,157],{},[17,447,156],{},[50,449,450,163],{},[17,451,162],{},[50,453,454,169],{},[17,455,168],{},[50,457,458,175],{},[17,459,174],{},[36,461,179],{"id":178},[14,463,182],{},[184,465,466,476],{},[187,467,468],{},[190,469,470,472,474],{},[193,471,195],{},[193,473,198],{},[193,475,201],{},[203,477,478,486,494,502],{},[190,479,480,482,484],{},[208,481,210],{},[208,483,213],{},[208,485,216],{},[190,487,488,490,492],{},[208,489,221],{},[208,491,224],{},[208,493,227],{},[190,495,496,498,500],{},[208,497,232],{},[208,499,235],{},[208,501,238],{},[190,503,504,506,508],{},[208,505,243],{},[208,507,246],{},[208,509,249],{},[14,511,252],{},[36,513,256],{"id":255},[14,515,259],{},[36,517,263],{"id":262},[14,519,266,520,270,522,275],{},[25,521,269],{"href":27},[25,523,274],{"href":273},[36,525,279],{"id":278},[281,527,284],{"id":283},[14,529,287],{},[281,531,291],{"id":290},[14,533,294],{},[281,535,298],{"id":297},[14,537,301],{},[281,539,305],{"id":304},[14,541,308],{},[281,543,312],{"id":311},[14,545,315],{},{"title":317,"searchDepth":318,"depth":318,"links":547},[548,549,550,551,552,553,554,555],{"id":38,"depth":318,"text":39},{"id":79,"depth":318,"text":80},{"id":105,"depth":318,"text":106},{"id":148,"depth":318,"text":149},{"id":178,"depth":318,"text":179},{"id":255,"depth":318,"text":256},{"id":262,"depth":318,"text":263},{"id":278,"depth":318,"text":279,"children":556},[557,558,559,560,561],{"id":283,"depth":330,"text":284},{"id":290,"depth":330,"text":291},{"id":297,"depth":330,"text":298},{"id":304,"depth":330,"text":305},{"id":311,"depth":330,"text":312},{"readingTimeStats":563},{"text":342,"minutes":343,"time":344,"words":345},{"title":5,"description":337},{"id":566,"title":567,"author":568,"body":570,"category":335,"createdAt":1108,"description":1109,"extension":338,"location":339,"meta":1110,"navigation":346,"ogImage":347,"path":1116,"readingTime":1117,"seo":1118,"stem":1119,"tags":1120,"updatedAt":1108,"url":1121,"__hash__":1122},"blog/blog/how-to-add-an-mcp-server-to-your-saas-2026.md","How to Add an MCP Server to Your SaaS: A Practical Guide (2026)",{"name":7,"social":569},{"twitter":9},{"type":11,"value":571,"toc":1090},[572,578,585,589,598,618,621,625,628,642,645,649,652,672,676,679,693,702,966,972,976,979,999,1002,1006,1009,1013,1030,1034,1037,1039,1049,1051,1055,1058,1062,1065,1069,1072,1076,1079,1083,1086],[14,573,574,577],{},[17,575,576],{},"An MCP server lets people use your product from inside Claude, ChatGPT and other AI assistants."," If your SaaS already has a documented REST API, you don't need new endpoints. An MCP server sits on top of the API, describes a handful of actions as \"tools\" the assistant can call, and handles sign-in. The work is mostly in choosing the right tools and describing them well.",[14,579,580,581,34],{},"Simon built and runs the MCP server for Workspace369, App369's own SaaS. This guide is the checklist App369 follows for its ",[25,582,584],{"href":583},"/fixed-price/#mcp-connector","fixed-price MCP Connector",[36,586,588],{"id":587},"what-mcp-is","What MCP is",[14,590,591,592,597],{},"The ",[25,593,596],{"href":594,"rel":595},"https://modelcontextprotocol.io/",[143],"Model Context Protocol"," is an open standard, introduced by Anthropic in November 2024, for connecting AI applications to outside tools and data. A server exposes three kinds of things:",[85,599,600,606,612],{},[50,601,602,605],{},[17,603,604],{},"Tools:"," actions the model can call, such as \"create an invoice\" or \"search clients\".",[50,607,608,611],{},[17,609,610],{},"Resources:"," data the client can read into context, such as a document or a record.",[50,613,614,617],{},[17,615,616],{},"Prompts:"," reusable templates a user can pick.",[14,619,620],{},"For a SaaS integration, tools do most of the work. Each tool has a name, a plain-language description and a JSON schema for its inputs. The assistant reads the descriptions and decides when to call which tool.",[36,622,624],{"id":623},"local-or-remote","Local or remote",[14,626,627],{},"MCP servers talk to clients over one of two transports:",[85,629,630,636],{},[50,631,632,635],{},[17,633,634],{},"stdio:"," the server runs as a local process on the user's machine. This suits developer tools, but asks every user to install something.",[50,637,638,641],{},[17,639,640],{},"Streamable HTTP:"," the server runs on the web at a URL. This is what a SaaS wants: users add your connector by URL and sign in, with nothing to install.",[14,643,644],{},"Build a remote server over Streamable HTTP unless you have a reason not to.",[36,646,648],{"id":647},"step-1-pick-5-to-10-tools","Step 1: Pick 5 to 10 tools",[14,650,651],{},"Don't mirror your whole API. Pick the jobs people would actually ask an assistant to do, and make each one a tool:",[85,653,654,660,666],{},[50,655,656,659],{},[17,657,658],{},"Read tools first."," \"Find a client\", \"list overdue invoices\", \"show this project's tasks\". They are safe, and they are what people try first.",[50,661,662,665],{},[17,663,664],{},"A few write tools."," \"Create a draft invoice\", \"add a note\". Prefer creating drafts over sending or deleting, so a person confirms the final step in your app.",[50,667,668,671],{},[17,669,670],{},"No destructive tools at first."," Deleting, refunding or emailing customers from a chat is where mistakes get expensive.",[36,673,675],{"id":674},"step-2-write-descriptions-for-the-model","Step 2: Write descriptions for the model",[14,677,678],{},"The model only knows what your descriptions tell it. For each tool:",[85,680,681,684,687,690],{},[50,682,683],{},"Say what it does and when to use it, in one or two sentences.",[50,685,686],{},"Name every input in plain words, with formats (\"ISO date, e.g. 2026-10-12\") and allowed values.",[50,688,689],{},"Return compact, labelled JSON. Strip internal IDs and fields the user would never ask about, and paginate long lists.",[50,691,692],{},"Return errors as readable messages (\"No client named 'Acme'. Try search_clients first.\"), so the model can recover.",[14,694,695,696,701],{},"A minimal tool with the official ",[25,697,700],{"href":698,"rel":699},"https://github.com/modelcontextprotocol/typescript-sdk",[143],"TypeScript SDK"," looks like this:",[703,704,708],"pre",{"className":705,"code":706,"language":707,"meta":317,"style":317},"language-ts shiki shiki-themes github-light github-dark","import { McpServer } from '@modelcontextprotocol/sdk/server/mcp.js';\nimport { z } from 'zod';\n\nconst server = new McpServer({ name: 'your-saas', version: '1.0.0' });\n\nserver.tool(\n  'list_overdue_invoices',\n  'List invoices that are past their due date, newest first. Use when the user asks who owes them money.',\n  { limit: z.number().int().min(1).max(50).default(10) },\n  async ({ limit }) => {\n    const invoices = await api.get('/invoices', { status: 'overdue', limit });\n    return { content: [{ type: 'text', text: JSON.stringify(invoices) }] };\n  },\n);\n","ts",[709,710,711,734,748,753,788,793,805,814,822,872,894,928,954,960],"code",{"__ignoreMap":317},[712,713,716,720,724,727,731],"span",{"class":714,"line":715},"line",1,[712,717,719],{"class":718},"szBVR","import",[712,721,723],{"class":722},"sVt8B"," { McpServer } ",[712,725,726],{"class":718},"from",[712,728,730],{"class":729},"sZZnC"," '@modelcontextprotocol/sdk/server/mcp.js'",[712,732,733],{"class":722},";\n",[712,735,736,738,741,743,746],{"class":714,"line":318},[712,737,719],{"class":718},[712,739,740],{"class":722}," { z } ",[712,742,726],{"class":718},[712,744,745],{"class":729}," 'zod'",[712,747,733],{"class":722},[712,749,750],{"class":714,"line":330},[712,751,752],{"emptyLinePlaceholder":346},"\n",[712,754,756,759,763,766,769,773,776,779,782,785],{"class":714,"line":755},4,[712,757,758],{"class":718},"const",[712,760,762],{"class":761},"sj4cs"," server",[712,764,765],{"class":718}," =",[712,767,768],{"class":718}," new",[712,770,772],{"class":771},"sScJk"," McpServer",[712,774,775],{"class":722},"({ name: ",[712,777,778],{"class":729},"'your-saas'",[712,780,781],{"class":722},", version: ",[712,783,784],{"class":729},"'1.0.0'",[712,786,787],{"class":722}," });\n",[712,789,791],{"class":714,"line":790},5,[712,792,752],{"emptyLinePlaceholder":346},[712,794,796,799,802],{"class":714,"line":795},6,[712,797,798],{"class":722},"server.",[712,800,801],{"class":771},"tool",[712,803,804],{"class":722},"(\n",[712,806,808,811],{"class":714,"line":807},7,[712,809,810],{"class":729},"  'list_overdue_invoices'",[712,812,813],{"class":722},",\n",[712,815,817,820],{"class":714,"line":816},8,[712,818,819],{"class":729},"  'List invoices that are past their due date, newest first. Use when the user asks who owes them money.'",[712,821,813],{"class":722},[712,823,825,828,831,834,837,839,842,845,848,851,854,856,859,861,864,866,869],{"class":714,"line":824},9,[712,826,827],{"class":722},"  { limit: z.",[712,829,830],{"class":771},"number",[712,832,833],{"class":722},"().",[712,835,836],{"class":771},"int",[712,838,833],{"class":722},[712,840,841],{"class":771},"min",[712,843,844],{"class":722},"(",[712,846,847],{"class":761},"1",[712,849,850],{"class":722},").",[712,852,853],{"class":771},"max",[712,855,844],{"class":722},[712,857,858],{"class":761},"50",[712,860,850],{"class":722},[712,862,863],{"class":771},"default",[712,865,844],{"class":722},[712,867,868],{"class":761},"10",[712,870,871],{"class":722},") },\n",[712,873,875,878,881,885,888,891],{"class":714,"line":874},10,[712,876,877],{"class":718},"  async",[712,879,880],{"class":722}," ({ ",[712,882,884],{"class":883},"s4XuR","limit",[712,886,887],{"class":722}," }) ",[712,889,890],{"class":718},"=>",[712,892,893],{"class":722}," {\n",[712,895,897,900,903,905,908,911,914,916,919,922,925],{"class":714,"line":896},11,[712,898,899],{"class":718},"    const",[712,901,902],{"class":761}," invoices",[712,904,765],{"class":718},[712,906,907],{"class":718}," await",[712,909,910],{"class":722}," api.",[712,912,913],{"class":771},"get",[712,915,844],{"class":722},[712,917,918],{"class":729},"'/invoices'",[712,920,921],{"class":722},", { status: ",[712,923,924],{"class":729},"'overdue'",[712,926,927],{"class":722},", limit });\n",[712,929,931,934,937,940,943,946,948,951],{"class":714,"line":930},12,[712,932,933],{"class":718},"    return",[712,935,936],{"class":722}," { content: [{ type: ",[712,938,939],{"class":729},"'text'",[712,941,942],{"class":722},", text: ",[712,944,945],{"class":761},"JSON",[712,947,34],{"class":722},[712,949,950],{"class":771},"stringify",[712,952,953],{"class":722},"(invoices) }] };\n",[712,955,957],{"class":714,"line":956},13,[712,958,959],{"class":722},"  },\n",[712,961,963],{"class":714,"line":962},14,[712,964,965],{"class":722},");\n",[14,967,591,968,971],{},[709,969,970],{},"api"," client is your existing REST client, called with the signed-in user's credentials.",[36,973,975],{"id":974},"step-3-decide-how-users-sign-in","Step 3: Decide how users sign in",[14,977,978],{},"There are two common options:",[85,980,981,987],{},[50,982,983,986],{},[17,984,985],{},"API key or personal access token."," The user pastes a key from your settings page. It is the fastest to build and fine for technical users and internal teams.",[50,988,989,992,993,998],{},[17,990,991],{},"OAuth."," The user clicks \"Connect\", signs in to your product and approves access, with no keys to copy. The MCP specification defines ",[25,994,997],{"href":995,"rel":996},"https://modelcontextprotocol.io/specification/2025-06-18/basic/authorization",[143],"authorization for HTTP transports"," based on OAuth 2.1. It takes longer to build, but it is what non-technical users expect, and directories tend to favour it.",[14,1000,1001],{},"Either way, every tool call must run as the signed-in user, with that user's permissions. Never give the MCP server one shared admin key.",[36,1003,1005],{"id":1004},"step-4-host-it-next-to-your-api","Step 4: Host it next to your API",[14,1007,1008],{},"A remote MCP server is a small web service. Cloud Run, Cloudflare Workers and Vercel all work well; pick whatever already hosts your API, so logs, secrets and billing stay in one place. Keep API keys and OAuth client secrets in your platform's secret manager, not in environment files committed to git.",[36,1010,1012],{"id":1011},"step-5-test-in-real-clients","Step 5: Test in real clients",[47,1014,1015,1024,1027],{},[50,1016,1017,1018,1023],{},"Use the ",[25,1019,1022],{"href":1020,"rel":1021},"https://github.com/modelcontextprotocol/inspector",[143],"MCP Inspector"," to call each tool directly and check its schema and output.",[50,1025,1026],{},"Add the server as a custom connector in Claude and in ChatGPT, and ask ordinary questions (\"who owes me money this month?\"). Watch which tools the model picks, and rewrite descriptions where it picks wrong.",[50,1028,1029],{},"Test a user without permission to a record, and a user from another account. They must get errors, not data.",[36,1031,1033],{"id":1032},"step-6-submit-to-directories","Step 6: Submit to directories",[14,1035,1036],{},"Anthropic and OpenAI both list third-party connectors, and both review submissions. Prepare listing copy, screenshots, a privacy policy that covers the connector, and a test account for the reviewers. Approval is up to each directory, so plan your launch around your own users first: a \"Connect to Claude\" page in your help center works on day one.",[36,1038,263],{"id":262},[14,1040,1041,1042,1044,1045,34],{},"Built in-house, expect one to three weeks for an engineer who already knows your API, depending mostly on authentication and how many tools you start with. App369 builds it as a ",[25,1043,584],{"href":583},": $2,500 for up to 8 tools over your existing documented API with API-key or token auth, deployed to your own cloud account and tested in Claude and ChatGPT, with a directory-submission packet. OAuth sign-in is a $1,000 add-on. For broader AI work, see ",[25,1046,1048],{"href":1047},"/service/ai-integration/","AI integration services",[36,1050,279],{"id":278},[281,1052,1054],{"id":1053},"do-i-need-to-build-new-api-endpoints-for-an-mcp-server","Do I need to build new API endpoints for an MCP server?",[14,1056,1057],{},"No. If your REST API is documented and already supports the actions you want, the MCP server calls those endpoints on behalf of the signed-in user. New endpoints are only needed when an action people want doesn't exist in your API yet.",[281,1059,1061],{"id":1060},"does-one-mcp-server-work-in-both-claude-and-chatgpt","Does one MCP server work in both Claude and ChatGPT?",[14,1063,1064],{},"Yes. MCP is a shared protocol, so one remote server can be added as a connector in both. Test in each client, because they can choose and display tool calls differently.",[281,1066,1068],{"id":1067},"should-i-use-oauth-or-api-keys-for-my-mcp-connector","Should I use OAuth or API keys for my MCP connector?",[14,1070,1071],{},"Start with API keys or personal access tokens if your users are technical or internal. Use OAuth if non-technical customers will connect it themselves or you plan to list it in public directories. Either way, each call must run with the signed-in user's own permissions.",[281,1073,1075],{"id":1074},"is-it-safe-to-let-an-ai-assistant-write-data-in-my-app","Is it safe to let an AI assistant write data in my app?",[14,1077,1078],{},"It can be, if you limit what tools can do. Start with read tools, make write tools create drafts rather than send or delete, run every call with the user's own permissions, and log tool calls so you can see what happened.",[281,1080,1082],{"id":1081},"how-many-tools-should-an-mcp-server-have","How many tools should an MCP server have?",[14,1084,1085],{},"Start with 5 to 10 that cover the questions users actually ask. Too many similar tools make the model pick the wrong one. Add more once you have seen real usage.",[1087,1088,1089],"style",{},"html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .s4XuR, html code.shiki .s4XuR{--shiki-default:#E36209;--shiki-dark:#FFAB70}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":317,"searchDepth":318,"depth":318,"links":1091},[1092,1093,1094,1095,1096,1097,1098,1099,1100,1101],{"id":587,"depth":318,"text":588},{"id":623,"depth":318,"text":624},{"id":647,"depth":318,"text":648},{"id":674,"depth":318,"text":675},{"id":974,"depth":318,"text":975},{"id":1004,"depth":318,"text":1005},{"id":1011,"depth":318,"text":1012},{"id":1032,"depth":318,"text":1033},{"id":262,"depth":318,"text":263},{"id":278,"depth":318,"text":279,"children":1102},[1103,1104,1105,1106,1107],{"id":1053,"depth":330,"text":1054},{"id":1060,"depth":330,"text":1061},{"id":1067,"depth":330,"text":1068},{"id":1074,"depth":330,"text":1075},{"id":1081,"depth":330,"text":1082},"2026-10-12T09:00:00.000Z","How to make your SaaS work inside Claude and ChatGPT with an MCP server over your existing REST API: choosing tools, authentication, hosting, testing and directory submission.",{"readingTimeStats":1111},{"text":1112,"minutes":1113,"time":1114,"words":1115},"6 min read",5.735,344100,1147,"/blog/how-to-add-an-mcp-server-to-your-saas-2026","9 min",{"title":567,"description":1109},"blog/how-to-add-an-mcp-server-to-your-saas-2026","mcp server, model context protocol, claude connector, chatgpt connector, saas ai integration, mcp oauth","https://app369.com/blog/how-to-add-an-mcp-server-to-your-saas-2026/","Q-_2beQi4FrOwPFO9yryBnLKDtw1D5shQXBsFXdZsI8",[1124,1126,1130,1133],{"keyword":5,"url":353,"title":5,"relevance":1125},55,{"keyword":1127,"url":1128,"title":1129,"relevance":824},"SaaS","/glossary/what-is-saas/","What is SaaS?",{"keyword":1131,"url":1132,"title":1131,"relevance":807},"Best App Development for Marketing (2026)","https://app369.com/blog/best-app-development-company-marketing-2026/",{"keyword":1134,"url":1135,"title":1134,"relevance":807},"China App Market Entry Guide (2026)","https://app369.com/blog/china-app-market-entry-guide-2026/",1791800181765]