My 21-Step Website Design & Development Process

in today's video I'm gonna give you my 21 step exact process from start like literally meeting the client for the first time to end website goes up live customer leaves happy 21 step process to web development get your pen and paper ready we're gonna have a blast [Music] [Applause] good evening from downtown Toronto my name is Chris Hughes owner founder of a nerds world calm I welcome you to take a look at my website a nerds world we offer digital marketing services web development logo design graphic design SEO videography and photography we have physical locations in downtown Toronto and we're doing things somewhat differently a lot of people within this industry still have not built a process a process means like an exact recipe for success now it's taking me and my wife my wife and I 12 plus years to put this process together we're happy with it eight it could evolve over the course of the next 12 years but right now today 2020 this is the exact process that we're using and we're willing to share it with you because we care when I started out in this industry of web development I didn't have a written process it was sort of like let's play it by ear and let's skip certain steps because we like a person let's offer 32 extra rounds or revisions because the client is nice in today's video I'm gonna touch upon the process step one is our initial consultation if at all possible I'd like to meet with this prospect face-to-face but if that's not possible then telephone zoom or via email number two is a price quote or proposal so upon completion of that meeting if it's a price quote it's simply an email that outlines everything that we talked about in what the price point will be and that is normally within 24 hours of that meeting most of the time it's within an hour or two of the client leaving like my game plan is to get them a quote before they get home to their computer and literally I want to out beat every single other web developer and I know they take their time to put price quotes together so I want to get it to them with the utmost speed now if a website design price quote is between 10,000 and a hundred thousand we'll put together a proposal which is a pitch deck it's about 15 pages long if I have a spectacular conversation with a small corporation and I feel like it's going really well and they say well Chris you know the project's going to be eight thousand dollars but my team really needs to see this proposal I'm not brain-dead I'm gonna break the rule and give them a proposal but I mean for those smaller clients that come in with a thousand dollars two thousand three thousand I'm not creating proposals it's gonna be an email breakdown of price points what they're gonna get emailed to them step three if the client shows great interest and says you know what I'm ready to work with you then we start composing an S o W it's a statement of work it outlines everything we're going to include at the given price point that we have agreed upon and that leads into number four contract signed so we have a three four page document which is a web development contract we will not commence any web development project without a contract sign now the reason for a contract is mostly legal it's a legally binding agreement from both parties and but that's not the reason I do this I do a contract because I want the client to know and understand and read exactly what they're gonna be responsible for in this relationship and remember a contract is only a legally binding document if this goes to court very rarely I mean one out of every two thousand websites that we build there'll be a court case so I mean the far majority of the time it's just a document that both parties sign to initiate a new business relationship I'll share my contract below you're welcome to take it copy-paste it edit it chain put your logo on it - as you burn it do as you please with it that leads into number five this is the number that gets most of you guys excited we request a non-refundable 50% deposit that's how it starts that step number five show me the money you've showed interest we've consulted we've talked about everything we've done the statement of work now it's time for you to show me the money we accept payment email transfer bank transfer money order certified cheque in cash personal check Visa MasterCard American Express debit all of those now if they can't physically come to our location then we send them an online invoice through a company called pay firma which is our personal merchant account in Toronto so we have a bank account they have an online platform for billing and we send them the invoice so we can it we can bill internationally period this is not a fishing rod that you ordered off Amazon which you use once or twice and then return to Amazon with a complaint this is a all in depth service that we're offering time and passion and expenses are put into this so for that reason we do not allow for any reason at all this is a non-refundable 50% deposit number six is a deep dive it's like you're diving into this okay in the beginning we scratch the surface we found out what you wanted we're doing more listening than talking we're listening to your problems now we're gonna dive in six and really we're gonna get into everything we want to talk about everything what your hopes are your goals your dreams of this website what's your major call to action and this is the point where we're we're the idea maker we're also the mediator if a client starts adding new things to the table that we're not in the slw at that point we're like no mmm these are great ideas but if you want to add these to the menu there's going to be an additional cost but this is more so a sit-down a brainstorm a deep dive in which we sit with the client and go through everything in great detail look through examples the easiest way for us to do this is to look through examples on the world wide web show them things and like what are your thoughts on this do you like how this rotates and look we're not demanding an answer on the spot most people get nervous because this is the first time they've ever done this and they will not have answers to every question that I might have and I understand that but the idea is for me to pick their brain find out what they like versus don't like and be able to be right on the spot and answer any questions maybe they want to show me a website and say hey is this possible or hey do you like the way that this works or hey what are your ideas on this so this is like a deep dive brainstorm where we're putting all our ideas together I'm writing it down I'm taking notes of examples that they like versus didn't like and that leads into the next step now number seven is dependent on which package they go with with us which package they hired us for if they've hired us for a wordpress template based website which we consider bronze and silver on our web development page then our next step is to source five to ten WordPress websites and submit them to the client we're not sending everybody the same five or ten and we do not necessarily have to send a dentist five to ten dentist templates we need to explain to them that they can use their imagination we're looking for a template it's a base we're not gonna keep the photos we're not going to keep the colors we're definitely gonna remove some things and customize some things for the brand but what we need to do is send them five to ten templates to review on a desktop and a mobile and we have to tell them that or they won't know now we're available for a phone call if you want to walk through if they have a question like hey I don't really need that Instagram feed on the bottom of the homepage then we can say you know what we can easily remove that with a click of a button and then in the future if you decide to add that then we can click and play again this is the step in which we need the client to be confident in the decision because this is going to determine what the outcome of the web looks like so if a client for example worst-case-scenario does not like any of the top ten themes that we send them we'll do this again and again we're not gonna force you to build a website you do not like we're gonna find a template that you're happy with but once again there are no secrets in this you see the website you get a general idea of what it's going to look like that is the process behind us selling our bronze and silver now for gold and enterprise it's more custom than that that's what we sit down and we start actually drawing everything out we sit with the art director and then he then puts together a two page mock-up normally we picked the home page because it's the most important page on the site and we'll pick what we believe is the second most important page on the site but we will ask or request the client to approve those two pages we're not going to go out and start building a whole 10 page mock-up when we're not a hundred percent sure if we're heading in the right direction so we much rather work on a two page mock-up and then once that is revisions are complete and it's approved then if it's an enterprise-level we can continue on with the other eight pages but we're not gonna spend an overwhelming amount of time on something that we're not 100% confident in and that being said the clients not 100% confident in once we submit this to you we're available to answer any questions if it's a mock-up send us revisions we'll make revisions we'll send it back to you make revisions we'll send it back to you but that leads into step eight that's when we request homework your content is do we need things like your logo your social media links would you like a map or location we need any imagery graphics infographics and text that you're gonna want on your site when we submit this to you and we say this is all the things we need we call it a homework package but really it's just a breakdown of things that you need we also create a Dropbox account we pay the premium fee on a monthly basis to have a ridiculous amount of space so for any new project that we take on we create folders remember by this point in the relationship we already have a sitemap we know how many pages and what the names of each page is because that's already way back in the statement of work section we have that breakdown so in the Dropbox folder just imagine we have a folder with the clients domain name when you click on it and open it there's individual folders for each page gonna be on the site so for example folder home folder about folder portfolio folder blog folder contact and we give that access that link to the client and say please start adding content now in each one of those folders there might be a notepad that outlines exactly everything we need they can then update that note and leave it there and then we can find it the other option is they're not gonna give us new content the content is already on their current site they just want to bring it over if it's a big site we'll ask for WordPress or whatever then the website is will ask for access like a login and password so we can migrate it quickly if it's a smaller site a three-page site a four page a five page site and there's not a huge amount of content we'll literally just copy and paste it so we don't have to wait for a login and password if the client says I want to start building the site and I don't have content yet it will take me a month to put content together we say no problem let the games begin because we're gonna start building that site we're going to use Laura Epsom in the placement of where the text will be and I think that works for many different reasons visually they can see what the website looks like we're not going to stall we're gonna continue working on the site that might give the client I guess a little kick in the ass to start putting content together because they note it is required it might spark ideas when they see things it's one thing to talk to a client and verbalize what what's what it's gonna look like it's another thing to advise and then show so that's very important and this is the part of the relationship where we ask for homework I think that a lot of developers ask for homework too early in the game it scares people it puts people off because I know when I was new to this one of my first steps in this process after the first meeting would be like do you have your content prepared and then they're like alarm start going off in their head content this is scary homework I'm not used to homework and then what happens is they become shy they're like oh okay maybe I'm not ready for this website that I thought I was ready for so I didn't realize you were gonna hit me with the homework so soon so I was losing deals because I was arrested requesting homework months would go by I would follow up follow up these people are not on the ball they were not motivated that being said I probably could have closed the deal and I probably could have got the website built if I had only left the homework stage to be a little further into our relationship and once I got the 50% deposit step number nine is when a developer from our team or in-house team has actually given the project how do we choose which developers should take on which project based on experience we know our team and we know Peter has a gift in e-commerce or Brian likes this and etc so everybody has a different ability for example of a client shows a certain theme that a different developer has worked on three or four times then yes they're definitely going to get that project or if a dog-walking company comes in and hires us for a website we might ask like who's interested in dog walking that's a horrible example but we try to find somebody that's passionate about the industry that were taking on so step number 10 is once the developer is put in all the content that we have and the website has been reviewed by a project manager most of the times my wife then the client has sent a dev link so we have a separate domain that's not a nerds WorldCom and we hide all of our websites as they're being worked on that domain it's a VPS is a large server and it's a hidden link that's not spidered by google so we provide that link to the client and say okay we're at the point now that we need you to review it and provide revisions only review this on a desktop computer because we'll be upfront we have not touched mobile yet this is the point in which we request revisions step number eleven is we've received that list of revisions that's the point where we submit a new bill we are now asking for 25% more of the payment in order for us to start the revisions okay we've been burnt for the first five years of business we went fifty percent down fifty percent upon completion and we got burns so many times companies went bankrupt people just going mi a missing in action so we ask requests and it's part of our contract right now you've submitted the revisions now in order for us to dedicate more time to your project and complete these revisions we need an additional 25% payment once the client has paid then we go into number 12 which is actually completing those revisions and when a client sends us a list of revisions there's a two-step process first the developer that's been working on the website makes the revisions physically in our office all our developers sit within six feet of each other at that point a project manager would send somebody else that's available for 15 minutes to go sit on their own and go through the revisions we print out a piece of paper with a highlighter and you're signing it to confirm that you you have confirmed that the changes have been made properly if there's a question between the two and we're not a hundred percent quite sure if the revision has been made properly there are often times where clients cannot verbalize exactly what they're looking for remember this is the first time they've probably done this at that point a project manager would jump on the phone with the client and say hey I appreciate your revisions we're working on it number 17 we're not 100% sure can you please verbally tell me exactly what you mean because we want to ensure that we get the revision correct on the first attempt step number 13 is just a follow-up we're asking now revisions have been made review the site again offer us another round of revisions now depending if this is a bronze or silver we offer two rounds of revisions incorporated in the price at no additional fee if it's a gold or enterprise we offer three rounds of revisions and resubmitting to the client for a second or third round of revisions step number fourteen is a final review for the client we're resubmitting you the website we've completed all revisions everything should be working perfectly we're gonna ask you once again please review your website on a desktop and laptop only please give a final you to confirm that everything we've done thus far is on point all of the photos are replaced with either your photos or good quality stock photos all the lore if some has been removed any links to social media is working contact forms are in place phone numbers are correct map listings are correct and at that point only we work on mobile responsiveness once everything has been confirmed now it's time for the same developer to sit down and make sure that this works properly on different sized screens both mobile you know everything from Android iPhone iPad etc you know we do it the old-fashioned way we actually physically have telephones in different devices in our location that we can test things and we also use programs in order to replicate what it would look like your website on different devices number 16 is a final test somebody other than the developer that worked on the site majority of the time as a project manager goes through and starts testing this website on different devices and different browsers open it up in Safari click and in Chrome see what happens and make sure the website works to the full ability in the way it should work but we internally test everything leads into my lucky number 1717 is when the client is sent their final invoice which is the remainder of the balance at 25% there are other occasions where along the process clients say well let's add three more pages to this website and that additional fee would be added to the invoice step 17 is the point where they have to pay their full outstanding balance step number 18 is we finish the site client has approved everything it's been tested it is ready to roll and that's where we begin the migration from our server to the clients host hosting if during the migration something happens like we're not happy with the hosting or we believe we can recommend a better hosting than what they currently have then we'll be upfront with the client stay here here are three options we don't believe that your current hosting is the best case scenario and we'll leave it up to the client to decide but we are responsible in our package for doing the migration now there is a very rare occurrence where the client does not want to give us access to their hosting I don't know why but it happens and in the times and we simply send them a Dropbox link with database files etc and it's in their hands they don't want us to help it's in their hands step number 19 there's a follow-up email it's like thank you guys we made it we're excited about your project here is full access to your hosting to your WordPress and we give them it's sort of an email with a full outline of everything they need to know here's the link in which you log into WordPress and here's your login here's your password and here's all the credentials required in order for you yourself number 20 is a follow up email or call where we offer additional services either we can do the maintenance to your website if you request or require we can work on a case-by-case alucard type service where whenever you need us submit it to us we provide a price quote we make the change or you can pay for credits credits is a one-time fee and it can be broken up accordingly as you need us on a month-to-month or day to day or week to week basis we also offer the client the opportunity to sit in and do a one-on-one tutorial with the same developer that built your website and they'll walk you through the ins and outs of the site and they'll also teach you how to make the updates that you might require on a daily or weekly basis that comes with a fee of 120 dollars per hour we're upfront with it it's not a free class there's a cost associated with it and that leads into number 21 final number 21 we give our clients seven days to test everything to ensure everything from contact forms to links to social media to every link on the page works properly they've tested it on different devices we're gonna fix anything that's broken or an error on our part within the first seven days free of charge now if a client says well I forgot to add this paragraph then hey we'll tell them this one time we'll update it for you we'll allow them the opportunity to update it themselves obviously it's their website there are free to do whatever they like with their website but we want to make sure this is not the beginning of the type of relationship where it's like hey can you just add this to my site it's gonna only take you a minute because as developers we hear that and no worse service based industry so we might give you one opportunity any other opportunity after that we're completely upfront when the email comes in and they say can you add this will give them a price quote we'll say okay you're not asking for that much but our minimum charges one hour it's $120 if you confirm then we'll make those changes for you and that is my 21 that is our 21 step process to success now when we do this it's not like we jump it's not like some clients getting a 14 step process others get a 32 step process no every single clients getting a 21 step process we use this document we highlight the document to say what step we're currently at and the client also has this document because remember this is like a treasure map you need to know the direction in which you have to travel to reach the treasure most clients have never done this before this is brand spanking new so why not give them the keys to the treasure then they can look at this and say hey I'm on step number seven this is motivation to get to step 21 or for those clients that say hey I'd like another round of revision I didn't know there was only three rounds of revisions you could say well sir ma'am every step along the way when we've emailed communicated I've always told you what step we're on right it's part of the statement of work it's part of the contract and it's part of this work flow process that I've handed to you in printed or emailed format guys this process has work for us very well and having like if you look at any big company let's say McDonald's for example and if you go to Italy and taste the hamburger and french fries it tastes the same as the one in downtown Toronto and I'll tell you why they have a process they have a recipe they have a process in place for everything I haven't talked about this too often but I was a manager of footlocker and me being the manager of footlocker 20 odd years ago opened my eyes to process I never worked in that type of environment where everything was processed I mean in the back room you had binders on top and if something happened the manager would pull out the binder and it would tell you exactly what to do so this is the first page that you should be putting in your process and you should have a book a binder a Bible outlining exactly what you should do in certain circumstances have resources that are required have you have it all documented so you're offering the same thing to every single client and once again you're going through the same steps do me a favor try it out try it out not just with yourself share it with your client and then you let me know how it works did it go smoother did the client stop walking all over you because at least from the beginning stages they knew what they were responsible for and what you were responsible for they knew what you were hired for and what they were responsible for and that is what makes the difference in building a proper web development company that's organized and that's process based now kill it today's Tuesday I'm going to edit this video get it up for you live today I'm better oh the kids are probably sleeping get a little too crazy okay guys have a wonderful night good night

Channel: A Nerd's World

Views: 9,613

Keywords: website design process, web development process, best website designer process, best website developer process, workflow for web designers, workflow for web developers, how to create a process, creating a process for website design, creating a process for web developers

Id: rz_RvsQL8iA

Length: 24min 51sec (1491 seconds)

Published: Tue May 05 2020