Skip to main content

Embedded Maps in Websites

Embedded Maps in Websites

A client has reached out to the Web design team to see if we could create a interactive map for his construction company. He would like a map the could zoom in and out along with added pins where he had done work for people. Finally, he said he would like to be able to hover over, or click on the pin to make a tiny box pop up that gives a description of the work that had been done and a review from the customer. He gave the example of  zillow.com as something that he was shooting for ( image to the left). In this case, Zillow had embedded a bing map into their site and had separate codes for the different points. I think that it might be possible that they used the info from people who have accounts to enter in all the addresses.

I did some research for other sites that had done something similar. One example would be Walmart.com. In this website they had a find a store near you tab hat had a google map that had been embedded into the site. I could not find the code that tagged each Walmart, so I believe they had google use their information to tag all the Walmart's  location, hours, and services available. 

The other website that I found is Sprint.com. Sprint was unusual. in the sense that they were one of the only websites that I found that had created their own map, or at least as far as I can tell. They had codes for their zoom in and out button and had separate functions programmed in for each of their stores. Based on looks I would not consider this the best map, but observing the code for each and every function was pretty cool, however I do think it is a little unrealistic for this project and this client. Especially since he would like to be able to update the locations, and reviews himself.

With all of these limitations taken into consideration, I think that the easiest way to complete this website for this client would be a similar way to the way Zillow did it. A google map would be easy enough to link into a site, plus the client would be able to plug in his own data because he would have addresses available and he could ask them for review on his site also. Whether this is achievable or not, I'm not sure since I am still a very beginner web designer. However, this would be the route I would take to complete this website.

Comments

Post a Comment

Popular posts from this blog

Manny's Marbles Critique

I started thinking about the round playful aspect of a marble. Thats how I decided on the soft-edged font that is thick. I molded it to a circle because it showed off the marble aspect. Next I thought of how a marble bounced so I added the motion aspect to my logo. I tried to make the Marble 3D by adding a gleam.

Famous Logo Tutorial!

Google Play Logo!  This is the Google Play logo that I made with a tutorial. The logo was surprisingly easy. The most difficult part was creating the correct gradients to try and match it the best I could. Along with messing around with the opacity. I had a tom of fun making this logo and it only took me about 15 minutes to create!   

Redesigned Portfolio

Wow. I am so happy with my portfolio. I think that is sleek and really shows my personality, and my aesthetic as a designer.  am really proud of how much I have learned in web design this semester. I know I am a bit off track, but I feel accomplished. My portfolio is not done by any means. I have a few things left on my to do list. I would like to like my O.P.E.N website to my portfolio along with my TV25 website. I also completely forgot to include my manny's Marbles site, which I think could add a lot to my site. I also need to delete/add links to the social media buttons after the contact page. I would say that I am very close to the finish line though. Overall things that I struggled with in this project is the header picture, the colors, and the portfolio photos. The header image took a combination of all of the adobe programs, and some assistance from Ava's photography skills. I needed an image that had a white background. So I set out into the hallway to take som