Retina Revolution Retina Revolution / tutorial / free

http://blog.netvlies.nl/design-interactie/retin...

Retina tricks to making images 2x the size but 40% and still having them turn out better.
1 favorite
submitted about 4 years ago, by pineapple
Retina Revolution popular tutorial

6 Comments

SkinnyGeek1010

OMG! these look amazing on my rMBP... Damn now I need to go back and re-save all my images :/ lol

SkinnyGeek1010, about 4 years ago

pineapple

lol that is my favorite gif of all time. Yes, i really want to add retina to pineapple although it is a massive pain for things like voting. How does it look otherwise (this site)?

I used a retina mac for awhile in the apple store and I noticed pretty much 90% of sites aren't retina ready, I think that may drive me crazy seeing blurry images everywhere... but then again im not sure

pineapple, about 4 years ago

SkinnyGeek1010

Lol, yea I was like that at first... it was so noticeable the first week. The only it catches my attention is on rastered small text images.

Pineapple looks pretty good actually! the rMBP makes text look sooo nice (especially in the text editor!). The most noticeable graphic on pineapple is the fav. star and small icons. Not too bad though! http://cl.ly/image/3C1Q0g021s41

SkinnyGeek1010, about 4 years ago

SkinnyGeek1010

On my startup's website the designer used sooo many images so I ended up making a retina spriting hack for compass to automate
https://github.com/AdamBrodzinski/Retina-Sprites-for-Compass

which is faster but you have to make the images divide by two or they shift. However, if I can reduce the size by 50 for everyone that means 1 sprite sheet :) but... I don't think background image size work in IE.... first world problems lol

SkinnyGeek1010, about 4 years ago

lush

picture alt

lush, about 4 years ago

pineapple

Lol, oh codeschool, you so silly.

pineapple, about 4 years ago


Login or to comment.

Tutorials are any resources you learn from.

Examples: an intro to html5 screencast, a pdf about git, photoshop effects tutorials, meta-programming in ruby, lambda calculus, higher-order fixed-point combinators.

Tools are websites, apps or services used -on- your project (indirectly), to aid the process.

Examples: A color scheme generator, email marketing software, usability heat maps, css3 code generators, a downloadable png compressor.

Assets are downloadable files used -in- your projects, usually as code, textures, or images.

Examples: a jquery sticky menu, photoshop brushes, background textures, mvc frameworks, twitter bootstrap, 960 grid system.