Field Inspection App - AppSheet Tutorial for Beginners

hey we are appsheettraining.com and we love helping people unlock the power of no code app development if you enjoy our content hit that like button and subscribe to the channel because it really does help us out thanks in this video we are going to be walking through how to make a simple vehicle inspection app an app sheet that will look something like this so in this app we set up an action that links us to a form and pre-fills some data based off of the row that we clicked it on we also set up a reference column so that we could populate some of our columns with values from another table we also walked through setting up different views within our ux tab to help our users have a good experience if you would like to see a production level vehicle inspection build you can check out our more advanced build guide on our website appsheettraining.com there you would learn how to build an app that will look a little bit more like this so in this app build we set up a multi-step form meaning that it has multiple pages with tabs and tab headers at the top of each page we also set up document generation so i could come here click email report and have it email me a report and that report looks something like this and so this is something that we set up on our own and it pre-fills certain columns based off of expressions we used in the template generation then we also set up user permissions so depending on a user's role in the company they would be able to see views or not see views as well as what they're able to interact with in those certain views will also differ based off of their role with all that said let's get started [Music] so when creating an app sheet app it always begins with our data and so here i've set up some tables in google sheets so in our google sheet up here across the top is going to be our column headers so these column headers are going to appear in app sheet as well and they're going to essentially be labels for our data as we insert those data into our rows and so it's just going to help app sheet and us know what piece of information is in each row so right here this is going to be our key id column which is something specific for app sheet in that every value so for each different row the value in this id column has to be different than every other rows id column because the key id column is how app sheet differentiates one row from another row and so in order to put in those values we're actually just going to let appsheet do that for us automatically but then across the top because we're doing a vehicle inspection this table is our equipment table and so we want the equipment's unit number the name that we give it it's make model the vin number license plate and an image of that vehicle and so since this is the data that we want to get i have placed it in the sheet to start off now in our other table our vehicle inspection table we have once again the key id column but in here this says equipment id and this is actually going to be populated with the values from our original equipment tables key id because this equipment id column is going to be a reference column meaning that it's referencing another table being the equipment table every time the new row gets added the way this is going to work is we're going to have a piece of equipment and so one piece of equipment can have multiple vehicle inspections meaning that its id can come in here multiple times and we're going to use that reference column in order to populate the equipment name and the license plate so we were not continually re-putting data that we already have elsewhere instead we can just pull it straight from our equipment table equipment name and license plate then moving on are just some other parts that are going to be on our vehicle inspection form being the odometer if there are defects or not what those defects are an image of the defects and then an inspector signature to finish it off and then our inspection timestamp is going to allow us to know when it was created so that we can order it and sort it by time all right since our table is already set up we're gonna go ahead and move over to appsheet.com and just at the very beginning you can come to the my apps page and click on make a new app we're going to start with our own data we're just going to call it our vehicle inspection app come down here it's going to be under inspections and surveys and now we're going to choose our data from google alright so here in google you're just going to essentially find your spreadsheet so here we go clicked on my sheet and now it's going to be setting up our app using that data from our spreadsheet alright so here we are it's set up our app but there's nothing here because we don't actually have any information in here yet but there's a couple of things we need to do first before we input that information so you can come over to data and here you can add a new table or it says that we can add a table for this vehicle inspection which is one of the tables from our google sheet so i'm going to go ahead and add that in all right now we're going to come up here to columns and click on equipment so now we get to customize what our column header is going to be in terms of its type as well as determining what's the key what's the label once again this key is that unique id which we already have set up here and actually if you come over to the side actually it's already inputted this value into the initial value of unique id and so this is how it auto-generates a key id for each row so we're going to leave that as it is come over i'm going to uncheck show because i actually don't want this to be seen on any of our views all right coming down our unit number we want this to be a text type same with the equipment name and then for the rest of these we want them all to be text and this last one an image and for our use case we're actually going to have the unit number be the label and so that's all we need to do to set up our equipment table so then i'm going to go ahead and save that so now i'm going to come into our vehicle inspection columns and begin coming down once again our id is what we want to be our key id so i don't want to see that but i do want to double check it has the initial value of unique id so that means we're good so moving down from there we're going to mess with the equipment id and as i was saying earlier we're going to make this a ref and if we come in here it asks for a source table and that's going to be our equipment so once again this column is going to be popular with the values from the equipment id column so it's equipment id and it's going to be populated with the values from if we go to our table of equipment and then this id column right here so after we set up a ref we're going to go ahead and save it so that we can use it because here our equipment name we're going to leave as a name but the formula is going to be equipment id dot equipment name so because equipment id is a reference it is using that key id on the row in order to determine that row's equipment name and then it's going to populate this column with that value so what this is going to do is if we come over to here to this piece of equipment and let's say we give an idea of abc123 and its equipment name is going to be just truck then in our vehicle inspection whenever we have a inspection for that piece of equipment it's going to populate our equipment id is going to be populated with abc123 because this is a reference actually knows this abc123 can come back to the equipment table and it's going to be this row so all these pieces of information for this piece of equipment is now able to be referenced and so what our formula is doing is it's saying that row we want the equipment name from it and so it's going to come grab that truck it's going to grab this truck right here and it's going to automatically populate our equipment name with truck so continuing down our license plate we're going to leave as text but same thing we want to do a reference from our equipment id to our license plate but here actually gives us a green check mark so we can save it and continue downward odometer we are going to place as a number defects we're going to have as a yes no because once again we're just trying to see are there defects or not and then the details instead of just text we want it to be a long text so that people can put in paragraphs as opposed to just a number of sentences and then our image here we're actually going to change this to a drawing and that's because we want the inspector to make annotations to the picture as opposed to just submitting a picture we want them to be able to take a picture and circle uh the specific part that has a defect signature we leave a signature and time stamp we're going to leave as date time if i come over appsheet has automatically put our initial value for the timestamp in as now and what this now does is it gives us both the date as well as the time so it won't just say 5 24 or 2021 instead it will say that with 409 and then the following seconds all right so now we're going to do one more thing for our vehicle inspection table and that's going to be adding a virtual column and so these columns don't exist on our spreadsheet they only exist inside of app sheet but they're useful because they will automatically calculate the value in their column on any change within app sheet meaning we can put data that needs to be a little bit more dynamic as a virtual column because it will be continually processed every time we do something in the app so if i add a new virtual column i'm going to call it the vehicle inspection date so our formula is going to be text and then our inspection time stamp month day year year so all this is doing is it's taking whatever our time stamp is for that particular row and changing it into the month day and just the last two numbers from the year and this is just going to be helpful whenever we're setting up our ui and making our app look nice and we're just going to leave it as a type text so i'm going to go ahead and save so that is going to conclude our column setup so i'm going to go ahead and add in some data to the google sheet so that we can begin manipulating and setting up our ux [Music] all right so now that we have some pieces of equipment here we're able to actually see what our equipment view looks like and so i'm going to come over to the ux and right here our primary view is equipment another thing you can do is come down to the view and it tells you the current view that you're on and if you click it you'd have the same thing where it comes to the ux view of the your current view and so here we are going to leave it as card put left come down here and we want it to be sorted by the unit number and it's fine to leave it ascending and so this is more based off of our use case than anything else all right but here is where it's going to change we're going to make this large and then change up each part of the card so up here we're gonna have it show the image and then we want the make and model as those two come down here and this is going to be our equipment name then we're going to have our unit number and then our license plate and then down here action one we're going to leave that as edit i'm going to take off this delete from here and in a bit we're going to add something else but for now we're going to leave that as it is and then for display this is going to change up how this looks down here in the ui so if this one i'm going to make it look like a vehicle and our display name we're fine with it saying equipment so we won't change that as well as not mess with the show if so that's going to do it for this equipment view so i'm going to go ahead and save it all right now we're going to mess with the equipment detail view which would be this view right here and there's a couple ways to get it one if your system views are hidden this would be all that you see and so you have to click show system views and once again we can just click down here and automatically it automatically brings us to the equipment detail and then if i look at my equipment detail this i actually like the way that it's currently set up if you want to change anything you're more than welcome to but for our use case this is fine all right so now we're going to create an action that will automatically bring us to a form that is populated for the specific equipment that we are trying to have a vehicle inspection over [Music] so in order to do this we need to create an action in order to create action we have to come to behavior and then actions and we're going to click on start or click on new action for the action name we're going to call it vehicle inspection and then it's going to be for the equipment table and then here we want it to go to another view within this app here we're going to be doing something called link to form and in this we want it to link to a specific view in our case a specific form view so in the table that the form view is linked with in this case the vehicle inspection table now we can input a column that we want to be autofilled whenever this link occurs so that is going to be our equipment id column because that's our reference column we want that to be automatically pre-filled with the id from the equipment table and so here this row dot id is going to grab this id right here and it's going to autofill the equipment id right there as the form opens up and because that happens in the equipment id is a reference it's actually going to pre-fill all three of these columns as soon as we click on that form which you will see in a moment all right so now in the appearance we just want to make it look a little bit different i'm gonna have it gears but the display name we don't want to change it because vehicle inspection is what we want it to say and so that's going to conclude setting up our actions we're going to go ahead and save it and so now that that's saved you can see right here our action has appeared and if i come out here to the equipment i'm going to come to the view and change up right down here and then click vehicle inspection and so now here we go our action has popped up on this view meaning that we can click it and it links us straight to the form and so now we're going to go ahead and customize our form so i'm going to click down here to get the view right here and here as i was saying earlier the equipment id is automatically populated because of the expression that we used and because that one's auto-populated and it is a reference to the equipment table these two get their values from that reference they have also been populated for this view and so we'll come down and kind of see what we want to keep and what we want to move around all right so coming down i want some of this stuff to be in a different order than it currently is in so i can come over to this column order and add those in remove all others to the bottom so this top one i want to be the equipment id so i'm just going to move that one up and then i want it to be the vehicle inspection date so that you know the day that it's on and then once this equipment id gets populated it should fill in the name and the license plate so this whole first part is auto filled every time we use that action come down odometer defects the details the picture of the defects and the signature all there the only one i don't want to see is inspection timestamp i actually don't want to see that in any view so we are actually going to head back over to the data and make it not show in our app anymore but i can look back over this form view and realize that this is how i want it to be set up so we don't need to do anything else in this view so i'm going to go ahead and save that now i'm going to head over to data columns vehicle inspection this time stamp and just click show to turn that off so it's no longer seen anywhere on here so now we're going to head back over to ux views and our vehicle inspection view is the next view that we want to mess with but before we do that we need to add in some inspections and so i'm going to go ahead and fill out one form for each of our vehicles so that we can begin manipulating the vehicle inspection form all right so in our form view real fast this is our image and it's actually a drawing so i can tap to unlock it and then upload a picture so i'm gonna do that real quick and now on our picture we are able to make annotations by choosing any of these and just drawing directly on it and so here it says hood damage so i can draw a circle on the hood and so this is the reason that we want to do drawing and not just image because if it was just image all you would be able to do is upload this or take a picture from your phone whereas with drawing you can take a picture or upload one and then use these colors to draw on it to kind of highlight what's happening in that picture and then our signature we just unlock it and you can scribble in freely [Music] all right so i've uploaded a couple vehicle inspections and so now they've popped up here on our view so for our view we're going to change this up to a table view and then we want this to be sorted by our timestamp but we want it to be descending because we want the most recent vehicle inspection to be at the top and so descending makes it to where the most recent one is at the top and then we want these to be grouped by the date and so since i just did all of these today they're all going to be grouped today but if we had them spread out throughout multiple days then they would be grouped separately by that so i'm actually going to change some of them up so that we can see that so here we go i made one the 22nd being this red sedan and so you can see by our sort by is saying that the inspection timestamp needs to be descending but here here the oldest one is on the top as opposed to the newest one which is what we want but within the groupings the newest one is on the top meaning that we need to change our vehicle inspection date to be descending as well so that the newest is on the top both in the grouping as well as within the groupings and then we want this group aggregate to count so we know how many inspections were on what day and then if i'm looking at this it has our name and the id but it also has everything else from our vehicle inspection and so we only want a couple pieces from our vehicle inspection so i'm going to add in a couple into our column order and this first one i'm going to put the equipment name so we know what it is and then i'm going to put the details of those defects so that we can see quickly at a glance some of the defects that they found during the vehicle inspection then we're gonna move down to display and just change up this icon and so i want to make it a wrench and our display name we're fine with vehicle inspection so we're just gonna leave that blank and then that is going to do it for our vehicle inspection view so i'm going to go ahead and save so now we're going to move over to the vehicle inspection detail so i'm going to click in on here and see vehicle inspection detail at the bottom click on that so that we can manipulate that and just to start off i'm going to change this to a card layout where of course we're going to have the image at the top and then the equipment name vehicle inspection date but then right here i want this to be the equipment id because that is going to show our unit number because we set up that unit number as the label earlier on in our columns under data and then down here i don't want this action or this action but i do want to keep this view reference equipment so that you can click here and go to the page for that piece of equipment and then as we scroll down just a little bit this quick edit columns i want to change this to defects so i can come down i can see that there are defects but then once they get repaired i can click that so that they no longer have defects where i can leave it clicked because they do still have defects okay now i want to change up the order of our columns so i'm going to go ahead and bring all these out all right so i'm going to put all other columns at the very bottom and we're just going to go down the list and see what we want and what we need versus what we don't want so row number doesn't even display so we don't care about it equipment id i don't need because it's at the very top and then same with the equipment name it's also up here so we had our equipment id right here and our equipment name up top so i'm going to go ahead and get rid of that we're going to keep the license plate because we don't see that anywhere else same with the odometer defects details of the defects image inspector signature but we don't need the vehicle inspection date because that's already displayed right here so now everything after inspector signature is stuff that we said that we didn't want but showing up because of the all other columns so if i delete this it actually gets rid of those and so now our detail view is just filled with the information that we want to see on it without having extra clutter or without repeating ourselves so this is going to do it for our vehicle inspection detail so we can go ahead and save that so now if i come to equipment and i click on this red sedan right here i can scroll down i can see this related vehicle inspections and so what this is is this is an inline view so if i come here and i see vehicle inspection you see vehicle inspection inline and if i click on that now we can customize what this looks like so that we can make it a little bit cleaner and more to our liking and so for us we're going to change this to be a table and we're going to have a sort by the timestamp descending once again because we want the most recent to be at the top we don't want to group these or have an aggregate but we do want a column order because we don't want every single piece of information to be displayed here we only want a couple pieces so the first one is going to be our vehicle inspection date so that we know what day the inspection occurred upon and then the details of the defects and so right now you're probably thinking you can't tell what vehicle is what and so which inspection goes with which vehicle but remember our inline view is only able to be seen from that equipment detail page so you're already going to be on that specific piece of equipment and so you just want to know what the date and what those defects were from that inspection and so that's going to do it for our inline view so i'm going to go ahead and save so i can show you what i'm talking about so here if we go to our equipment a red sedan and move down here is our inline view and so it just has the date and the details of the defects and it's seen on this specific piece of equipment meaning all of these inspections relate only to this piece of equipment we don't need to specify the equipment name or anything like that on the vehicle inspection itself because of the place that it's put in our app so now we've finished the bulk of everything that we're going to be doing with this app but the last thing we can do is come over to brand so that we can customize our app so i'm just going to change up the theme making it dark theme as well as what primary color is used throughout the app and our app logo we can change it up to look a little bit more like what our app is actually going to be used for the launch image our background image we can change that up as well and then change up the style and so this is all just kind of personal preference slash whatever your use case is if you're building this for someone else and then here our view name and header i recommend always having this checked because up here you can see what view you're in at any given time if i click in here i know i'm in the details view or if i click through here i can also see i'm in the details view here come back here vehicle inspection details if i click on this i'm in the form view and so it helps out especially as your app gets more and more views it helps with the users being able to tell where they're at at any given time within the app so that's going to do it for our vehicle inspection app build once again if you want to check out a more in-depth more production level app please head over to appsheettraining.com where we have an entire path going through creating a full-fledged app that we would create for a customer who needed a vehicle inspection app that app has many more features found throughout app sheet such as format rules slices automation bots it also contains document generation and pdfs as well as how to automatically save that pdf or email it to yourself or specific users based off of their roles it also has table permissions on the app as well so if any of that interests you please check out appsheettraining.com once again thank you so much for watching and have a great day

Channel: AppSheet Training

Views: 40,932

Keywords: AppSheet, Database, App Development, Google Sheets, Excel, SQL, Smartsheets, No Code, Google Forms, Graphs, Report, Mobile App

Id: PsdAy8S0EMI

Length: 28min 26sec (1706 seconds)

Published: Tue Jun 01 2021