Creating Frames

gm farcaster and welcome back to farcaster 101 this is module 4 and we're going to talk about creating frames within farcaster in a number of different ways from the very simple of just sharing a link to the more complex using things like nana or frame studio or really diving into the development options so let's get started here i'm very excited to dive in and we are going to talk about reviewing some frames and what they are what are frames created with links creating no code frames and the frame development guide just as a reminder if you've just found us and this is your first video that you're like i have no idea what's going on you're really going to be a little lost so step back step back to module 3 at least if you're just wanting to learn about frames and you're familiar with farcaster if you are brand new to farcaster and have no idea what this is please go back to modules 12 and get a little bit better foundation before diving in so farcaster frames are a way to build interactive apps that run directly in a farcaster social feed that can be used to create rich in feed experiences for web applications we're going to demonstrate a few of those and how you create them right now so we're going to start from very simple frames from links for some of the applications that have developed and integrated frames you can take a link from their website drop it into farcastr share it there and it magically becomes a frame i like to say magically because i'm the less technical of the 2 of us yes i do so what's really happening the little if you can add a little bit of the technical background what's really happening there adrienne behind the scenes with the open graph protocol it is just it's a link on mashicam of your photo in in the

so essentially when you're looking at this it's going to allow you to mint within this frame

and you can click further down and this one this particular frame will allow you to mint with warps so if you go back to i think it was our 1st or second or both modules we talked about warps as one of the in app currencies that can be used within farcaster it is the currency that was created by the merkle team to be used only within warpcast and it does not change in value it has no speculative value and it has various use cases one of being minting nfts or things like mochicamp so you can mint directly in this little frame as well as if you go back to the original frame you can also view this on moshecam and go right into their app if you prefer that viewing experience that would allow you to see other ones

by adrian or create your own moshi etc so it does have other options you can play around with alright moving back over here so this is a very simple way to create a frame you're going to go into moshi create your picture you're adding it with this kind of fun frame around it border around it maybe adding some stickers taking that link and just dropping it in and then in the background all these magical things are happening so a lot of fun we love moshicam go check it out

so if you were at an event for example there was a bunch of you altogether you can post this and everyone could mint it and save it to their own wallets and for a very minimal fee so i think it's 50 or 60 warps which is like basically 30¢ i think is where it ends up and then we go into other types of nft minting that's available so zuora.co and other nft creation sites like manifold.xyz and highlight.xyz are also compatible sites that have optimized for frames so you can cast a link that will drop a frame in your cast allowing for minting directly in your feed for gm farcaster for example we put everything all of our episodes on zuora if you collect this it will actually be the video of that particular episode that we did earlier today and you can mint it right within your feed so i'm gonna have adrienne demonstrate that and adrienne what does it look like to what kind of transaction etcetera comes up when you're minting on within a frame

mhmm

that's a really useful way to be able to mint an nft right on warpcast it does go into your wallet whatever wallet that you mint that to automatically automatically i think i'm gonna say automatically and but you can also then just link back out to the site if you prefer if that is more comfortable for you but you can see that simulated transaction to make sure that you are safely using your wallet within the frame okay so moving on to some things that have a little bit more beef to them composer actions so adrienne composer actions are a little different because what you're doing is starting with a cast and you're then using a button to then create

a frame in that cast automatically and maybe even completing some information to get that ready so adrienne i'm going to let you take it from here and show us what it's like to use the composer action and create an event using eventcast event dotxyz's composer action

alright so let me add you back up here if you're ready take it away

correct make sure it's e t i have made that mistake often

and everything looks pretty good

you can change the image

fantastic so there you go it's like magic and there's a few other composer actions that are available as well and adrian if you can pull up another one just open up a new cast and just show maybe bounty caster just so that we can demonstrate and give a look to one more of these composer actions fantastic

on the fly bounties on the fly what do you wanna do today

how about feedback for our forecast or 1 on 1 series maybe give a little like best feedback award maybe it's like i don't know a dollar per feedback post that's substantive or maybe 5 up to you

you can tell we did not rehearse this part we'll get it done with this other line but i love it

no no that that's fine i love it so do we wanna limit this to like 10 or something

best or something like that

1 per 1 per person 5 entries sure alright

you can also use the bounty bot you can sort of call to bounty bot and just tag them in a cast and they will create the bounty for you as well so another little magic piece of farcaster which i find very fun

right correct so a little different

exactly so composer actions being one of them all right so let's head back over here

and so that was composer actions we also have mini apps so we can launch mini apps as well from frames and there's a couple of ways to do this and one example of this is paragraph so i'm going to demonstrate how you do that within paragraph.xyz you can use this blogging and newsletter site to write up a blog post and then just take the link to the post and you'll see it's a pretty dynamic platform we can add in we added in all of our videos you can watch them right within that site for this particular week we do a weekly roundup of all the things you can subscribe right here and collect so everything is on that site and then we're going to take the link drop it in just copy it paste it into a cast and it's going to look like this so i can add a little bit to my cast to kind of introduce what it is i'm sharing and then you can click on read and it's going to open up the reading experience for you which will look very similar to the site but stay within the frame of orbcast so you can go ahead and read that experience everything dynamically right there same as you would on the site and as you scroll down you'll see again all the information that we just saw on the site as well okay so that's another very simple way to create a frame that you might be doing anyway so if you have a brand and you're doing some kind of newsletter or blog posting on paragraph anyway this is a really nice feature to be able to drop it in and make it very accessible to those who are reading it on webcast

alright and we also have some more fun mini apps so that's kind of where informational mini app and then we have the fun game mini apps so right now 2 that have been developed by matthew fox is flappy caster similar to flappy bird and also a trivia game which actually goes live at certain times and you get to play live with a video feed where they host and it's a lot of fun similar to hq trivia so for flappycaster you can actually drop the link to flappycaster.com and it will create a frame for you to play so you can do that or if you're on mobile and you go to the explore tab on mobile you will see it right there and you can just launch it on your phone but if you're on desktop or on web you can go to the website and then just drop it in a frame to play within warpcast so adrianne had already done this earlier if i click play now it's going to launch the game you'll see it's now logged me in i didn't have to log in i'm right there because i was already logged in to warpcast so this is part of the social graph that we've talked about before this is the leaderboard you can see the leaderboard on here and you're gonna be able to see the farcaster usernames so you could go and sort of have a little bit of a rivalry with somebody maybe challenge them something like that you can see all of that and then you'll see i am horrible at this game you can also share it and it will create a frame where you're sharing the game itself and then you can actually play your game so here we go this is going to be horrible i'm gonna warn you right now i am awful see there we go at least it was quick you can share your score and it will create a frame for you to share your score should you actually be proud of your score i just scored 0 points we will not share that cast but you get the idea and what the reason we're sharing this with you is not just because it's something fun you can do on war cast but it may give you some ideas of other games or experiences that you wanna create for your brand or other ideas that you may have so that is blobbycastr okay and moving on if you want to create something a little more customized not just grabbing a link and dropping it in or using a composer action that has already been created for you which are sort of the simple experiences you can create a no code frame using nayanar's no frame studio and it's super easy to do even for those who are not too technically inclined so in other words if i can create it you can and this is what was used for the state of barcaster frame by snickerdoodle so we showed this in the last module but i'm just going to review it again to give you an idea of what this looked like in case you don't remember this was a simple way of sharing some of the data from their data forecaster 2024 report and as you scroll through you see a lot of the really interesting statistics like the user growth cast activity cast frequency all of these really interesting stats the popular chains that are in use on farcaster farcaster and base have been growing together i would say and base has been very supportive of the builders within the farcaster ecosystem so you see a lot of activity on base but other other chains as well and you can see the tokens that are held by unique holders lots of different cryptocurrency there demographics

and other information there and then as i showed before you can download the report it will link you out to their website or share it which will create a new cast for you to share the report with your followers so this is the type of thing that you could create yourselves using the nanar frame studio and the way i know that it came from the nanar frame studio is this link down below so below the frame you will see the source of that frame in this case it's frames nanar.com

we're going to take a look at the nanar frame studio there is a fee to use this so it is fairly low you can get started for $4 a month if this is something you want to dive into and like i said you don't need a huge amount of technical background to be able to do this and it will it has a lot of different options here there's also a cast action a composer action to create a very basic

photo frame so that's already built in and that is free on warpcast but this gives you a lot more options turning any web page into a frame slideshows again that's already built into the composer actions framepception so that means a frame within a frame remixing frames if there are frames that are open source you can take what someone has already done and remix it for your purposes so you're not starting from scratch built in image compression mint with warps analytics and you never have to touch a line of code so here's a few examples of some other frames that people have built as well as the one we just showed you and you can learn more here as well as lots of documentation and assistance here also the team is very helpful so if you are interested in diving in more they are very accessible and able to help and if you see at this top right here where it says slash nfs that's going to bring you to the

channel nfs which is nina our frame studio on warpcast

and lastly let me also show you if you really want to dive in if you really want to develop something from scratch you have a unique idea that doesn't fit into nana r frame studio or one of these other options this is where you want to start you want to go to the farcaster docs so that's docs.farcaster.xyzdevelopers/developers/frames

and this is really going to walk you through all of the technical aspects of frames and help you get started so this is a if you have a much bigger idea in mind this is where you want to go it will walk you through how to do this how to test it how to deploy it and all the different specifications regarding frames anything you wanna add here in terms of frames in terms of the technical side adrienne

provides all sorts of infrastructure that if you want a

i think we covered it yeah

so i think that is it for frames for the background which we did in module 3 and creating frames in module 4 next we'll be diving into farcaster culture and all that entails that'll be a lot of fun so that'll be for modules 56 we'll be diving in more into that and i'm sure you'll be seeing lots of frames in relation to that once again so the reason we had frames sort of as our next you know modules 3 and 4 right after we sort of did our introduction and got you started onto far caster was because it it plays such a large role in the culture in everything else we do on far caster now you're going to see frames popping up all over the place and we wanted to make sure that you were familiar and understood what was going on there and if you were a brand or even just a builder of some sort who wants to share things in a frame we wanted to make sure you had the tools and understood everything that was available to you and i think that's it adrienne anything that i missed that you wanted to cover before we wrap module 4

great and we will see you for the next one on module 5 and for now bye bye