Tuesday, September 7th, 2010

TinySrc: Free Easy Way to Reformat Graphics for Mobile Devices

Category: Mobile

If you’re working with mobile browsers tinySrc will dynamically scale your images down to the right size on the server side:

  1. http://i.tinysrc.mobi/http://mysite.com/myimage.png

To use, you simply prefix the URL to your image with a pointer to tinysrc:

  1. <img src='http://i.tinysrc.mobi/http://mysite.com/myimage.png'
  2. alt='My image'
  3. />

tinySrc will then do the magic for you:

Unless you tell it otherwise, tinySrc will resize the image to fit the screen of the mobile handset visiting your site. For example, if an iPhone visits the site, the image will be constrained to its screen size of 320px x 480px.

In this particular case, the image is of landscape orientation, and width is the constraining dimension. Aspect ratios are always preserved by tinySrc, so our 640px by 400px image will emerge resized for an iPhone as 320px by 200px.

Posted by Brad Neuberg at 5:30 am

2.5 rating from 4 votes


Comments feed TrackBack URI

Great service, but what’s the catch? Bandwidth isn’t free AFAIR

Comment by SchizoDuckie — September 7, 2010

No; no catch! The service runs on Google App Engine, so is very cost-effective to run. I guess I’m just being altruistic.

Incidentally, there is plenty more you can do with the (URL-based) API: indicate absolute sizing constraints, percentages of screen dimensions, explicit margin deduction, image format etc etc. It’s all in the docs.

Enjoy! ;-)

Comment by JamesPearce — September 7, 2010

Excellent! Yet another third-party service for people to wait on when loading a web page.

Comment by travisalmand — September 7, 2010

I don’t know… I mean it’s just the images: which you would have had to have waited for anyway.

(And I assume that Google’s App Engine is faster and better connected than most web servers…)

Comment by JamesPearce — September 7, 2010

First, I want to thank Brad for all the awesome posts over the last few weeks. Thanks Brad!!

TinySrc is awesome. It appears to be from James Pearce, who also worked on Device Atlas, (one of?) the top mobile device dbs, so the screen size look up is solid. It has a 1 day expiration time. It’d be better if tinySrc used the expires headers of the original response.

@travisalmand: If you’re considered about performance of this 3rd party service, you should create a server-side tinySrc module, that would use the client UA string as a cache key.

Comment by souders — September 7, 2010

Thanks Steve (yes it’s me again)… but I hadn’t thought of passing on the expire time. I guess it’s blindingly obvious in retrospect, so let me see what I can do.

Comment by JamesPearce — September 8, 2010

http://www.powerpic.net have had a similar (free!) service up for some time now which is a lot more flexible (resize in different ways, add round corners, add glare, add reflection, change contrast and brightness, grayscale). It generates PNGs with true transparency (at the corners and for the reflection) so the result looks good on any background. It is mainly targeted to create “fancy” looking thumbnails and can be integrated immediately into any website (even supports relative URLs which makes integration – and also development (!) really easy)

Comment by knoffhoff — September 17, 2010

Leave a comment

You must be logged in to post a comment.