Designers’ Portfolios made using Google Maps
Sep 1st,
2009
Some designers out there are taking advantage of Google’s free technology to create innovative portfolio sites. Using the technology built into Google Maps, designers are able to make portfolios with different levels of information while using a navigation that is familiar and intuitive. Google Maps Mania, a blog devoted to customized Google Maps applications explains it better than I am able to:
Using an application, like CASA’s Image Cutter or the Automatic Tile Cutter, you can create your own map tiles for Google Maps. It is therefore possible to replace Google Maps tiles with other maps. Among the first to take advantage of this were game fans, producing maps for World of Warcraft and Grand Theft Auto. Graphic designers and artists, however, soon woke up to the fact that the the Google Maps interface is a great way to present a design portfolio. All you need to do is create map tiles from a collage of work. The Google Maps’ navigation tools can then be used to zoom in on designs and map markers to provide further information about an individual work.
Check out the work above of Kalle Hagman, Markus Dreßen, and Blaubo Design.
(via GoogleMapsMania)
Posted by: Ricky | Tags: inspiration, portfolio
I don’t know…not sure I like it…feels like just one big jpg…sorta like sites I used to see 10 years ago…but then again I have to give props for the creative technique.
Anyone come across a good tutorial from start to finish for making a basic custom map?
After many false starts, I managed to create a Google Maps splash page for my site. I found that the easiest method for creating the tiles (and then getting them into the Google Map format correctly) is to use this tool: http://gmapuploader.com/ by Kyle Mulka. All you have to do is upload your image and it outputs a functioning html page, which you can copy+paste and modify to your liking.
And then you can follow the Google Maps API to put in markers and info windows, etc — you can do some cool things, although it is rather confusing if you aren’t that handy with javascript. I jumped back and forth between the API notes and other GMap portfolio sites’ source code to figure out how to implement all of the overlayer elements.
Hope this is helpful to someone!
Kelli – your site looks awesome – great work
Could anyone please make a tutorial? Maybe youtube. (even just a quick one!)
I have tried for a week now, at i just can’t figure the whole process out! :)
Thanks
I have built a web application (www.piritiles.com) which lets you create Google Maps out of your own images with a few click, to do this very easily. Check it out!