I had no idea how to make custom maps, so I learnt by doing. You should too.

http://blog.untogether.co.uk/post/17554554409/i-had-no-idea-how-to-make-custom-maps-so-i-learnt-by

by untog • 14 years ago

210 23 14 years ago

blog.untogether.co.uk

untog6• 14 years ago

A brief introduction to the world of map making from a total amateur. I intend to write some follow up posts going into more detail on making iPhone retina tiles, tweaking leaflet.js and so on.

threepointone• 14 years ago

Hey, this is great stuff. I love how you matched the theme of your app to your maps; I haven't really seen that before.

srik• 14 years ago

You sell yourself short. The app and typography look amazing and it's pretty responsive, pity I'm not in NY, I would've enjoyed using it. You're selling your app for free, hope you find a way to make some money out of that; it's evident you worked a lot on this.

Question: Do you send the driver feedback to taxi company or is it just locally stored.

untog6• 14 years ago

Thanks, that's great to hear. At the moment the app is an entry in an NYC-based competition called NYC BigApps (hence the NYC-and-nowhere-else coverage). Some of the judges are investors (inc. Fred Wilson), and there are cash prizes, so I'm treating it as a sort of litmus test of whether it's an idea worth pursuing, expanding, etc.

Right now, the feedback is just local. But I've spoken briefly with city officials (who regulate the yellow cabs) about passing the information back to them. I'm keen to highlight good and bad behaviour so it would be awesome to have a "taxi driver of the year" sort of thing, alongside handling complaints.

As for the monetisation side of it- that's tricky as the app currently stands. But if it became a going concern I would probably pivot somewhat and make bookings through private car services (right now, the one thing it doesn't do is find you a taxi), then take a commission from that. All pipe dreams right now, of course...

wallflower• 14 years ago

Really nice job. The visual style of your app reminds me of another inspiring project:

http://benthebodyguard.com/index.php

mattmanser• 14 years ago

/ot rant

Sorry, breaking point with this particular UX anti-pattern reached.

What is with this new fad of useless and distracting menus appearing at some random interval when you scroll down? It's bloody annoying. I'm no longer bothering to finish articles it's so distracting.

I will never and 99% of your readers will never, ever search your site. So why shove the search box in my face at some random point when I'm scrolling down?

Pointless animations distract you when you're trying to read.

Stop doing it people, stop installing themes that do it and even sticky menus are bloody annoying a-la bootcamp. Remember frames? Ever stopped to wonder why no-one ever uses them any more? Cause it sucks. UX for blogs should be for reading. The only good reason for using a sticky menu is for an application where the menu is actually pretty important.

Sticky stuff on the side, absolutely fine, even useful. Sticky stuff getting in the way of the article? Bloody annoying!

/rant

untog6• 14 years ago

The behaviour you're describing wasn't my creation- it's part of the Tumblr theme I use. It doesn't bother me as much as it does you so I never looked into the options to see what I can do- now that I have, I see there is a checkbox that allows me to disable that behaviour.

So I have. Ta-da!

untog6• 14 years ago

I hope that no-one considers it too spammy if I say that the app I am discussing in the post is entered into a competition that has a public voting segment. It's doing pretty badly, so if you found the post interesting I'd appreciate a vote:

http://2011.nycbigapps.com/submissions/5832-taxonomy

It's one of 95 entries, and there's a great panel of judges (Fred Wilson, Naveen@Foursquare, VC investors and more), so anything I can do to get attention is good.

Even if you don't like it, the competition in general could do with some more "organic" voting, so if you've got a few spare minutes, take a look through and vote for some that stand out. You can vote once daily for each app.

justinph• 14 years ago

Thanks for the introduction to TileMill: http://mapbox.com/tilemill/. It looks really handy.

TheFuture• 14 years ago

Cool stuff. A lot of value can be added by designing your own map, vs the typical dump in a Google map and drop some pins.

This inspires me to try out TileMill on one of my own projects.

jarrettcoggin• 14 years ago

I really liked the blog post. I really like the styling. It has a very strong brand. However, one thing on using your maps. I have an astigmatism, which makes tall narrow characters hard to read, especially at an angle. Here's my observations:

- Look at WEST 8TH ST. Zoom in as far as possible, then zoom out one click. That was the easiest for me to read because it was higher contrast and the letters naturally had more space in and around the letters.

- WASHINGTON SQ N is almost impossible for me to distinguish. All I could make out was WA...TON SO N at first. I couldn't tell that there was a Q in SQ and kept thinking it was an O.

- I really, really like the map styling.

Hopefully that helps you.

untog6• 14 years ago

Thanks for the feedback.

This is something I'd thought about actually, but not really covered in the post: Google has, I'm sure, done hours upon hours of research into map clarity. Sizes, colours, fonts, etc. By switching away from Google I'm losing all that- and any updates they publish.

So it's a double edged sword. The good news is that I can keep iterating- I'm not happy with a number of the zoom levels as they are right now (labels not repeating often enough, too small text, etc) and in time I intend to go back and fix those issues. So thanks for the detail- I'll definitely keep it in mind.

In shorter term good news: If you're on an iPhone >=4, the retina tiles are considerably more readable.

epoxyhockey2• 14 years ago

As someone who spent the better part of the weekend hacking up all of the Mapnik style XML files, it is great to see how someone gets things done more easily in TileMill.

I decided to go the mod_tile / Mapnik route so that I could generate tiles on the fly, world-wide. I have to agree that map styling is a huge time drain! Not only is it difficult for a map novice, such as myself, to figure out what all of the different Rules mean, but then the OCD takes over getting everything perfect. :)

Great write-up and really cool map style! I haven't even looked into customizing fonts yet. ;)

kkaefer• 14 years ago

TileMill has an export feature: You can design your map in TileMill, then export the style as Mapnik XML.

epoxyhockey2• 14 years ago

Thanks - yes, I initially tried this, but I believe the exported format is for mapnik2, whereas the mod_tile package I am using seems to be for mapnik 0.7. I didn't really know what I was doing at the time and figured that I would edit the XML files that already seemed to be working.

simon_kun• 14 years ago

Hey Alastair, great post! Understanding OSM labels and so on can be pretty time consuming. You might like the mapdig library for CartoDB that lets you drill down into your spatial data to get a handle on what's what: http://vizzuality.github.com/mapdig/examples/osm_line.html (OSM london lines demo). Maybe next time :)

untog6• 14 years ago

That's pretty awesome. I'll definitely play around with this.

emeltzer• 14 years ago

Your map styling looks really great, nice job!

jrockway• 14 years ago

Interesting. What's odd, though, is the road layout. If you look at the interactive map, you'll see that it deletes major roads before deleting minor roads. If you go over by 23rd/11th and zoom in to the point where the transition between no-buildings and buildings occurs, you'll see the west side highway. Then, zoom out. The access roads to the indoor Chelsea Piers parking lots show up, but the the 6-lane highway disappears.

Odd. This happened the last time there was an article about make-your-own maps, too.

follower• 14 years ago

Looks very cool.

You might want to look at tile caching projects which might make the initial tile-generation take less time in exchange for only pre-rendering some tiles. (Perhaps less important in your situation but would be beneficial when you want to cover a larger area.)

I had a quick look at some options, this might work with your set up: http://tilestache.org/

melc• 14 years ago

very nice, i like the dark colour scheme however i would prefer to see a difference between the colours of the streets and the sea.

digitalclubb• 14 years ago

Is it just me or does that map functionality throw a wobbly in Chrome on Mac?

By using a magic mouse and a single swipe backwards/forwards - which is to zoom in/out respectively (similar to a mouse wheel), causes the page to freeze and for Chrome to kill it due to it being unresponsive.

This functionality works fine on the generic MapBox demos.

It's a shame because custom maps are a good idea, especially when you have so much flexibility over the styling, I just like using gestures to make zooming that little bit easier.

jorisw• 14 years ago

leart -> learned

I had no idea how to make custom maps, so I learnt by doing. You should too.

Related Stories