MCP Apps: Primitives, discovery, and the Future of Software - Pietro Zullo, Manufact, Inc

AI Engineer · 28 min · 276 sentences · from YouTube's caption track

Each timecode opens YouTube at the start of that sentence. Line anchors (#s42) are the cue ids in the WebVTT, and every line carries its start and end seconds. All transcripts has every talk, and the whole corpus as one file.

  1. 00:01Hello y'all.
  2. 00:02My name is Pedro.
  3. 00:03I'm the co-founder of Manufact.
  4. 00:05And uh today I want to talk to you about MCP apps.
  5. 00:09Specifically, we're going to talk about the primitives.
  6. 00:11So, how these apps are built, how they work, and what they allow you.
  7. 00:15How to distribute MCP apps.
  8. 00:17So, what is behind the discovery mechanisms of MCP servers and apps in general.
  9. 00:23And uh why I think you should care about this because this is how all software will be used.
  10. 00:31So, I'm sure most people here listening to this talk know what an MCP is.
  11. 00:36MCP has been around for quite some time since 2024.
  12. 00:41For a full year, it was a it became very uh say frequent talk amongst developers and companies that were rushing to build these MCP servers.
  13. 00:51MCP apps are less familiar concept.
  14. 00:53They've been around also for some quite some time uh more or less uh since the uh the end of 2025.
  15. 01:03But when I talk to companies and people in general, I see that many people don't understand what they are and don't understand they can build them.
  16. 01:10And uh specifically, they don't know how to distribute them.
  17. 01:15MCP apps, but also they don't know the new way to distribute MCP servers as well.
  18. 01:21So, I hope by the end of this talk you going to know about this and you're going to be ready to build your first or iterate on your MCP
  19. 01:28uh server and app and you're going to be able to share it with the world in a more efficient way brings you more customers and more users.
  20. 01:38A little words about me and the Manufact uh my company.
  21. 01:42Uh we build open source SDKs and the tools for MCP and MCP cloud uh of the Manufact.
  22. 01:50Open source SDKs uh by the name of MCPUs uh allow developers to build servers um
  23. 01:57[clears throat]
  24. 01:58clients and agents in an easier way.
  25. 02:00So, we provide an abstraction over the official SDKs that allows developers to ship faster without worrying about how the spec works beneath.
  26. 02:08We have 8 million plus downloads across our SDKs, and we have 10K stars on GitHub.
  27. 02:15Also open source, uh the other product is the inspector.
  28. 02:20Uh it's an open source inspector, again, uh something comparable to the official inspector from the model context protocol maintainers that allows you to test these MCP servers and apps specifically
  29. 02:32uh on your local machine.
  30. 02:34Once you build, once you test it, we have built the cloud for you to ship.
  31. 02:39The Manifold Cloud is a cloud vertical for MCP.
  32. 02:41We provide all the primitives for you to be able to ship MCP servers from your GitHub repo and test them immediately, share them with your team, run emails, run publishing checks to make sure that your app is ready to be put uh submitted,
  33. 02:55and many other features that are completely specific to MCP.
  34. 03:00Of course, we really believe in MCP.
  35. 03:03So, let's look uh a bit in the history of MCP and how did we get there.
  36. 03:07So, MCP was launched in 2024, and by the end of uh May 2025, Idel Solomon, the other co-founder, started working on MCPUI, which is this way to kind of MCP servers
  37. 03:18that return UI components.
  38. 03:21Then, uh this was like many many people started talking about MCPUI because this is like such a great opportunity to ship UI with your MCP servers to agents.
  39. 03:30So, it is interactive experiences where the agent is calling tools, but it's showing UIs to the user.
  40. 03:37This created a lot of movement.
  41. 03:39Many people enjoyed uh this proposal, and the ChatGPT at some point released the app SDK, which is a way to create these interactive MCP apps.
  42. 03:50So, basically MCP servers also return UI elements.
  43. 03:55Also, at the end of 2025, quite silently, both Character AI and Cloud released and opened their stores for MCP.
  44. 04:05These stores allow you to submit your MCP server and have [clears throat] a one-click install experience for your users.
  45. 04:12For the most time, these stores were closed in such that were um designed and only allowed for design partners.
  46. 04:24But things have changed, and I'm happy to talk about this later.
  47. 04:29In January 2026, MCP UI I say converted to MCP apps.
  48. 04:37MCP apps is now the official extension of the Model Context Protocol that allows to return UI elements within MCP servers.
  49. 04:46So this timeline is kind of an explanation of how the protocol evolved.
  50. 04:49And I think still I think two major things happened in this timeline.
  51. 04:54First, MCP apps.
  52. 04:56MCP servers are not only returning JSON.
  53. 04:59And that allows much richer experiences.
  54. 05:02And the second thing, maybe even bigger, is that the stores opened.
  55. 05:05This was a great uh a huge move by the model providers probably OpenAI, Perplexity, and basically every LLM client out there to say, "Oh, MCP is the way and we [clears throat] want to have a way for people to publish
  56. 05:22vetted and quality MCP servers so that people can use them with a one-click install experience."
  57. 05:31This is the situation right now with the stores.
  58. 05:34The uh that are now being submitted to Character AI and Cloud apps for Character AI and connectors for Cloud increasingly being accepted.
  59. 05:44As I was saying in the beginning, this was uh each one of them was gated behind design partnership because the ecosystem was very young, but now it's a GPT and called are both accepting more and more apps.
  60. 05:56So, this is a uh this is the moment to publish yours.
  61. 06:01So, let's see what MCP apps actually are and what you can do with them.
  62. 06:09So, an MCP app works in the in the following way.
  63. 06:11Uh much of this is very similar to MCP.
  64. 06:14The model is a in the host owns the tools.
  65. 06:20The tools are in a MCP server.
  66. 06:23But, the MCP server in this case doesn't return a JSON string again, but it returns a widget in a sandboxed iframe.
  67. 06:31So, the experience you see is your model is a streaming text.
  68. 06:35At some point, it decides to make a tool call, but the tool call is not just returning JSON, it returns a UI just underneath.
  69. 06:42And this UI is a sandboxed iframe, so you can as a company developing these apps, you can put almost whatever you want.
  70. 06:50But, it doesn't end there.
  71. 06:52Actually, there is a bidirectional communication that happens between the iframe and the host application.
  72. 06:57So, from the iframe, from the MCP app UI elements, you can send messages back to the host.
  73. 07:03You can interact in several ways.
  74. 07:05I'm going to talk uh more about that uh later.
  75. 07:09The way this works is that MCP uh declares UI resources at initialization time.
  76. 07:18When the model calls the tool and it populates the arguments of the tool, uh the tool can then populate the arguments of the UI resource, and that can be then displayed and rendered by the client.
  77. 07:32As you see here, this is the kind of experience that you can see in an MCP app.
  78. 07:36The MCP server returns tool returns uh UI resource that is populated with the tool arguments.
  79. 07:44And here you see.
  80. 07:45So, without UI you would see like a wall of text.
  81. 07:48The UI allows you to organize the information in a more human readable way.
  82. 07:53So, this is uh is a like the basics of MCP ops.
  83. 07:56Uh I think they're many many times uh they've been talked about.
  84. 08:01And today I wanted to show a bit more of what you can do because this is not often mentioned and I think it's very interesting to design new experiences
  85. 08:08which this new protocol allow.
  86. 08:17So, first of all, again, the UI is displayed in the chat and it exposes a communication channel between the UI element and the host application.
  87. 08:27So, the host application will listen for these messages going through these channels and will react accordingly.
  88. 08:34So, this is the first primitive that I'm going to talk about.
  89. 08:36So, model context.
  90. 08:38In the UI you can show whatever information you want.
  91. 08:40For instance, in this case we're showing three articles, but the model doesn't really know it doesn't really cannot really uh introspect in real time what is going on in the UI.
  92. 08:50But the protocol mandates this state uh or this set state primitive where you can update the state of the model with respect to the UI components.
  93. 09:01So, from the widget itself you can call this is an MCP use syntax that makes this a bit easier, the set state primitive, and you can update what the model knows about what's being displayed.
  94. 09:14So, here we have a little demo that shows this.
  95. 09:17Of course, uh the the the message uh prompts the tool and the tool shows the UI.
  96. 09:26The state uh of the of this UI element is that nothing is selected and the model knows about this.
  97. 09:33But if you modify the UI state, you can communicate this state change into the model itself.
  98. 09:40So, then basically, if for example, here I send another message, the model will be aware of what happened in the UI element.
  99. 09:48And you can do this by simply setting this using this uh um this primitive set state and update the state that the model knows about.
  100. 10:01UI message.
  101. 10:02So, this is another very cool feature where from the UI element the UI widget that your tool returns, you can send messages back to the model.
  102. 10:12So, not only the interaction is I am a user, I have my chat interface, I see the UI, and I want to send another message.
  103. 10:20Or maybe there is some contextual message that you can you want to send.
  104. 10:23For instance, here we have the same shoe example, and you might want to learn more about Trey Blazer Pro.
  105. 10:30And uh you can of course link the click of this button learn more to the primitive send follow-up message, and this will send a message to the chat itself, and the model can start giving you more information about the Trey Blazer Pro shoe in this case.
  106. 10:45Um clients have different behavior regarding this, and this is true for many of the MCP features.
  107. 10:51For instance, Cloud will display the message in the chat input and tell the user like the user has the choice to send it or not.
  108. 11:00While OpenAI is a bit more integrated in this sense, it directly sends the model the message to the model and uh and starts streaming immediately the answer to that message.
  109. 11:17This is a very cool feature.
  110. 11:19Uh so, again, we have the tool, uh and uh we have a UI element that's populated from the tool itself, right?
  111. 11:26If the model streams the input tokens into the tool arguments, you can uh in live take those partial input and update the UI incrementally.
  112. 11:39So, as you see in this case, we see that the the the the tool inputs are being populated uh dynamically or gradually, and the the UI reacts accordingly.
  113. 11:51I have a very cool demo about this just later in a video where in one of the coolest demos of MCP apps uh in the uses exactly this pattern.
  114. 12:02So, you can, for example, imagine like uh you could have a UI component that renders something like an SVG, and there is MCP uh MCP apps doing that.
  115. 12:12We also seen uh we actually created a Remotion MCP app where uh we use Remotion to create a video with React, and uh we render the Remotion video inside
  116. 12:21the widget in real time as the tokens are streaming in.
  117. 12:27Another thing you can do is from the from the widget itself, you can call other tools.
  118. 12:33So, first of all, you can call the tool, of course, uh in the in the in the tool that was originally called to gather other data, but from the UI, for example,
  119. 12:44you can have a button that triggers another tool call to gather additional data about what what is there in the MCP server.
  120. 12:53Again, the primitive is very simple.
  121. 12:55This is code on the left here is always um from MCP use.
  122. 13:03This is another very interesting thing that you can do with MCP apps.
  123. 13:07So, sometimes uh what happens is uh for instance, you uh want your MCP server to return certain informations, but you want to um not show the full information because maybe is uh
  124. 13:20there's private information that you don't want to give to the to the model providers, and therefore, [clears throat] you might want to redact that right?
  125. 13:28This is like a known privacy issue with MCP servers that you don't want to return and put into the uh
  126. 13:34[clears throat]
  127. 13:36your private information.
  128. 13:38And MCP uh also allow you to do that.
  129. 13:41So, when you call a tool, you return a widget, which is populated with some arguments.
  130. 13:46You can return other outputs as well.
  131. 13:50As in normal MCP servers, the the return of a of an MCP tool is list of outputs of different types.
  132. 13:58You can imagine in this case, there is a structured output, which is sent into the widget itself.
  133. 14:04And there is an additional output that can be sent directly to the model.
  134. 14:08So, something common that you do is you show a very rich UI, like in this case, and uh and this is what the [clears throat] UI will show.
  135. 14:15So, this is a card showing the information private information of of this person, but the model will only see the information you want.
  136. 14:23So, there's two types of output, the ones that are shown in the UI, to put it simply, and the ones that are sent to the model.
  137. 14:31Like a common to maybe understand this better, a common pattern that you see is you show the full information in the UI, and then you instruct the model with a text output
  138. 14:42of what the user is seeing.
  139. 14:45For instance, we return a uh this this UI card, and we can even return um nothing to the model.
  140. 14:57But just say, the user is seeing his private information in the widget above.
  141. 15:03So, this is a pattern that allows you to, you know, give uh allow it like uh experiences in in fields where maybe sharing data to the LLM is not possible
  142. 15:13because of privacy issues.
  143. 15:14In this case, you can show the UI to the user, but the model won't see the data that you display in the UI, unless you choose so.
  144. 15:23There's uh another set of functionalities which I think are minor or let's say less
  145. 15:30[clears throat]
  146. 15:32intuitive or less advanced.
  147. 15:35Uh Here we show the request display mode which basically your MCP app widget is displayed in uh in line with the tool call.
  148. 15:44But it can even put the full screen.
  149. 15:46So the full chat is going to be your MCP widget and uh input box is going to be overlaid on top of the widget.
  150. 15:54And for instance, this is very cool for video editing.
  151. 15:57You can imagine a a widget showing some uh graphical interface and uh you can chat that we improve the the what's the shown inside the widget and the model can directly stream into the widget you're looking at.
  152. 16:09It can also be put in a picture-in-picture or in line which is the normal case.
  153. 16:14Um
  154. 16:14[clears throat]
  155. 16:14there's a other primitives that allow you to open external links from the MCP widget itself.
  156. 16:21[clears throat]
  157. 16:22You can listen to the theme of the OS so that you know your MCP app is synchronized in theme with the host your users are using.
  158. 16:30And there are many other things.
  159. 16:36So I wanted to show you here a few videos of MCP apps because so far I've just been showing uh uh uh some mock-up that I created for this presentation.
  160. 16:45Uh but this is for example in Cursor we're using the MCP app.
  161. 16:49Uh Cursor is one of the clients uh that supports MCP apps.
  162. 16:53And as you see here uh our MCP app returns the analytics of the remote MCP server app that I was uh talking to you about just before.
  163. 17:01And for instance, this is very uh useful in in analytics.
  164. 17:06Uh for instance, we use Pulsar MCP a lot and then the Pulsar MCP will show you a UI element with your with your analytics.
  165. 17:13So that you as a human can understand what's going on, but the model itself can read those analytics and go do its job on the code you're you're writing.
  166. 17:22Um on Claude, so this is the demo I was telling you about.
  167. 17:27So, here we're using the Excalidraw MCP server, and here you will see the streaming functionality that I that I mentioned as before.
  168. 17:34So, you can see here that Claude is first reading the some instructions that are returned as tool by the Excalidraw MCP server.
  169. 17:44And uh at some point it will call the tool which is showing the canvas, and it will stream tokens into the canvas, and I think we motion it's one of the coolest
  170. 17:53animation around how those tokens are shown.
  171. 17:56As you see here, this is like a mermaid syntax that is sent into the tool, and the the UI updates as the tokens are streamed in.
  172. 18:05There's some of the some of the coolest demos here.
  173. 18:09By the way, very very useful to draw diagrams as well.
  174. 18:13Um and this is again ChatGPT um uh using the Manifold uh MCP app uh showing the same analytics that I was telling you above.
  175. 18:24And as you see here, the rendering is uh is is a bit better in ChatGPT uh it's better.
  176. 18:31Basically, this is very similar to how it uses.
  177. 18:35Maybe uh this is a good time to talk about the client support.
  178. 18:38There's many clients that support MCP app.
  179. 18:40Some do more, some do less uh and uh these three I think are the main uh that people are using.
  180. 18:49And uh of of course, all the different versions of Claude and ChatGPT uh so both Claude Co-work, Claude Desktop support MCP app, ChatGPT and Codex support MCP app.
  181. 19:02Uh and Cursor uh both in the
  182. 19:04[clears throat]
  183. 19:05agent mode and in the normal side chat supports MCP app, but there is uh many more that support MCP app such as VS code and and and comes as others.
  184. 19:15And I think it's actually interesting to to mention here uh that another thing you can do you might be developing your MC server and uh you don't know if the host where your users are using the MC server supports or not MC [clears throat] apps.
  185. 19:29What you can do is uh since we know what the client is from the metadata that is exchanged uh uh the MC app uh you can um return a UI element only for those
  186. 19:42um host that actually accepts and can render those um those uh widgets.
  187. 19:49And then this is not really a big deal because most uh non-MC app clients so uh MC client that don't support MC app will not will simply not show the widget.
  188. 19:59But I found developing these servers many times that if you don't show the widget, you need to return a different output because um it some of the information was returning the widget but maybe you want to give it to the model if the widget is not shown.
  189. 20:14Uh so this is something also MC user helps you with with some primitives that um that allow you to to know if the client uh your MC server is connected to actually supports MC apps or not.
  190. 20:30Again, um a little uh idea of how you can build these MC apps with MC users.
  191. 20:36We are one of the most popular SDKs to build these uh MC apps.
  192. 20:40The way we design our SDKs that basically you design your MC server uh as you always did.
  193. 20:47So you have your MC server constructor and then you define tools.
  194. 20:51And from the tools, you can simply return widgets which are automatically registered from this widget file in the resources folder.
  195. 21:02So whatever you put as a widget file in the resources folder will be registered as a UI resource that you can return from a tool.
  196. 21:10And the widget um the widget file is just a React uh component uh and you can also use your existing uh UI components.
  197. 21:20And uh it will be compiled into HTML and CSS.
  198. 21:25[clears throat]
  199. 21:26And then um returned and linked it to the tool.
  200. 21:31We have a scale uh we have a template.
  201. 21:33Uh you can just run NPX create MCP app and uh it will give you a template that you can serve.
  202. 21:41So, let's talk about distribution and discovery, which I think uh it's uh of course a very important topic.
  203. 21:47Uh maybe uh even less known than how MCP apps work.
  204. 21:50I'm talking to many people and they don't know there's a store for MCP and they don't know how to submit, so I wanted to talk about a bit about this as well.
  205. 22:01So, the store is like a huge new distribution channels.
  206. 22:04Again, you're um bringing the three most popular clients, ChatGPT, Claude, and Cursor, which the three of them, they all support a self-serve submission process.
  207. 22:15ChatGPT was one of the first supporting this.
  208. 22:17Claude, uh since a couple weeks they have um self-serve submission form for team and enterprise uh accounts.
  209. 22:24[clears throat] And also Cursor allows you to submit their MCP server set uh The way you submit is different for all three, but basically what happens is that you need to make sure that your MCP app is compliant.
  210. 22:41MCP apps or servers can be both uh submitted in all these three stores, so you it doesn't need to return a UI your your server to be eligible for submission.
  211. 22:49Um and the three processes to get your app submitted is different and they have different speed.
  212. 22:54So, it's going to take maybe a bit more on on Claude uh for now uh and uh ChatGPT instead is it's up a lot the acceptance of these uh of these apps.
  213. 23:04And again, the process is you link your remote MCP server.
  214. 23:09They will scan the tool.
  215. 23:11And they will make sure that all the tools are correctly annotated.
  216. 23:15And have the correct arguments and um And once this is done, they're going to scan the the authentication as well.
  217. 23:22So, if your server requires authentication, you have to declare it and you need to make sure that it works.
  218. 23:28There's a few more different steps which are details for all the all the providers.
  219. 23:33Uh but it's important to say that once your app is submitted, it's going to be partially manually or partially automatically tested.
  220. 23:40So, you will have to provide some test cases and some test prompts.
  221. 23:44And then it will be either accepted or rejected.
  222. 23:49And if accepted, you're going to be able to publish it and make it available on the stores that you can find on chadigpt.com/apps on the connectors directory on uh cloud or on the
  223. 24:03[clears throat]
  224. 24:03the cursor directory.
  225. 24:06Again, we we we did the many submissions and we we try to make this process easier.
  226. 24:12So, if you want to submit your app, I think you should go to manifester.com where we vet your app to make sure that it's um ready to be submitted.
  227. 24:21So, we check and we try to do all the checks that those clients will do in the submission process.
  228. 24:26And also, we run we generate some of the submission artifacts that you need to submit like screenshots and test cases for you in in our cloud directory if connected to your MCP server.
  229. 24:40Something very very cool about this is that once your app is in the store, not only can people find it by searching on the store, not only
  230. 24:48[clears throat]
  231. 24:48you can send a URL to your customers and they're going to be able to install your application in one click.
  232. 24:54So, you don't have to share that ugly JSON file anymore with your MCP configuration.
  233. 24:59But it's very important that dynamic discovery of MCP server is happening.
  234. 25:04Today Cloud is the only client that actually does this, but for all apps in the stores, when Cloud needs is like assigned a task that doesn't have a specific tool to do,
  235. 25:16it will actually search in the MCP registry for the right connector to do the task.
  236. 25:22So imagine what this means for your particular product.
  237. 25:26All the people There's many of course active users on those applications or more than billion active users, which will manifest an intent directly in the chat and through the intelligence of the model, the model will choose what is the best connector.
  238. 25:42And if you're there, and you do your work to be the connector that is selected, this is going to be like a a huge wave of uh high intent individuals
  239. 25:56that want to need your product and will find it uh dynamically and organically on those on those platforms.
  240. 26:04So this is very important.
  241. 26:07Cloud does this today and [clears throat] ChatGPT is expected to do this pretty soon.
  242. 26:15So that was my discrete descriptive part of the talk.
  243. 26:19I just want to uh uh I think it should be clear by now how important it is to be on the stores.
  244. 26:29I can bring my experience.
  245. 26:31Being on the store brought us a lot of traffic.
  246. 26:34Personally, as a user of MCP, today I'm checking if a product has an MCP server and that's for me is like the most basic buying decision.
  247. 26:43I run most of my day-to-day work on Cloud Co-work or Cloud Code because I love the the the possibility to share the context between my code base and my different connectors.
  248. 26:55And this to me is so important.
  249. 26:58For instance, one workflow that I that I often run is I have my Granola MCP where I have my meeting notes.
  250. 27:05I have Linear where I track my tickets.
  251. 27:07Of course, I'm in my code base if I'm using this from Cloud Code.
  252. 27:10And I can basically pull the meeting notes with some customer feedback and feed it back in the in Linear maybe I create tickets for the rest of the team.
  253. 27:18And then I have the agent that pulls the Linear ticket through the Linear MCP and just starts doing it.
  254. 27:23Opens the PR.
  255. 27:24And uh and uh and closes the Linear ticket.
  256. 27:29And uh I mean, in an ideal world, it would even send an email back through MCP to the customer saying, "Oh, this is fixed."
  257. 27:35But maybe we're not there yet.
  258. 27:37Um but uh but this is definitely true.
  259. 27:39And in fact, just a few days ago, Paul Graham, uh the founder of Y Combinator, said, "Uh AI apps are the new browsers."
  260. 27:47And in this case, uh the AI apps are Cloud Code, Codex, Cloud Code Work.
  261. 27:53And I fully agree with this.
  262. 27:55If you think about it, Google Search in a way has been substituted by looking on ChatGPT.
  263. 28:02So, now that we have connectors where you cannot only search, but you can also do stuff in the real world,
  264. 28:09[clears throat]
  265. 28:10all those all those um operations are going to be moved to the chat as well.
  266. 28:15So, in a way, I think uh that if AI apps are the new browsers, the ChatGPTs are the new websites.
  267. 28:22And uh as a website, they can return a UI with MCP apps.
  268. 28:28So, again, uh I don't want to look at your dashboard anymore.
  269. 28:32I want to use it in Cloud.
  270. 28:34And if any dashboard, I want to see it in the Cloud Code application.
  271. 28:38So, ship an MCP app.
  272. 28:40Thank you very much.
  273. 28:40I hope you enjoyed the talk and I'm uh hope there is any questions about this and super happy to help.
  274. 28:46Um by now, have a very uh expert on the topic.
  275. 28:50So, thank you very much.
  276. 28:52Have a good one.