All About Airtable's Page Designer App

[00:00:00] Aron: All right. Hey friends, welcome to everything you can do with page designer. I'm seeing a lot of familiar faces in the chat. Uh, so yeah, really excited that you're all here. Uh, let me know if you're, uh, if you're new here, he, Jeremy, he Raymar UUNET hopefully I'm saying that, right. Uh, uh, Colleen, uh, w Ash, welcome.

Appreciate the tips before I kick this off. Uh, so actually the first use case we're doing is a request from Ash. Uh, so yeah, I'm really excited to do this stream. I gotta say, this is, uh, uh, everything about page designer was a stream I've been, I've been wanting to do for a while. And the reason I haven't done it is because I am a terrible designer.

So, uh, I'm going to build a bunch of pages today. Uh, we're going to struggle through this together. And I will be asking your help to make these nice. Uh, so, uh, yeah, let's kind of kick this off. So let me know in the chat, if you've got requests, uh, if you've tried page designer and weren't able to get something, if you have any kind of things that you're hoping to do, uh, but disclaimer, terrible design.

Yeah. Uh, and we're going to keep it very simple and I'm looking to lean on all of you, uh, for help in making these look much nicer. So, uh, yeah, let's talk a little bit about our agenda. So I'm going to start off with what is page's diner. It's one of those apps that, uh, might not be so clear what it does, but once you.

Figure it out or see someone do it. You're like, oh my God, I can use this all the time. And I've got kind of a three use cases prepared for you all. We're going to start with how to do a project updates and then we're going to do invoices. Uh, the third one, uh, is video thumbnail, which is actually how I create the video thumbnails for automate all the things.

And, uh, yeah. Page designer. Let's actually just go into, uh, our apps dashboard and just go into all pages. I R I'm going to share this template out. So if you write out a exclamation point base in the chat, it gives you a share link, uh, that you can use to copy these pages on errors after the stream. Um, so.

Let's go into, add an app. Let's look at page designers, just get some feel for what it is. And before I kind of add up and create some let's look at some examples. So you can create an invoice. You could do a little real estate listing, and what's important to understand about page designer is that you can take information from it record and put it onto a page to create a slide deck.

So you're going to have one page for each record in your team. So in this example, right here, let's say we have 50 really listings that we're managing from, uh, our air table base. We can go to our listings table and have all of the images for that listing its name, its price, uh, information about buyers that are interested in that listing.

And then we would have one slot. For each record for each listing that we have in our table. So all we do is go ahead and fill out our base, just like we would for any new listing. And then we have a page and this is great. So if you're inviting folks, if you're talking about the listing, you can print out the PDF.

I know that there are some limitations around pages on there that we're going to get through throughout. Uh, but the idea is turn your information, right? So these records into something a little more digestive. Easy to use, easy to understand and sometimes easier to share. Right. Um, so we've got some, uh, uh, ex questions in the chat.

So some folks use it to create PDFs, uh, and that base is not working. So let me go, oh, there it is. Who took a little bit of time? Uh, awesome. Hey penny. Uh, Hey folks. Uh, yeah. Okay. Any, let me know if there's any questions about what pages it is, but I think as we create a few, you'll really get a grasp of what's possible, uh, within pages, diner, and again, terrible designer here.

So bear with me as we create these. Okay. So I have three use cases for you. Our first one is to have project updates. So let me start with the base structure and then I'll go into, uh, uh, And then I'll go into, uh, um, the actual project update. So let's imagine we have projects. I have three projects managed by three different people that start and end at various dates.

There's an image related. Maybe we want to create this landing page. Maybe Colleen is responsible for, uh, this little, uh, Uh, you know, sofa, whatever it is, and those are related to tasks, right? So each project has a set of tasks and I've just got a rich text field that says, you know, what are the underlying tasks for that kind of sub task, if you will, for that to be completed and what project it's related to, again, very simple.

We can make this ask. Or as simple as I want, and maybe what I want is just a slide deck. So I can update folks on the status of each one of these projects in each of the underlying tasks. Let's actually go ahead and click off a few of these, right? Just so we get a sense of where things are. Okay. And so instead of kind of updating folks just through, Hey, you know, project one, project two in this grid type way of looking at our world, let's create a page designer that gives us a page for each project and the underlying tasks.

Okay. So I'm gonna go ahead and add an app. This is where I get terrified of actually designing this thing. Okay. So I just added a page designer into our dash. And for some reason it's taking some time.

That's weird. Let me refresh that.

Who I think the problem is my wifi.

Okay. It opened up over here. Hopefully that'll get fixed. Okay. So first, like most apps it's telling us, what table do we want to associate with? So we want one page for each project that we're going to go ahead and select projects and didn't ask us the size so we can create something, narrow, something that is, you know, printable eat by five by 11.

We're actually going to make this. Right. What I like for my project is just maybe a header at the top that says who's responsible, what the status is. And then a second section with each underlying task and it status. I don't necessarily need this to be a specific 18, 8, 8, and a half by 11, I think. Uh, so let's make this about 600 by, I dunno, 800.

Right. Just make that done. Let me actually look at it like this. There we go. Let me zoom out. Here we go. Okay. So right now we just have a blank page. So we just have a blank page for each record. We have three of them for our three projects. So let's start adding things, right. So I can go edit layout. And then I have two kind of generic options.

So these are texts and image. And then I have the list of fields from the T. I'm connected to, to this page, the center. So let's start with kind of the, and this is something I've learned from working with amazing folks from the air table team, namely Holly, uh, about working with pages, enter it, start with not the fields, but just kind of the layout of what you want this page to look like, and then add in the fields.

So what we want is two sections. I want a green background, so I'm gonna go ahead and add an image that is the size of the page.

That is filled with green. So I want to fill this, sorry. It doesn't really matter. Cause it's not. We want this to fill. There we go. Let's make this a nice little green. Now you see again, let me know if that can make this any look any nicer. Right? So now we have a green background, uh, and then I want to add a second kind of box at the top with project details like this.

Right. And let's make this white boom, let's give it a little border, man. Just saying those words on the stream is a little stressful to me. Uh, let's give it five and then I want a border across all five, three, right? Um, yes you can. Exactly. So Ash mentioned you could layer things on top of one another and that's exactly right.

So I can say if I'm creating something and maybe this ends up in the. Behind the green. I can actually bring it to the front and I'm laying out my page and these are going to be elements across every single page for every record what's going to change. Is those elements that come from the record that we're going to add in, in just a moment.

So at the top here, I want this to say kind of project update. Let's make this a little larger. I think I'm on Montserrat. That is my phone. L M N O L M. Yeah. Okay. Uh, Montserrat, there we go. Let's make this 18. Great. So now project update, and I want another section here with the tasks. Let's actually make this a tiny bit smaller boom, and in tasks at the bottom.

So now I'm just laying out the pieces of the pages. But not inputting the information just yet. So pro tip set up your layout first like that I can actually could have, I could have duplicated this one and made it a little larger, but let's fill this with white. Let's give it a border. The border here was three.

This one is three. Great. Okay. So I've got project update. I've got the tasks going to go here and now we can start adding elements from each record. So let's say I want the. Right. So owner is going to be like this I'm the owner for the first one. Now you see that changes with each record. Now that we're whoops, boom let's con ah, this is what happens when I try to do this live on the stream.

There we go. Let's make this a little larger. So if we have a longer name, it shows up. There we go. Okay. You can see that it's taking the information from the record. So the owner is Steven for the third project and it updates to you. Steven, let's give it a project name,

same thing. Montserrat. Give it 20. Wow. Oh no.

Okay. It's going to be the challenge of today is just selecting all of these. Font not set. I feel like designers are, you know, commiserate with this pain of selecting the right element on a page. Okay. What else should I add to the top? Right. So we've got in here start date, end date, those feel important.

Maybe the image was actually add most of those. Let's go back here. Let's go ahead with the layout. So start there. We have a lot to go through. So I'm not going to edit the kind of a font for each one of these like that.

So I can start adding little texts. That explains what these are. So this is start date,

right? And then let's duplicate this one. I think I can do control C now. I think there's a duplicate element right there. Boom.

Logo image. Yeah, absolutely. Let's go ahead and add the image. So project go into image. That's the name of the field? Right. So right here, I have the image field, which is, you know, maybe the outcome, the goal of this project to create that asset. Maybe I should have thought the use case a little better. So image boom can resize this like that.

Okay. So now we have. Are elements across each project. So in your weekly, you can say, okay, project one managed by Erin, here's the start date, here's the end date. Here's what we're going for. You can cycle through. And you're automatically creating one page for each item in your list. So relatively simple, right.

But extremely powerful. Uh, a way of visualizing your information in a way that's much more convenient and useful, uh, than when you're looking at it like this. Um, oh Anthony, great question. Pages. Arnar is absolutely available right now. So, uh, you can go to any base, go ahead and add pages on our, you can even play and kind of recreate this.

Uh, so here's the share link, uh, for the base. Right out exclamation point base. Uh, you can actually start playing around with pages. I diner in the same base that I am as we're streaming this. Uh, cool. Okay. So let me know if that makes sense. So we've got our information from each record, laid out in our project details.

Now naturally, what you also want, uh, or is extremely useful is to say, well, how are we doing on the tasks? Right. So you have this table right here, which has each task, all the information that you need to do to consider this task completed and what project eats associated to you. So you can almost think of this as a little table within this record.

So task one, test two, test three has all of this information, this little table right here. And what we'd love is to be able to see all the tasks related to projects in our pages. So one way you can do that as kind of expand here and you could see the information around each project, but I think we can all agree that it'd be much more convenient to kind of look at this record.

And then in this pages on our, in, in the second section, actually add that table of tasks. Okay. So let's go ahead and do that first. We're going to add a task and just say, uh, at an, at a text to say these are the tasks associated to the project. Great again, you can change. Let me just make this a little larger.

I know the fence sweet folks are watching, so I'm like very embarrassed about the level of design here. And I hope that they'll they'll allow it, uh, or, or, um, okay. So here we have, what we want here is the tasks, so that little table, and then we have tasks as one of the fields from the table that is creating this.

So actually go ahead and click on tasks and you'll notice that it creates it's a little grid, a little, a two dimensional grid of all the tasks that are associated to that project. So now I can kind of think about this of not only showing that record level information, but I can create. I don't want to say the word spreadsheet, but a, a table of the linked information.

So I see task and the project in one place. So let me go ahead and add, so I walk you through this here. We're saying show it as a table. I can also show it as a list. I prefer the table. I don't care about sort for now. I want to include all records. Not only those that are related to a specific view in my tasks.

And then I could add columns. So these are kind of like lookup fields. Uh, if we were to look at everything in our project table, but these come from our tasks so I can go description, let's make this much larger. And now I have that rich text field let's make this much, much larger, actually what, okay. We need to do this.

Here's where professional design comes in. Let's keep it like this and I'll edit it after. Right. Let me add a D project. We know. So we know name, description. Okay. Let's just add those. Let's show the heading. So we keep those, keep it transparent. We don't want to kind of fill this out. No border, the sunk.

This looks good. But what I'm noticing is if I want these to align. I need to make my canvas a little larger. Okay. So let's do that. Let's go ahead and click the settings and the top light left. This is saying, what size do you want this canvas to be? Let's add about a hundred, a hundred here. That should kind of fill it out.

Boom. And now all we need to do is like expand all of our different images. There we go. Click out, select this one, make it a little larger. Boom again. I apologize to all the designers watching. Boom, whoops. So pro tip, if you're working out somewhere, make it the size you want cookout select the next element.

There we go. And now we have our task and what's great about this is that, uh, all of this lives on top of the air table based, I'm looking at, uh, um,

oh, right, absolutely. So you, I can actually make this. Smaller the text smaller. That's a great point right here. Uh, somewhere here, there's probably heading style row style right here. I can adjust all of them. Uh, uh, say everything I'm showing you is life. This is not a page designer has been available for a while.

Uh, there's nothing new about this. The only thing new is I'm less intimidated by it, uh, because of the help, uh, Uh, colleagues are seeing them work through it. And I totally agree with you, Ash. Uh, it is much simpler once you play around with it, see how someone else does it. And really the possibilities are endless and, and really, uh, I'm always amazed by what people built in page designer.

So, yeah, as I mentioned, like, what's great about this is that if we go up and say, okay, this is done. Let me go into that rich text field and boom, boom, boom. Let's update a few of these. Let's go to project two, same thing. I don't know why we were starting with task three. We'll start with task one like that.

Boom. Let's go back into page designer. And now we see that. If we go to that project, we see that the information is updated, right? So this lives on top of your air table base. And any information that's updated there is live updated into your pages. Uh, so much more convenient and, uh, um, useful and intuitive way of looking at the information.

So that was our first example, right? So project updates, uh, in this kind of very simple vertical use case. The second one I want to show you is to go ahead and create invoices. Um, so invoices, quite a. I would say recurring need, uh, within air table and, um, just, yeah, just something that's actually very hard because you need to pull in information from everywhere.

Uh, and then you it's actually super crucial. Right? You want to be able to invoice. Uh, so let's go ahead and build in invoice. So we close this out. I've got about four tables related to invoicing. Okay. But the last one is really the one that's important. Right? So you've got the client you're invoicing, you've got the project you're invoicing.

So these come from the other table and then essentially just look up and roll up fields. So we have the contact name, a logo, the tasks that are related. Again, it's a lookup field that goes from projects to tasks. So this is not at the invoice level saying these are the tasks that we did. They're actually right here and they're related to all the different clients and projects.

So again, don't worry too much about the structure. Um, and, uh, let's more focus on the pages on our invoice total, which is a roll-up from tasks of the invoice amount invoice number, which is an auto number, and then dates and invoice due date, which is a roll-up. So Kyle, the page cannot be embedded and I'll speak to limitations, uh, throughout.

And I'll kind of have a dedicated section to limitations at the end, but you cannot embed pages liner into a third party, just like any other app, to be honest. Um, one way you can work around that is by sharing so you can share the whole base, but you will be exposing the kind of underlying information.

Um, so in the share link I have in the chat, you do see the apps, but you also see the underlying information, which is usually not what people want. So let's build an invoice. I actually don't know what invoices should look like. So again, leaning on you all to help me build this invoice. If you have any kind of suggestions as I'm building this out, let's actually just go, go invoice template.

Okay. Images. Okay. This feels. Okay. Maybe, maybe you want to make a little bit nicer, but there's like a top section. There's a list of line items. There's a total and then kind of more information at the bottom. So maybe we, we aim for this, uh, but make it a little bit nicer. So let's go to apps. Let's add our second page designer

and let's rename this too. Invoices. So this should point to invoices. Uh, yeah. Even if you, if you want to be building out an invoicing, me to help me build invoices, I'm totally okay with that. So the, in this case, I think eight by five by 11 makes sense. We want it to be printable. Uh, if people still print.

So there's like a first, like a top section, right? With the word invoices. So let's go ahead and add an image. Boom. And don't worry about like going over the sides here. It's not because you know, only thing that's going to be printed out is what's in the canvas. So let's make this blue, I don't know, blue and that's great in big letters, invoice, uh, invoice.

All right, CSA. Thanks for coming in. Uh, let's make this white wait, lets me get a good 700 font size 60 let's center. It, centering it on the make this white, huh? All right. Does that screams invoice like that screams pay me right? Uh,

Yeah, that's a great question, Anthony. I'll I'll, I'll answer that question at the end of this invoice and the answer will be kind of, it really depends on volume and how automated do you want to be? Right. Okay. Let's go back here. What is, what is on an invoice? What is on an invoice? Okay. Company named. So all of this is static information, right?

So these shouldn't change. So you can actually just go ahead and add these Aztecs. Right. So maybe you add company information like that 20. So company name, I'm going to skip this. You can kind of, boom, let me duplicate this. Are you going to address

all that good stuff? Um, cool. And Asheville answer your question as well in a moment. Um, cool. So then I think the most important part is keep clicking on it right here. It's this like the table of mounts, right? I think that's in the invoice number due date. So all of these are variable based on the project that we're working on.

So let's look at the second, second. As I think what the challenge is and how do we get those like little lines, maybe we do these vertical, right? So we have a line for each line item. So let's look at our base structure and see where we would pull our line items for this specific project, remembering that we're creating one invoice for this project, a second invoice for this one and a third invoice for this one.

And then we have these tasks. So let's look at tasks. And we see that we have information across these tasks. So this was 15 days of work, 282 billable hours at 250. So this one should be 70,000 7, 2 5. So what we want is a table of each one of these line items with some of these fields. So we definitely want the billable hours.

We want the hourly. And we want the invoice amount and maybe we include notes if there are some, so, and we want that for each task. So we're going to go here and now I'm going to, I'm going to include this by adding tasks as a table.

Let's give it like all of this. No, it's good table. The columns we want, we want task. We want billable hours. We want hourly rate. So this has two hourly rates. We'll check why that is. And then we have total hourly rate

and then we should have invoice amount. So there's something weird going on with the revisions part, which was probably an overwrite. So probably that invoice amount decided to do $1 because let's actually go check what's happening there. Actually let's focus on the pages on our first and then we'll check what's happening in the backend.

Okay. So now we have our little kind of invoice amounts. Let me go back here. I do want to show heading. So, if you want to make your style a little more custom, you can actually hide the head, the headings

and change the text color, or you can default font. I didn't know that. That's awesome. So instead of, uh, messing with the font as I do, you can actually default it. Let's go back to show headings and what we want. Is maybe we kind of fill out, let me remove some of the columns. I only want total billable amount, invoice amount, billable hours, and let's remove, let's remove total hourly rate.

Let's do this like that. Kay. How are we feeling about this? Does this look good? This looks pretty good, right?

What we might want. Little highlights

like that. So do they have little, yeah, like little highlights like this for every product. So maybe we make this one a, like a light blue man. I'm really feeling like I'm waiting into design and I shouldn't be, so we want to fill this. No, sorry. Filled the very light blue.

Now Raymar would be a good, good time to like guide me. If you have any suggestions around making this look nicer, then we're going to send it to the back. Right. That feels very ugly. I don't know about you.

It's looking a little too much. Make this, you can be a little more granular with width. So I want this to be about 10, 10 pixels smaller.

So if you're that looks about right. Do people still do this on, on, on invoices? Oops, there we go. Let's duplicate this element

like that. Let's send it to the back. Boom. Okay. Then we can have like a total amount, but let's go ahead and look at different records. So now, oh, you see that the width changes. Hmm. That's a problem. Speaking of limitations, let me see if I can fix that. Can I keep the width size the same?

So I don't think I can keep the width. Let's actually remove these. We don't need these little stylings. Boom. Okay. Let's do that. See, this is what happens when I weighed into any type of design on the stream. It ends up looking pretty terrible. Oh, well we could do actually, instead of deleting them, it's actually just make them full, like the full width.

How's that? Is that better? Or is that. It feels worse.

Okay. Well, that's what I get for designing amount to be paid. Yeah. That makes sense. Just like one on, on this one, like that, something like that. Make this one full with,

yeah. Keep it simple, Colleen. I appreciate it. Highlight the headlines. Hm. Oh, I like that as well. So maybe we do that just like this.

There we go. That does make sense as well. Boom.

Hey Anne. Yeah, that feels right. I can make this a tiny bit larger. We achieve boom. Let's make this a tiny bit 35. Maybe that feels about good. That feels good, right? Woo. Okay. We got there. Uh, and then we can add invoice total

like that. And you notice that the way our base is structured, it's the sum of these two things, right? So maybe we get a little text field over there.

I'm gonna say invoice total. And I think we're even able to add a background to the, the actual amount. So I dunno, I dunno, what a good color, like our light red like that. Does that feel? That feels pretty bad. That's it looks pretty ugly. Maybe give it a border. Does this feel.

See, this is why I don't run a business because I could never make my invoice look nice. Maybe I align it like that. Maybe we move it here. Something like that. That feels much better.

Okay. Huh? Red. It feels aggressive. Now feels a little aggressive. Okay. I hope no one here is for coming here for design tips. You're coming here for how to build it, and then you guys can build it yourselves. I knew this was going to happen. Um, okay. And then, and then we have like our invoice total for each one of, uh, our invoices.

So I do want to speak to you some limitations here that have been already kind of brought up. Right. So one of the questions was, uh, from Anthony. Which is, you know, do we see this as a replacement to things like, um, generating invoices? Well, really that depends on how many invoices do you need to generate and what happens after you generate them?

So it is dynamic in the sense that as you can see, I can generate each one of these invoices dynamically. And let's say, I have a view that is unpaid invoice. Right. I can filter and only show records that are unpaid. So let's actually go ahead and do that as an example. So let's say paid, I can have a check box.

Let's say these two are paid and I create a new unpaid invoices. Let me to actually make sure I have two of them at least. And let's filter out where paid is untrue. And let's go back to our page designer and tie this only to unpaid invoices. So now you'll see, I only have two records. So it does adapt to the information in your base.

Uh, um, it is, uh, um, extremely useful, but it is limiting in that. Like send the invoice. I can't automatically track whether the invoice was paid. I don't have a buy button anywhere or like pay now button. So, uh, it is very useful for, uh, just generating assets or PDF. For status updates. Primary use case is for folks in the base, right where the project updates I showed you.

And when you need to send things out, it is a little bit of a manual process. So that is one limitation of pages on her. There were some others. So one mentioned is Coleen said, well, can we make it red when it's overdue? So let me move out the little, what about this buddy? Right there. Cool. I can't do that.

Right. I can't make this dynamic based on the status of the paid invoice. This you background is, uh, static, right? So it does have limitations in that sense as well. Um, there were some other questions. Oh, the embed. So Kyle, no, you can embed. I answered that one before. Let me know if I missed any questions, but page designer.

Extremely useful for these simple use cases, especially one where you just generate need to generate simple invoices or simple PDFs, if you will. Um, and one way to, like, I think that's a good segue into our next use case that I want to show you is what you can actually do here is be very, I don't know if ingenious is the right word or you can select.

The background for the whole page. It didn't have dynamic images come in. So what I mean by that is, let's say this is a good example and it's one that's close to home because, uh, um, you know, I run automate all the things out of air table naturally, but I also create my thumbnail. Out of a page designer.

So let me talk to you a little bit about, uh, um, how that's done and, and Kyle, I'm going to answer your question as I do this. Uh, it's a great question. Um, so I have shows, so these will be automate all the things, and then I have guests right in those guests have an image. So if you go to, uh, you know, my, my YouTube channel, I have an image.

The title of the show when it's happening an image of myself and of the guest in all of that is rendered automatically using page designer. So let me actually show you what the end product is and we'll break it down.

Do do do so my thumbnail looks like this can't seem so like this. And then when I have a guest image, uh, let me go, uh, all streams.

Oh no. What one did I have a guest? Oh, that's weird. Let me find where's my thumbnail one. Oh, here it is.

Streaming with one guest. There we go. That's an example, right? So you see, I have Jay coming next. I have the title coming in and I have, you know, Jay's image in the top rate. So this actually has kind of three layers. It has this background, which I created in Figma. When I say I created it's, uh, uh, uh, oh, sorry.

I can remove the dog. Totally. Absolutely. Thank you for the reminder. Um, fin sweet design, this kind of background, and then I have the person's image and then I have an image of myself. And that image of myself was a little awkward. So we're not going to include it in this page designer. So let's go ahead and add a third page designer.

Boom.

And the a thumbnail is 1920 by 10 80. Let's maybe make that about 50% of that. So 1920 divided by two is nine six. And then five, 10 say I can't design on the stream, but I can do simple calculations. And we're tying this page designer to our shows. Right? So the first thing is, how do I, how do I include that background?

Right? How do I include this? Automate all the things with the little section and the little space at the bottom for the time. Well, I'm actually including it as an image. So if I go to assets table, I have that background, that image that it can bring in to, uh, um, to the background. Now, this is where things get a little, not tricky, but you have to, you have to know how to do it.

So if I go ahead and add, edit layout at an image, and I want it to make that. S, you know, a background in image that is always consistent. It says image URL here. So you can enter the field name, but this has to be inputted as a URL. Now, this is where the tip comes in is that every single asset that's uploaded to air table has a URL.

So if I go copy image address, and I copy paste that you see DL dot irritable. And then in a unique identifier for that image. So what I want is I want this URL to be inputted into page designer. Now air table automatically generates that URL for each attachment that you put in and you can extract the URL with this formula.

So this formula drop it in. The chat is one that I took from the community distaste. The attachment and extracts the URL and why you need that. So, so let's say attachment URL without formula. And I just do a formula that says, give me what attachments is. There's some metadata around it.

My wifi is pretty slow today.

Oops. I have to refresh. There we go. So it has that kind of name and then the URL. So all we want is the URL. So this formula gives us just the URL. That's extracted from the string, who that was a lot. But what you need to know is that if you want the URL, take the attachment and then use that formula by replacing attachments to the image.

And now if I take this. Go here done edit layout. I have the image that I've selected paste that URL, and I can see my image is now the background for my, I must've gotten the sizing wrong. Let's make this a little bit larger like that. And then whoop.

And what is the size? 10 60 by five 70. Let's say.

10 60 by five 70. There we go.

Now this lines up nicely. We can, we can fix this later it's because, okay, well actually let's fix it now. There we go. And this is nine 80 by five 50. Yeah, you can totally host the images. So air table will host all of your images and then you could dynamically select the background. I'm going to show you how to do that with the image in just a moment.

Uh, so let's nine 80 by 5 59, 85 50. There we go. Now we're like properly sized. There we go. Yeah, absolutely. Now we need to input the information. So at crown, you need to add a formula here, uh, sorry. A field that has that formula for each image you want as a background, I'll show you how to do that in a moment, but first let's go ahead and add our texts.

This will be, uh, a variable. So I call this, uh, name.

So just, uh, I'm doing, I could have just inputted name, right. But just to show you a tip, you can also do this. So this is the show number one. So if you're just creating a static test, You can add some text in an input that the variable, you can also do this, which will just be the exact same thing as if you had, had added the name field.

Um, okay. So the next thing we want is this guest image in this circle right here. Right? And then if we have time, we'll do the exact time of the stream of the event here in the bottom, in the whites. Right. So what we want here, if we look at it, I have this circular image that goes in that circle, and that comes from guest.

Ray, have the image of I've recreated that here actually guests. So I have the image and add the image. So there's two challenges. First. I need to input the image that comes from here. And the second thing I need to do is actually go ahead and make it safe. Uh, so let's do both of those things. The first to add the image, go full screen, edit layout.

Let's add an image I want to hear. And I have an image URL, but the image URL is dynamic. So what I need is an image URL for each show that comes from guest. So here, what I've done is in the guest table, I've pulled out the. Right. Just like I did an assets and I'm associating each show to its guest. So I can look up so sorry, it's called this image URL, guest image URL, and it's going to be a lookup field that goes to guest and gets the URL.

So now I can take guest image, URL, and import it into that dynamic image right here at Atlanta. Boom like that. And I'm going to have the square image of each guest that is dynamic. Right. I know that was, that was a little complicated. Let me know if that makes sense. Right. What I'm doing here is I'm saying for each guest, let me make this a little larger, have an image.

Get the URL for that image, which is now a field in my guest table. Look up that URL. So for each show, I have a URL that has the image of that guest, an input that URL value dynamically into this image so that I can see that guest for that specific tree. Whew. Okay. Let's, I'm going to go ahead and finish up, which is just making this circular, which is, if I go back here, I can make the border radius 20 50, 6260.

Is that that's about right? Maybe a little more so 300, 400, 500, 550. It's like a game. Of bingo. Bingo. No, 8,600. Okay, well let's oh, we can recite me. Get a little smaller. There we go. That makes more sense. I think there's a limit to the radius we can put in that we get just a tiny bit bigger.

That's actually make it this 500 it's cropping at the top. I think we all get the point. So you'll have to fix this on your end. That is how one makes a circle. Yes. Uh, the exact specifications. I think you need to make the actual image a little larger. So I have a huge border radius here. Let me see if I can replicate that, uh, over here.

Uh, let's go to image.

Yeah, there's it seems like there's a limit. So I need to make this a little bit larger. I need to make the whole image a little larger and an adapt the border radius, but that is how you would make a border with no, that doesn't change anything. Okay. Uh, can I use percentages? Probably not. No, it has to be a number.

So I think what I would need to do is make this whole image a little larger. So that the circle is a little smaller and then input a border radius like that to make it circular. Okay. And that is how you create assets. Okay. Last thing we want to do here at the bottom is actually input the date, right? So Wednesday, August 18th at 1:00 PM east.

Well, we have is this when, so if I go ahead and add that. Okay.

You see it, it replicates the format of the date, which is not really what we want. However, we can use a formula field to take this date and turn it into whatever we want. So let's call this date, text formatted. Let's do a formula. Okay. So the formula is, I think it's date, time format. And let me actually go to daytime format and figure this out.

Here we go. And a list click here for lists of formats. Okay. So what I want is maybe how did I have it? I wanted Wednesday. So the day where's the Wednesday we're here. So D D D D. So I want to take daytime, which is when, give me D D D D Wednesday, and then the month. M M M M

and finally quarter. No, I want day D O day of the month. Cardinal. No second. Yet. 30th 31st. So D O. Create field. Right. And my thing is always at 1:00 PM, 1:00 PM east like that. So I'm just adding a text that says at 1:00 PM east boom. And now let's take this field instead.

Boom. Make this a little larger. Let's give this a little more font

and there we go. I have this, let's make this white.

Where do I have the text color? Let's make it white. Make this much larger.

Yeah. So, if you wanted to, you can add other images. You'd have to fix the circle here. Uh, but yeah, that's how you create video assets and these change for each show. Um, yeah, so that was how to use pages enter. Uh, we did three examples, uh, projects, invoices, and, uh, video assets. I'm going to kind of open it up to see if there's any questions.

Colleen, let me know if I've missed any of the previous questions. If there's any other use cases that folks want as well. I'm happy to answer those.

Oh, this was a super stressful stream. I have to say. I'm not used to, uh, designing live on the stream.

So let me check any questions. Yeah.

Okay. All right. Well, I'm going to go ahead and drop the base one more time. So these are with all of the completed, uh, um, pages on here. So if you copy it now and bring it into any workspace. Uh, um, you can bring it in. Oh, Kyle. Great point. So there's a question from Kyle that's actually, you know, one of the ways that I, uh, bring in the thumbnail, so let's say that you wanted to export this, right?

And so, unfortunately, the only way you could export today is with the print button, which will either let you generate a PDF, which is super useful. If you're. Sending an invoice via email or something like that. However, what I prefer sometimes to take an image, so I want to JPEG. So I use this app called cloud app.

I think that's the, I'm going to drop it in the chat, which is you're just going to see, oh, actually I can just use the screen grab from apple, right? Like that I can capture it. That was going to bring the image to my desktop. Let me actually open up cloud up. Let me show you how that works. So now, now that I have cloud up open, I can just do like this boom, and now I can bring, uh, um, that image right here.

So you're only going to see a few of them. I can download that

and bring it into thumbnail. So show.

Some now attachment create fields. So it is a few clicks. So Elizabeth, it is a little frustrating. Uh, if you want, are generating hundreds of these, I generate once a week, so it's not a huge deal, but that is the best way I've found of, you know, taking the asset from pages on our and make it an element in your record.

And then you could use it in things like automations to make it part of an email and things like. So, uh, yeah, hopefully I'm saying that right. That's great feedback. I'll definitely gonna let the product team know and feel free to email support@airtable.com with that suggestion as well, you know, definitely should have a clickable PDF exports.

Cool. Okay. Well that was this week stream. Exactly. At 2:00 PM Eastern next week. I'm going to be on with Jay right here. Boom. Uh, who kind of came to me with a workflow of how could he track or automate, uh, folks participating in, uh, you know, uh, a community event called 100 days of Twitter where users will kind of subscribe, I guess, or promise to tweet every day.

And he wants an automated workflow to check whether they have and create a community leaderboard. Uh, so we're going to do that next week. Uh, yeah. Awesome. Really appreciate everyone joining. This was super, super fun. Thanks, Deanna. Thanks, Coleen. Thanks Jeremy for coming. Uh, Kyle, great questions today.

Appreciate that Ethan, uh, as always appreciate you joining today. Uh, um, yeah, really huge fun. And uh, yeah, Anthony. Thanks. Great question throughout. Really appreciate you coming. I'll see you all next week and uh, yeah, happy automating until then. Happy pages, designing, whatever you need. Awesome. I'll let you guys go.

Have a great week. Thanks, penny. Good seeing you. Thanks Colleen. .

‍