Hi HN, I made Back Of Your Hand, a map-based game where you're given random street names and you have to locate them on the map. You can play solo or compete with friends on other devices.
I made it for my dad as a Christmas present. It also gave me an opportunity to learn about geocoding, etc.
Tech: serverless, Leaflet, Turf, Svelte, TypeScript, Cloudflare pages. I tried to use as many open / free tools as I could. I originally used map tiles from OpenStreetMap but they were discontinued so it uses Mapbox and Maptiler now.
First of all: it's really cool and fun! Congratulations!
As a small feedback: adjustable radius would be more fun. For example in the town were I had my childhood, this area is too big and takes other neighbourhood/cities that I don't know, but for where I live now it fits great.
Again, nice job and congratulations for making it!
Another thing is that it seems you are sampling with replacement. I placed a circle in a rural area (where I grew up) and in one round I got the same street for 3/5 of the selections (and there were 10+ streets within the radius).
The circle is a bit large as in larger than a single neighborhood for my city. I feel like the game is useful when it asks you how well you know a single neighborhood. It’s less interesting when it asks you how well you know 2.5 neighborhoods.
Thanks for the feedback. I'm considering adding difficulty modes or a way to change the radius. I'd rather that people wouldn't get a perfect score too easily though
I think it’s more important for the game to be meaningful than difficult. How well do you know a neighborhood is deeply meaningful. How well do you know 2.5 neighborhoods isn’t. I’d strongly recommend sacrificing difficulty for meaning here.
It’s def a good positive reinforcement to give people a good feeling that they know their own neighborhood.
Having the next 1.5 neighborhood is also valuable: if you live so close, it’s not a stretch to go learn the neighboring neighborhood (in fact, why not!?).
There maybe a level of “insult” (you don’t really know your ‘hood outside of the 5 streets), but used positively, I think the game is great.
This is relative to the density of where you are playing. The default radius out in rural areas doesn't have enough roads, for example. A customizable radius or geofence sounds appealing.
I agree (and what you want out of the game). I wonder is there a "number of streets" which is a better sweet spot / a better default, rather than a radius
I enjoyed it! worked reasonably well for the city I tried. I did have a few nitpicks, but they are mostly datasource related as opposed to anything you can control - the several rounds i played included a pedway system, several walking trails, and a private driveway. Only change I might suggest making is the radius of the pin - getting a 99/100 for being 6m off because the pin didnt go exactly where I thought it was. Or is there any way for the pin to snap to an object?
I want to chime in as well to say I felt the circle was too large, I know districts in cities vary in size a lot but, but the game covered ~6 with mine in the middle. Checking the village I grew up in also covered the edges of three towns around it and a neighboring village.
I think it would be useful to use actual boundries of villages or neighbourhoods instead of circles. Not sure how difficult that is.
(the required data is in OSM, at least in germany)
I think a difference with Wordle is that we're playing different neighborhoods and different streets every day, so a "cheated" perfect score would have little meaning. And I think when people share their Wordle results, it's often a "wow, I lucked out on that guess" or "phew, almost didn't get it".
Perhaps the ability to choose the sample area could be based on the zoom level and hidden under a settings cog?
My hosting provider (Cloudflare Pages) seem to have a limit on "functions" I cannot increase. I've worked around it for now but it might open at Cork for everyone. If so, you can zoom out and tap the map to select somewhere else.
OK I'm done with fighting fires for now and can answer that last question. Cloudflare offer "functions" and "workers", they're like functions that run on the edge CDN nodes.
These functions receive geolocation information via a function argument. So I've a function that intercepts requests to the app, grabs the geolocation information, and rewrites the URL (inserting the coordinates e.g. /lat,lng).
I go into more detail about this in the blog post but originally it just opened in Cork for everyone. I disliked the idea of having an annoying browser prompt for location permissions. I made it for my dad so having no geolocation was fine to begin with and I eventually added the geolocation I described above. Less friction, no extra client-side requests.
Those "annoying prompts" are there for a reason. How do you justify ignoring the users' wishes with regards to accessing personally identifiable information?
Yep, but not worth ruining the UX for marginally better geolocation in my case.
> How do you justify ignoring the users' wishes with regards to accessing personally identifiable information?
I don't know what you're referring to. If you're suggesting I'd prefer that apps & sites could access our location without asking, you're mistaken.
>Also, why WebGL?
The no-streets OSM raster map tiles were discontinued and I had to switch to custom Maptiler layers. They don't allow raster map tiles on the free plan.
Dropping a pin close enough on mobile to get 100 points was really difficult. I probably was only able to average like 12m accuracy even though the pin appeared to be in the correct place every time.
I also did my area twice and around 6/10 were either numbered or major roads that are very easy to ID. It might make sense to deemphasize larger or longer roads and numbered roads for a better balance of true local knowledge.
I found the game easy in an urban area where I've lived for only three years, but impossible in the rural area where I grew up. It seems to pick main roads in urban areas but in rural areas I get random side roads and cul-de-sacs. The circle should be much bigger in rural areas because people typically drive longer distances. Most of the roads I actually used were outside the circle.
This is really cool! Could be a great training tool for first responders sitting around the firehouse waiting for a call. FFs/EMTs enjoy any chance to earn bragging rights over each other.
Fun game, great job, but sometimes the scoring seems kind of random, I would sometimes get ~80 points when placing it pretty much directly on the street, and then sometimes get 90 points when guessing and being a few blocks away...
Along with what you mentioned about having different difficulties in terms of radius, would also be fun to be able to choose the difficulty in terms of what types of streets (main streets vs side streets - e.g. only one type, or a mix, or turning down the selection of numbered streets somehow)
I would suggest using intersections instead of streets. I'm not sure how it determines what segment of the street is correct, but I had some random guesses score higher than the correct street I knew but a part that wasn't highlighted in the result set.
only bit of feedback I have is that the street names may need some cleanup / filtering of some kind.
I picked a starting location in downtown Seattle (47.60882,-122.33087) and was told to locate "escalator"...it seems to have picked the escalator to the Pioneer Square light rail station as a "street" to be located.
how does this get my location? I use a Cloudflare WARP+ which seems to mask my IP for most sites but this one looks like it’s using a nearby cell tower?
I don't know exactly but I use the geolocation information Cloudflare gives me in my edge function/worker. It's not 100% accurate or reliable. Your result can vary minutes apart or depending on which network you're on.
This would be actually helpful practice for first responders. FDs/EMS in my area are expected to memorize all of the streets in their region, and I imagine it’s the same for PDs too. Another layer on top of it would be to quiz you on how to get from a fixed point (the station) to a random intersection. For the US, you could also provide a random block on a street rather than an intersection.
For those unfamiliar Blue Book refers to test "runs" done by London taxi drivers when they do The Knowledge[1].
It would be fun to be given, say "Australian High Commission, WC2 to Paddington Station, W2" and have to place multiple pins on the map and then graded on your result.
So is the goal is to mark the route you would take? Sounds interesting.
Semi-related, it could show you two pins and ask you how long it would take to drive between them at a given time of day. It would compare your guess to Google Maps or similar.
> So is the goal is to mark the route you would take? Sounds interesting.
Basically yes, the Blue Book works on turns so you would mark the turns.
So for the example I gave above (Australian High Commission - Paddington) you might mark the turns:
ALDWYCH
CATHERINE ST
RUSSELL STREET
DRURY LANE
HIGH HOLBORN
PRINCES CIRCUS
ST GILES HIGH STREET
EARNSHAW STREET
NEW OXFORD STREET
OXFORD STREET
GT PORTLAND STREET
MARGARET STREET
CAVENDISH SQUARE
HENRIETTA PLACE
MARYLEBONE LANE
WIGMORE STREET
DUKE STREET
MANCHESTER SQUARE
MANCHESTER STREET
GEORGE STREET
EDGWARE ROAD
HARROW ROAD
HARROW ROAD ROUNDABOUT
BISHOP'S BRIDGE
> between them at a given time of day
Yes, I guess it could give you extra points for choosing less busy routes during rush hour.
Neat. Unfortunately appears to be limited to streets in your local area. I hoped/expected a list of interesting destinations in the area such as art installations, parks, or even popular restaurants etc.
The geography student in me likes that the questions are bounded by your watershed.
As someone who grew up in a warm country I am also amused that the growing season is hinted as being bounded by the number of days from frost to frost.
I tried 2 areas: where I live today and where I delivered pizzas 20 years ago.
3/5 for my local area, 5/5 for my old stomping grounds. I’m no London taxi driver, but I do have a bit of Knowledge about my old neighborhood. We didn’t have GPS back then and we liked it!
The size of the circle was perfect. Just large enough to challenge, but not so large that random tiny streets miles away trip the player up.
This is crazy hard it covers my whole city and parts of the metropolitan area. I guess you will have to play this a lot to get any good at it if you are living in a medium sized city in central Europe. :)
Edit: I think you should be able to make the radius a little bit smaller or add an option to choose from different radii.
Also, your dad is 99% of the way to having an enormous "memory palace" if he's got all of Cork memorized. All he needs to do is imagine a walk between any two points in Cork, then imagine the things he wants to remember at different places along that journey, such as at every intersection. To recall, simply imagine repeating the journey, and the remembered items will be at the intersections. Digits of pi or the order of a deck of cards are a good way to test it, and the cards bit is great for pub tricks and free beers.
There's a tiny distance between this game and actual mnemonic techniques used by world champion memory athletes. Method of loci capitalizes on the fact that the brain stores memories using a map like structure, as a result of grid cells.
If you can, get a cabby in London with "The Knowledge" to do a session. Such cabbies are among elite humans, of a handful of disciplines known to alter the structure of their brains in a predictable way. Like Shaolin monks, Australian aboriginal shamans, and others, they've got an amazing superpower.
Neat game, and fascinating peripheral subjects, thanks!
Fascinating, thanks! I knew of memory palaces but I hadn't considered taxi drivers! Can't wait to tell my dad someone on the internet said he's a genius :P
Very nice. I actually wanted to concoct something like this for Anki, with large streets of the city—since in this sprawl I sometimes only vaguely know what's on the other end of it. But didn't think that web maps could serve me for that.
Some minor nitpicks:
- If you could allow zooming in/out with double-tap-and-drag on phones, that would be cool. Specifically it would help with one-handed use.
- On a ‘square’, the road can go right around the pin, so the distance is measured inside this circle, and I get <100 points. Frankly I should've guessed that this would be the case, but kinda prefer that the app would do it for me.
- Perhaps there's not much use in offering streets that only have like a hundred meters inside the radius—especially since the page doesn't allow scrolling outside the circle, to more comfortably tap the street and not aim at the small chunk of it.
- OTOH it would be better if I could scroll somewhat outside the circle, to have the streets in the middle of the screen where it's more convenient to look and tap.
As a side remark: using this in European-style compact cities, especially in ‘old towns’, can be quite a hardcore mode. In the 19th century, the region in the circle comprised the whole city and some outskirts, so now there are a lot of old streets in this area. And with my smaller native city (half a million people), the circle covers most of it.
OK I can try to come up with better randomization.
About the road, this is due to a discrepancy in the OpenStreetMap data and the actual map tiles I'm using. Hmm. Not sure what I could here. Maybe I can be more lenient when you're two pieces of the same road
I failed completely because in my selection (US: Boston/Cambridge) there are multiple streets with the same name like Broadway and First Street, and I always picked the wrong one.
If they have exactly the same name then you should've gotten points. If so, please give me an example and I'll fix it. If it was "Roxbury St" versus "Roxbury Ave", then you're just unlucky sorry
Yeah, this is killing me. NORTH WOODWARD AVE turns into WOODWARD AVE turns into NORTH WOODWARD AVE turns into SOUTH WOODWARD AVE turns into WOODWARD AVE turns into NORTH WOODWARD AVE completely at random, and none of them count as each other. And sometimes multiple parts of the same road show up in the same quiz.
I know this is fundamentally an OSM data problem, but it's also your UX problem now. (N 42.5, W 83.17 if you want to have a look.)
Also it was quizzing me on park trails. And I just got an underwater tunnel at the zoo. I guess those are technically named ways in some manner of speaking, but they're definitely not streets with signs.
All that aside, this is really fun! Personal best 470/500. I wish I could make it longer; n=5 is a small sample and my scores vary tremendously from one run to the next.
All the different variations of names of the same road definitely made the game too frustrating to play much in my area. Simply counting all names that are only different by cardinal direction as the same name would solve it. I imagine in some places though this would be the wrong behavior.
Yeah, I figured out it was a park trail, clicked in the middle of the only park in the area with substantial trails, and actually scored very well on it. But the zoo exhibit...
Great game. You may have a viral hit on your hands.
A few comments:
I tried it first in Yokohama, Japan, where I have lived for more than twenty years. It worked well. Although most streets here don’t have names, the game called up the names of bridges, highways, and even a moving walkway, which was fun. I then tried Osaka, which I have visited many times, and it worked well there, too.
In both cases, the names appeared in Japanese script, which works for me because I read Japanese. If the OpenStreetMap data for some locations is multilingual, you might want to give users the option of choosing the display language for the choices. Also, you might offer a wider range of landmarks for people to choose from. In Japan, the names of districts, buildings, parks, railways stations, bus stops, rivers, and mountains would be nice to include. I tried Manhattan, too, and half of the choices were numbered streets and avenues, which got boring quickly; the names of buildings, squares, parks, etc. would make it more interesting.
In the two Japanese cities, after I entered my choice, the map highlighted the correct location with a dotted line leading to it; I assume that was the intended behavior. When I tried it for Pasadena, California, where I grew up, and Manhattan, though, that highlighting did not appear and the dotted line just went off to the left side of the screen. I used Safari on MacOS. See the following screenshots:
>the OpenStreetMap data for some locations is multilingual, you might want to give users the option of choosing the display language for the choices.
This is something I planned to. I actually do it for Ireland. I show the Irish and English version of the name. And the sign is in the style of real Irish street signs. I just need to do this for more countries.
> Also, you might offer a wider range of landmarks for people to choose from. In Japan, the names of districts, buildings, parks, railways stations, bus stops, rivers, and mountains would be nice to include.
I'm going to look into expanding the objects but it's tough to keep everyone happy. It can be area-dependent.
>that highlighting did not appear and the dotted line just went off to the left side of the screen
My hosting provider (Cloudflare Pages) seem to have a limit on "functions" I cannot increase. I've worked around it for now but it might open at Cork for everyone. If so, you can zoom out and tap the map to select somewhere else.
Thanks. I've confirmed it's back but then somehow Cloudflare started served an old deploy again for some time and now it's back working again. I didn't change anything. Ugh.
Same here. It was working when I first visited 10 minutes ago, but I got an error at some point and now it won't load (multiple browsers, multiple computers).
Love it! As many pointed out, playability is quite dependent on where you live. Perhaps you could also use landmarks rather than streets, but I'm guessing OpenStreetMap POI data is not as robust as Google Maps... And Google Maps Places API is expensive :)
This is fantastic. My gf and I have been playing it in a cafe, and doing abysmally - but just sent it to our parents who will greatly enjoy quizzing themselves! Thanks, you've made our day a little bit funner and help keep our families a little bit closer.
Great game! The one "unfair" question I got was "Treppe Tiefgarage" which means "Stairs to the underground parking garage". Difficult to figure out how to filter these out in the general case.
Pretty cool! As a suggestion it might be a good idea to copy one of Wordle's simple-but-genius features and make it easy for users to share a text based summary of their results with others.
Might be better to base this off of buisnesses and landmarks in your area. I know mine quite well but fucked if I know where some tiny side street with a common name is. Maybe that works better with American style suburbs and grid cities, but in Europe it's pretty difficult if you are not specifically a delivery person or taxi driver.
I used to be a Lyft driver, and something that seemed would be interesting at the time is a system, not unlike this one, for learning a city. In London to drive a cab you must do this super difficult test, and this means cabbies are very knowledgeable about the city. This is something in that vein, love it.
Reminds me of this study [1] from awhile back where brain scans at University College London revealed that “part of the hippocampus grew larger as the taxi drivers spent more time in the job”.
Interesting. Did something similar with a self hosted version of geoguesser with my friends. We set it up right near our school. We have multiple routes walking home and the amount of precision we could get was insane. One of my friends was able to get only a few meters off from the original position almost instantly.
I found it more fun than Back of Your hand just because I frankly don't remember too many streets but can recognize the overall area from walks I go on.
Depends on what you're looking for but I think this would be more fun if it excluded very tiny streets, like minimum length. I got what is essentially a driveway for two houses that's not paved or labeled, nobody would know it's name (or that it was a named street even) unless you lived on it or next door to it. (I live next door to it). Might be less fun if someone got that on their first try.
But, again, some people are looking for a challenge, so maybe make it an option.
It's interesting seeing so many different opinions on the difficulty (whether it's street length, circle radius, etc). I wonder would the same people's opinions on GeoGuessr correlate or not
I did where I live now, and only got 100/500 (perfect score on the major road, no idea where the rest were). I did my childhood home and got 99/500.
My suggestion would be to stick to majors and semi-majors (longer through streets). It would be more fun that way.
Also there may be a bug, for the one road I got in the second try, I put the marker dead center of the entire road, but it said I was 4 meters off and gave me a 99, even though the green line was under the pin.
> I'm thinking about what to do around street length & difficulty
Here's one idea if it might help you get started (though you can polish it):
- Mark all "dead ends".
- Mark all private streets.
- Recursively (or perhaps I should say iteratively, depending on your POV) mark all roads as X that only lead to previously-marked roads.
- Non-recursively, unmark each marked road that is both adjacent to an unmarked road AND that satisfies some reasonable heuristic (such as "being within 2 intersections of the center of your circle").
- Also unmark all freeways/highways/expressways/other reasonably-major roads (although few if any of them should be marked at this point)
- Delete all marked roads from your list of candidates.
This should ensure that every candidate road actually has a non-negligible chance of being at least seen by random drivers, and not just by residents who are forced to drive on it on the way home.
OK thanks but I do need to compute all of this. Plus some roads are broken into a lot of segments so I have to do more work first in finding & joining them up. Hopefully I could do all of it but just saying, it might be too much.
Hey, It's a really fun app. Congratulations on the launch!
Some small feedbacks:
- The radius should be adjustable
- Compete with friends (Can make it viral)
- Don't know how it calculates the point. Sometimes I choose the place very far from the target but I've gotten a higher score than the time I chose the near one.
Yes I will be working on an adjustable radius (I made it 20% smaller yesterday btw) and difficulty modes.
>Compete with friends (Can make it viral)
You can compete with friends. Click "Learn more" to figure out how to do that. I will also be looking into a "share score" functionality as well as leaderboards maybe.
>Don't know how it calculates the point
I'm aware of an issue in how the distance is measured and will fix it. Sometimes there can also be a discrepancy between the data and the rendered map.
I'll look into this. Since I wrote that initially, the no-streets OSM map was discontinued so I switched to Mapbox & Maptiler. But I do use two full layers (one custom one without street names) rather than doing what you suggest. Hopefully it's not a paid feature.
Minor feedback: the game amusingly asked me for the street I live on first, so I tapped it, but it said I was 9m away. When I zoomed in very close, I saw it was calculating a diagonal from the pin to the nearest intersection rather than a perpendicular line to the street.
Might be worth accounting for the zoom level for taps / adjusting the distance. I did this on iOS.
One question, though: how are you calculating distance from a street? Here, I thought I was pretty spot on for a street, but it still said I was 56m away.
On my map it seemed like the road consisted of a few points, rather than the points plus lines between them (or however it's described). Selecting intersections (maybe bends?) lowered the distance.
Yes this is something I need to fix. I think you're right. I think it's measuring to the nearest node on the road (in the OpenStreetMap data) and not every point on the line as we see it. It could be related to the fact that some roads are actually broken up into multiple with the same name, not sure
It's "serverless". I don't have a web server of my own and there's no database.
The first iteration was very fast. I got 100 in every category in Lighthouse (but that doesn't cover everything of course). It used OSM raster map tiles. The no-streets map tiles were discontinued so I had to switch to using custom Maptiler map layers via Mapbox. Still more than fast enough IMO. I aggressively cache the Overpass data per area.
Then I migrated to Cloudflare pages to access their geolocation information via an edge handler. That slowed down visits without a LatLng in the URL because it does a couple of redirects.
Then today I had to fight multiple fires due to traffic and usage limits. I managed to workaround all the issues as they arose but the routing of page loads isn't ideal right now. Cloudflare are raising limits for me at midnight UTC so I'll be moving back to the faster setup again.
Not sure the selected area is suitable for a city like London - there are just too many small streets in every directions to be able to know them all, or even half of them.
It's possibly more suitable in US cities for example that are divided into large blocks and large roads.
I noticed that some areas pop up more than others. Is there like a difficulty score that you are calculating in the back? Making it easier is definitely a challenge, I’d guess. The major landmarks simply matter more.
But, I LOVED playing round after round in Amsterdam, learning more about a city I definitely don’t know like the back of my hand!
MCQs for marked areas would be nice— guessing the name of a place given a location.
Nah it's pretty dumb right now. All I do is filter out some names like "Alley" and join same-named streets.
I don't want to make it too easy but I have gotten a lot of feedback today about difficulty (area boundary/radius, street length, etc) so I'll make some changes and hopefully I can keep going in the right direction.
Another idea I had was to add hints like maybe you could have a special button you could press once per round that would shrink the circle for the given street and then go back to the normal size next round.
If you simply calculate the average error, you could A/B test the effect of a version with reduced difficulty (e.g., with areas with have >5-10% success) vs random. I imagine people will play longer when they get some correct. What difficulty level do you think is appealing? I was at about 5-10%. I think 50% would be more engaging. By improving difficulty, you’d have the side effect of focusing more on more important locations.
This is amazing, fun and educational in one package! Thank you! Sorry this post got very long ;-)
Having difficulty settings like
* tourist
main streets / squares, maybe some (renowned - although that might take some additional Wikipedia/Wikidata data sources :-))
landmarks if those can easily enough be extracted from OSM data
easter egg mode for s/Paris/your favourite City with underground transportation/: find a specific metro station :-) (any entrance would count)
* resident
"tourist" + smaller streets + any street really close to the circle center (15 minutes by foot / 5 minutes by car
-- oh, you'll just have to add flooding algorithm :-) ^^)
* pedestrian
"resident" + smaller streets everywhere but with greater probability closer to the circle center + footpaths
(although with them probably lacking proper names most of the time that could be hard - but you could include
e.g. streets from pedestrian zones)
* taxi driver
everything ^^
would be great :-)
And then there could be (best optional) penalty modes, too:
* "resident"+:
if you pin a street that is more or less orthogonal to the target street
(say their mean directions intersect at more than 45 degrees ; and the pin is sufficiently
far away (30m / 10% of map height / half a block?) from their intersection (if any exists)
to rule out precision errors) you get only 1/2 the points
* "resident":
if you pin a street the wrong direction off a main street (and the target street
does not cross the main street) you get only 2/3 the points
(i.e. main streets intersecting the plane and you picked the wrong "half")
"tourist":
the same but for cities with rivers where you picked the wrong bank
I also found the circle a bit big for my taste/confidence and cheated a bit by not placing the circle center at my location but so that I would still get my neighborhood but more of the outskirts than the city center...
I also got very lucky with the streets, so got 330/500 on my first try.
One was certainly also due to a square that is also used (at some specific times) for car traffic.
As an interesting effect, I got the first street wrong by some meters (and orientation :-\) and the 5th street was the same street again.
At first I was a bit puzzled, and then got full marks for that one :-)
I saw that you got the report of repeating streets already in some other comment already but that experience led me to another idea:
It would be a great learning aid to (optionally) go through the (widely?) missed streets again after the 5 rounds.
And if we could even re-claim some (small) amount of points for getting them right the second time that would certainly help our brains etch in the correct position even more :-)
A small aside: I found it pleasantly devious that the circle restricts the scrolling at higher zoom levels! Just in the cases where the target street is very close to the border it might be nice to relax it a bit though...
And while trying it out on Desktop I discovered a possible bug:
While choosing the location, when pressing the "Zoom In" button 2-4 times suddenly street names were displayed again!
Is this intentional so people can easier find their starting point?
Firefox 98.0 on Linux
My last point:
Would it be possible to export a map view to print it out in good quality for offline reconnaissance / tinkering?
I love the idea of difficulty modes like "taxi driver". That might help in making everyone happy; people have wildly varying opinions on difficulty.
>A small aside: I found it pleasantly devious that the circle restricts the scrolling at higher zoom levels! Just in the cases where the target street is very close to the border it might be nice to relax it a bit though...
You're the second person to mention that some amount of over-scrolling would be helpful so I'll add that soon.
>While choosing the location, when pressing the "Zoom In" button 2-4 times suddenly street names were displayed again! Is this intentional so people can easier find their starting point? Firefox 98.0 on Linux
OK thanks. I think this is just that the map tiles didn't load quick enough and you saw through to the layer with streets. I'll look into it soon.
>Would it be possible to export a map view to print it out in good quality for offline reconnaissance / tinkering?
I'm not sure what you mean here. Can't you get maps elsewhere? Or do you mean the final screen where it shows the maps with the 5 streets marked out?
I couldn't even find my street to start from. I think it's safe to say I don't know my local area.
(I'd probably play a version where you could customize the area radius, though! ...I'd probably still lose with a radius of like 3-4 blocks, though...)
adam, I loved this and also shared it in my family WhatsApp group. we all had a lot of fun playing it, thanks for the great idea and execution!
one minor suggestion: consider adding a cross or some other indicator at the circle of the screen during the map selection stage. I found that sometimes you want to move the circle a few metres in some direction, but it's difficult to guess/tap where the new center should be without knowing exactly where the current one is.
good, nice to play with!
For India, it would be a bit difficult to play as the roads are some times numbered and some times given a name. Dont see any hint buttun!
I've considered adding hints. Do you have ideas? Mine:
1. Give names of intersecting streets.
2. Reduce the circle by half (just for this street).
3. Show a photo.
4. Allow you to drop a pin and tell you the distance (but not the direction). Then you can confirm the pin or move it one more time.
The streets in my town were not completely highlighted and counted off points. I assume that is an issue with how the shape is interpreted because the street name changes in a turn that isnt a clear intersection.
If you could give me an example, I'll look into it.
I ran into issues like this with a strange streets (described here https://adamlynch.com/back-of-your-hand/#the-lioscarrig-driv...), so I consider any two streets with the same name in the OpenStreetMap data to be the same street. I.e. if you put a marker down near any of them, you get points.
However, if the section of road has a different name, then it's different.
It must not have been able to detect where you are located. You can zoom out and click/tap the map to choose the location. And it'll remember that location next time.
It defaults to Ireland in this case because I'm Irish.
Thanks. It's a third-party server-side API I use so it would be just based on your ID address I think. You can go here to see where it thinks you are: https://cloudflare-pages-geolocation.pages.dev. However, this can change if you reload it minutes apart or if you turn on/off WiFi, etc. It's not 100% reliable
Maybe. It uses the geolocation information Cloudflare provides. In general, it isn't extremely accurate and it doesn't always return the same location, so this doesn't surprise me too much.
If it consistently works in one and not the other (at the same point in time), then the only difference I can think of is that Back Of Your Hand uses their "edge handlers" / "functions" and I made that other URL with their "workers". Hmm.
---
Maybe I could inform the user somehow when it cannot find a location at all. I really want to avoid a browser popup asking for the user's location though
I could've sworn I made sure not to include it when submitting. It does redirect to that if there's no location found so maybe HN updated the link to the redirect destination?
I'm pushing a change now to ignore this specific lat-lng combination and fallback to geolocation
I basically failed because almost all of the selections were random tiny roads in subdivisions (thanks Atlanta sprawl). Got all the roads with thru traffic though!
Same area. There's a hundred or more tiny subdivision roads for every major road. It would be better to omit roads under a certain length entirely since it's not reasonable for someone to know all the roads in a subdivision they never have a reason to visit.
First I used OpenStreetMap tiles (and no Mapbox) but the no-streets one was discontinued. So then I created a custom map layer with Maptiler and used Mapbox-GL because Maptiler's free plan only allows that.
I use Mapbox and Maptiler on the free plan. They both have limits but I haven't ran into them yet. And I've seen a LOT of page views today.
There are probably features I don't use that trigger limits more easily though.
This morning I hit the Maptiler free plan limit. I now pay $30/month for it (annoyingly they don't include sales tax in their displayed prices). I think the limit goes a long way though
Great! Not yet, but I am looking into it. A lot of the feedback has been around the difficulty and the radius. So I might add difficulty modes and or a way to change the radius.
Thanks. I'm glad to hear that because I put effort into mobile. I thought it would be my older family members that would like it the most and use it on phones or tablets (I was right)
Hey Patrick, there are buttons to zoom in & out in the top right of the map. You can then click/tap on any town / anywhere on the map to set the location.
And it'll remember that location next time.
(You can also click and drag the map to move around)
On iOS, the two finger manipulations (drag and pinch zoom) worked very well, then a single tap to place the game area. I was pleased at how fluid the map manipulation was; nice work!
Yes but it should be back now?
My hosting provider (Cloudflare Pages) seem to have a limit on "functions" I cannot increase. I've worked around it for now but it might open at Cork for everyone. If so, you can zoom out and tap the map to select somewhere else.
Hey Adam, it's pretty fun! I agree with some of the other posters that landmarks and businesses could be a good addition.
I did have some trouble understanding how it's calculating distance and drawing the dashed line. It does not always draw the shortest distance from the pin to the polyline for the road. I tried a few rounds with some deliberately wrong guesses and I'm still not sure I know what it's doing. Some examples:
(1) A road that runs from southwest to northeast. I placed the pin to the southeast of the road. Eyeballing it, the shortest distance is roughly northeast. The dashed line was drawn 10-15 degrees east of north. If it's significant, it drew to an intersection (not the nearest, but reasonably close).
(2) A road that runs east-west. I placed the pin north of the road by 50-60 meters. The dashed line was drawn 15-30 degrees west of south. It did not draw to an intersection or other point of interest. It may be drawing a ray from the center of the circle of interest.
(3) A road that runs north-south. I placed the pin east of the road by 40-ish meters, near the north edge of the circle. The dashed line was drawn 15-30 degrees west of south (my guess in #2 about a ray from the center was wrong), to an intersection, giving a 102 meter distance.
(4) A discontinuous street. (Replicated for a different street! 4th St and 5th St in Marion, IA, if it helps.) The street runs north-south but has a quarter-ish-mile gap. I placed the pin not far from the southern section of the street. The dashed line was drawn from the pin, past (and nearly parallel to) the southern section, then connected to the southern tip of the northern section. Interestingly enough, the distance looked like it was pin-to-southern-section.
(5) A north-south road in rural Iowa taking advantage of the 1-mile grid. I placed the pin near the center of the circle, slightly less than one mile from the nearest point of the road. It drew the dashed line northwest and showed a distance of 2002 meters. I would have expected due west, and ~1500 meters.
(6) A road that runs north-south (with a bit of southeast a half mile south of the circle), that happened to just barely peek inside the circle on the far west. I placed the pin near the outer edge of the circle, roughly northwest. It drew the dashed line nearly due south (several miles!) but reported a distance of 281 meters.
Sometimes the distances seem reasonable even if the dashed line is drawn to a different point on the road. Sometimes the distances and the dashed lines both seem to be off. Intersections seem to have something to do with it, but there also seems to be something else going on too.
For testing, if you're interested, the intersection of "White Road" and "North Alburnett Road" in Iowa (between Marion and Alburnett) is great. It's sparse, gives you nice straight roads, with just a few driveways and other points-on-polyline to confuse(?) algorithms. If you get C Ave Extension just barely in the circle on the west, that's #6.
And for what it's worth, I had fun trying to figure this out!
I really appreciate you taking the time to look into this! I don't have much more to say right now than what I said to this person: https://news.ycombinator.com/item?id=30742704. I need to dig into it and see. What you've written will help. I might introduce unit tests (with visuals) for this so I can sure it works in a lot of different scenarios.
I made it for my dad as a Christmas present. It also gave me an opportunity to learn about geocoding, etc.
Tech: serverless, Leaflet, Turf, Svelte, TypeScript, Cloudflare pages. I tried to use as many open / free tools as I could. I originally used map tiles from OpenStreetMap but they were discontinued so it uses Mapbox and Maptiler now.
Questions / feedback welcome. I also wrote a blog post with more information: https://adamlynch.com/back-of-your-hand. The code: https://github.com/adam-lynch/back-of-your-hand
Warning: it’s pretty difficult, unless your streets are numbered :)