Create Custom Google Maps (Complete) in Adobe Illustrator & Snazzy Maps (2021)

hello everyone today we will learn that how you can create a custom map that you can use on your website or a mobile application design so for this purpose i have been using snazzymaps.com to create a map then we will bring the image to adobe illustrator to further editing the map and then we will save the file the vector file and bring it to [Music] adobe xd so that we can present the high quality resolution on our website so how you can do this go to snezzymaps.com and there is a tab create a style so let me click on it so on clicking create a style you have different options okay so let me choose default and apply style so we have a default google map style there you can see so if you want this kind of a map so first you have to decide that what kind of results you want so that we can go with the options to create something very similar so if we want this kind of a result let me go to the stasi maps and we have to make this gray area to white and the roads to a dark color and we have to remove these labels and the labels on the root okay so if i let us remove the labels first so there is point of interest and click on clicking on it and then all and we have to turn off the visibility okay so we have removed the the markets and other important venues the labels from the map so now we have to remove the labels the road labels so there we have the road option let me go to all and there we have to turn off the visibility okay so we do not have to turn off the roads we have to make the labels turned off okay so when you will make a change to a specific field there comes a dot this will indicate that you have made a change in this specific field so if i go to this geometry and i turn this off and i turned it on back so there comes a dot so if i want to remove the start i have to click on this refresh or restore button so that it can go to the default settings so only one thing left that we have distributory we have to look that what actually this label is meant for so let us go to the administration labels and turned it off now okay so so actually you have to look that what this label is meant for and in which category it is um it will fall so you have to turn it off so now what we have to do is we have to make this gray color to white so there is a section that is landscape and [Music] we have to go to the geometry fill and there we have the custom color so okay so let us make it to a white color okay so now we have to make the roads to a dark color so there is a section road go to geometry custom color and let us make it a dark color okay so what is left actually so we have to turn on the parks and we have to assign this spark a green color let's find the okay there is a section park now we have to turn it on go to all make it on okay so if you want to change the color you can simply change the fill color of it i'm clicking on fill custom color let us make it little green a custom green okay so there we have the map uh now we have to save this map so i'm clicking on this download image so snazzy maps will allow you to download 8 images a day and for this purpose you have to log in your account and then you can download 10 images a day so i want 1000 by 1000 pixels okay so this is the center it is calculating 1000 by 1000 from this point and we have to save the image with maximum resolution the 3x so i have to download the image it will take some time and we would be able to download the image so then we will move this image to adobe illustrator and then we will make some tweaks to it we will add some labels and other and we can make other changes and before making those changes we have to convert this image to a vector file and for that purpose we will use the image trace option so let me finish with this file okay so there is a file let me bring this image to adobe illustrator there we have the image so if you have used the image trace option you should be familiar that we have to try different options and not every option will work for every single scenario but some options will work for some scenarios so we have to try so in this specific scenario we have to retain the green color and this black root color so uh silhouette so option will not work for it sketched art will not work for it black and white will not work shades of gray will not work yes three colors can work uh six colors 16 colors low fidelity high fidelity so these options can work for it so let us go with three colors first and let's see what are the results okay so there we have the only thing that is creating some problem is the the labels that we didn't removed so these were the part labels so if you do not want these labels you have to remove them you have to remove them from the from the style okay so go to the park section there we have the labels and you have to turn off the labels so then you will not get these labels on the map so now what we can do is we can click on this and just click on the expand now we have to ungroup it and now you can play with this map you can create your own custom maps so let us remove this section you can [Music] remove this section and [Music] for a very similar style that i have done here is what you have to do is you have to create a shape so let me ungroup it let me copy this shape okay let us move it to the other side so if you want to play this on your map you have to create a very custom shape and what you can do is you can just place it at the end of the road assign it a similar color and that's it okay and for removing this road what you can do is you can use different things you can use the this knife okay so i just need to cut this road so now you can remove this section from this section or you can just use a pencil tool to modify a shape so if i go from this point to this point so what i can do is i have to do the same thing at this point okay so this is how you can modify the shapes you can use a pencil tool or you can use a knife tool to modify the shapes and then you can uh you can you can use this map on websites or on mobile applications so how you can add the labels just click on the text button this text icon so let us write here main main bullet word okay okay so let me change the typeface so there we have the main bullet award if you want to place this main bullet word this label add this point for example so make it a little large so that everyone everyone can understand so actually you cannot add this kind of labels from the sneezy maps you have to add these labels by yourself so let it let us make it bold okay pop-ins extra bold let me create outlines of it and then we have to go to object path offset path and there we can decide that what color you want to give to these labels okay so make it white so this is how you can add the labels and then you can move this to to your website designs or to your mobile application design so snazzy maps is very useful for getting the very accurate results because at this point i have to [Music] i have to represent the exact location of the hotel so i cannot use a random map so i have to create a map so that users can understand that where this hotel is located so i just labeled the important uh venues the important uh locations near to this location so that people can easily understand so if if you are from lahore you are familiar that where is main boulevard goldberg and where is the liberty market so you can easily understand that where this hotel is located so this is all for my side this is how you can create custom maps and you can save the image you can make it you can vectorize the image and then you can edit the image so hope this video would be very useful for you uh see you in the next lesson thank you so much

Channel: Ahmed Qayyum

Views: 280,873

Keywords: google map, create google map, custom google map, custom map, create map, google map illustrator, custom map illustrator, vector map, vector map illustrator, map illustrator, create map illustrator

Id: EYAoYoZhIew

Length: 14min 27sec (867 seconds)

Published: Fri Dec 25 2020