4 ms·

Ask HN: Review My Library, Tempest

58 points by EvanK 17y ago

I wrote Tempest to reliably generate image heatmaps/clickmaps in multiple languages with the same or similar API. I also hate compiling dependencies, so each implementation is done purely in its targeted language instead of the common practice of implementing in C with language-specific bindings. Clearly, this has its own pros and cons. I know it's far from perfect (it's still in beta), but I'd welcome any suggestions or constructive criticism from the HN community.

aschobel 17y ago
Looks interesting, quick comment on the demo http://projects.digitalflophouse.com/tempest/example http://projects.digitalflophouse.com/tempest/example Maybe move the Coordinates box right under the image and put some text like "Please Click Above To Generate Coordinates" First thing I did was quickly scan the page and click "Render Heat-Map" button which threw up a php error. I know it should be obvious that you should click image, but that text was hidden one of the paragraphs.
- EvanK 17y ago
  Thanks, I've done that. I always overlook that kind of thing.
shaddi 17y ago
Very cool looking! I am going to consider using this for an upcoming project. One of my most significant criteria for using a library is its API and documentation. Maybe I'm not looking in the right places, but I had trouble finding API.txt in your repo; consider including a link to that from your project page. Also, it would be helpful if you provided an example script in each language on your website as well.
- jaddison 17y ago
  Agreed - I'm a little confused about how to use it because I couldn't find the documentation. I'm wondering how much of an impact on site load something like this would have. Thoughts?
vicaya 17y ago
Is there a way to change the colormap? Rainbow colormap is considered 'harmful': http://www.research.ibm.com/people/l/lloydt/color/color.HTM http://www.research.ibm.com/people/l/lloydt/color/color.HTM
- dreur 17y ago
  Wow very interesting link.
- EvanK 17y ago
  Yes, the API (which I will add a link to in the google code site wiki) specifies getters and setters for the image file used as a colormap and the image file used for point-plotting
tptacek 17y ago
patio11 --- are you going to roll your own CrazyEgg now?
- slig 17y ago
  Please do. Last time I checked CE, they had some annoying bugs with no timeframe for fixing. So I had to get a refund.
  - paraschopra 17y ago
    Bugs like? I'll be very interested to learn as I was considering rolling out something of this sort.
    - slig 17y ago
      In fact, it was only one bug (checked on the email I send them): it didn't track clicks on images. So any sort of "Sign Up" button weren't tracked, manking the service worthless to me.
      - paraschopra 17y ago
        Thanks. Wonder why didn't they track clicks on images, cannot imagine a plausible reason.
        slig 17y ago
        They said it was a bug. So I think that it was a planned feature but wasn't working properly at that time.
BjornW 17y ago
Interesting library. Thanks for sharing! One question though: where does the screenshot of the item which has been clicked on come from? As far as I understand your lib does not provide any means to create a screenshot? Is this correct? Would it be possible to add this? If not could you explain how you would make sure the coordinates and the screenshot at any given time match? Just curious and interested in using your library :)
- aw3c2 17y ago
  Coordinate <-> image matching seems to be the job of the coder. I have not looked at the code yet but I am sure it does not do screenshots. What it probably does is this: -You provide an image. -You provide x,y coordinates. -The tool/library calculates a heatmap from the relationship between coordinates -The tool overlays the heatmap 1:1 to the image The Google screenshot and clicking demo is just an example of a possible implementation. You can use heatmaps for many many other things so this surely does not limit itself (nor prefer) to website click tracking. ;-)
  - EvanK 17y ago
    Exactly, it expects you to provide the image. The coordinates are currently expected to be absolute and pixel-specific, where 55,11 is 55 pixels inward and 11 downward. If there was sufficient interest, I could implement relative positioning as well, where they resolve to a percentage of the source image.
mnemonik 17y ago
Very cool! This will be awesome for usability testing. I like the name too, in fact I liked it enough to create a jQuery templating plugin with the same name a few months ago ;)http://github.com/fitzgen/tempest/ http://github.com/fitzgen/tempest/
aw3c2 17y ago
This comes 3 weeks to late for me but I will definitely rewrite something to use this instead of my half-assed workaround. Will message you with hopefully tasty screenshots once I am done.
dangrover 17y ago
Awesome! I had an idea yesterday of making a Burrito Quality Heatmap of San Francisco. Maybe I'll actually do it and use your library.
paraschopra 17y ago
By the way, for people looking for free, open source solution for clickmaps, have a look here - http://www.labsmedia.com/clickheat/index.html http://www.labsmedia.com/clickheat/index.html
aw3c2 17y ago
It seems quite slow. I am using Python 2.6.4 on Linux, slow processor (~2GHz). I out-commented the testOpacityFrequency and _compare defs in the test/pil.py. Now I added about 10000 points and it is calculating for half an hour already. With 1000 points it tool 5 minutes. Is that normal performance or did I do something wrong? edit: after 36 minutes it threw "AttributeError: 'LoadTest' object has no attribute '_compare'", oops that was my fault. Trying again with less points. edit2: It is swapping... I have 2GB RAM. Using an 8192x8192 image and 20 points. :-(
- aw3c2 17y ago
  Ok, so with a 2048x2048 image it works alright. Still quite slow though. But I am rather sure it is tailored for click heatmapping.
  - aw3c2 17y ago
    1000 points on 2048²: 4 minutes 10000 points on 2048²: 34 minutes Sadly that is too slow to be of use for me. Or maybe I simply did not use it right.
decadentcactus 17y ago
I like it, although I'm having a hard time thinking of a serious case where I can use it other than for example making another CrazyEgg, which I don't think I have the time for. TINY request - add a reset button to the example. I guess it's saved per session or something, but I spammed a bunch of clicks in one spot which dominates the page a bit. Great work.

58 points by EvanK 17y ago

aschobel 17y ago

Looks interesting, quick comment on the demo http://projects.digitalflophouse.com/tempest/example http://projects.digitalflophouse.com/tempest/example Maybe move the Coordinates box right under the image and put some text like "Please Click Above To Generate Coordinates" First thing I did was quickly scan the page and click "Render Heat-Map" button which threw up a php error. I know it should be obvious that you should click image, but that text was hidden one of the paragraphs.

EvanK 17y ago
Thanks, I've done that. I always overlook that kind of thing.

shaddi 17y ago

Very cool looking! I am going to consider using this for an upcoming project. One of my most significant criteria for using a library is its API and documentation. Maybe I'm not looking in the right places, but I had trouble finding API.txt in your repo; consider including a link to that from your project page. Also, it would be helpful if you provided an example script in each language on your website as well.

jaddison 17y ago
Agreed - I'm a little confused about how to use it because I couldn't find the documentation. I'm wondering how much of an impact on site load something like this would have. Thoughts?

vicaya 17y ago

Is there a way to change the colormap? Rainbow colormap is considered 'harmful': http://www.research.ibm.com/people/l/lloydt/color/color.HTM http://www.research.ibm.com/people/l/lloydt/color/color.HTM

dreur 17y ago
Wow very interesting link.
EvanK 17y ago
Yes, the API (which I will add a link to in the google code site wiki) specifies getters and setters for the image file used as a colormap and the image file used for point-plotting

tptacek 17y ago

patio11 --- are you going to roll your own CrazyEgg now?

slig 17y ago
Please do. Last time I checked CE, they had some annoying bugs with no timeframe for fixing. So I had to get a refund.
- paraschopra 17y ago
  Bugs like? I'll be very interested to learn as I was considering rolling out something of this sort.
  - slig 17y ago
    In fact, it was only one bug (checked on the email I send them): it didn't track clicks on images. So any sort of "Sign Up" button weren't tracked, manking the service worthless to me.
    - paraschopra 17y ago
      Thanks. Wonder why didn't they track clicks on images, cannot imagine a plausible reason.
      - slig 17y ago
        They said it was a bug. So I think that it was a planned feature but wasn't working properly at that time.

BjornW 17y ago

Interesting library. Thanks for sharing! One question though: where does the screenshot of the item which has been clicked on come from? As far as I understand your lib does not provide any means to create a screenshot? Is this correct? Would it be possible to add this? If not could you explain how you would make sure the coordinates and the screenshot at any given time match? Just curious and interested in using your library :)

aw3c2 17y ago
Coordinate <-> image matching seems to be the job of the coder. I have not looked at the code yet but I am sure it does not do screenshots. What it probably does is this: -You provide an image. -You provide x,y coordinates. -The tool/library calculates a heatmap from the relationship between coordinates -The tool overlays the heatmap 1:1 to the image The Google screenshot and clicking demo is just an example of a possible implementation. You can use heatmaps for many many other things so this surely does not limit itself (nor prefer) to website click tracking. ;-)
- EvanK 17y ago
  Exactly, it expects you to provide the image. The coordinates are currently expected to be absolute and pixel-specific, where 55,11 is 55 pixels inward and 11 downward. If there was sufficient interest, I could implement relative positioning as well, where they resolve to a percentage of the source image.

mnemonik 17y ago

Very cool! This will be awesome for usability testing. I like the name too, in fact I liked it enough to create a jQuery templating plugin with the same name a few months ago ;)http://github.com/fitzgen/tempest/ http://github.com/fitzgen/tempest/

aw3c2 17y ago

This comes 3 weeks to late for me but I will definitely rewrite something to use this instead of my half-assed workaround. Will message you with hopefully tasty screenshots once I am done.

dangrover 17y ago

Awesome! I had an idea yesterday of making a Burrito Quality Heatmap of San Francisco. Maybe I'll actually do it and use your library.

paraschopra 17y ago

By the way, for people looking for free, open source solution for clickmaps, have a look here - http://www.labsmedia.com/clickheat/index.html http://www.labsmedia.com/clickheat/index.html

aw3c2 17y ago

It seems quite slow. I am using Python 2.6.4 on Linux, slow processor (~2GHz). I out-commented the testOpacityFrequency and _compare defs in the test/pil.py. Now I added about 10000 points and it is calculating for half an hour already. With 1000 points it tool 5 minutes. Is that normal performance or did I do something wrong? edit: after 36 minutes it threw "AttributeError: 'LoadTest' object has no attribute '_compare'", oops that was my fault. Trying again with less points. edit2: It is swapping... I have 2GB RAM. Using an 8192x8192 image and 20 points. :-(

aw3c2 17y ago
Ok, so with a 2048x2048 image it works alright. Still quite slow though. But I am rather sure it is tailored for click heatmapping.
- aw3c2 17y ago
  1000 points on 2048²: 4 minutes 10000 points on 2048²: 34 minutes Sadly that is too slow to be of use for me. Or maybe I simply did not use it right.

decadentcactus 17y ago

I like it, although I'm having a hard time thinking of a serious case where I can use it other than for example making another CrazyEgg, which I don't think I have the time for. TINY request - add a reset button to the example. I guess it's saved per session or something, but I spammed a bunch of clicks in one spot which dominates the page a bit. Great work.