Turning an eInk screen into a monochrome art gallery

by @edent | , , , , , | 6 comments | Read ~5,142 times.

Previously on Terence Eden's Blog: I turned an old eReader into an Information Screen. This time, I'm taking a different Nook, and turning it into a magic gallery. Here's what it looks like in action: Upcycled an old eReader into an art frame.Displays a new black & white piece of art from Flickr every few…

Coping with HEIC in the browser

by @edent | , , | 4 comments | Read ~708 times.

Apple's HEIC format is... annoying. At the moment, Apple's products are the only mainstream cameras which use it. Forums are littered with people trying to upload HEIC files to web services and failing. So, here are four quick tips for dealing with this formal. Display in browser Absolutely no browser supports HEIC. Not even Apple's…

Three small tips for shrinking SVG images

by @edent | , , , , , | 8 comments | Read ~720 times.

Rows of icons - each one has the size printed next to it.

I work on the SuperTinyIcons project. Our aim is to make pixel perfect SVG icons in under 1KB. Because SVG can be quite verbose, every single redundant byte we can eliminate is a byte we can use in drawing. Here are three quick tips for shaving a few bytes off an SVG. Decimal Magic SVG…

How to fake Progressive WebP Images

by @edent | , , , | 9 comments | Read ~425 times.

Extremely fuzzy photo.

WebP is the hip new image format on the scene. It offers unrivalled image compression at superior visual quality. But, in my opinion, it is deficient compared to JPG in one significant aspect. It doesn't have a progressive mode. Progressive mode is useful because it can quickly load a low resolution preview of an image,…

Should panoramic images be part of the HTML5 specification?

by @edent | , , , | 9 comments | Read ~145 times.

360 view of the inside of the concert hall.

Noodling thoughts. The humble <img> element is one of the oldest parts of HTML. It allows you to put a static image in a document. Later revisions allowed for animated images - like GIFs. And the <map> element made parts of the image clickable. But what about interactive images? Like panoramas and photospeheres? Here's a…

Annoyed by Android's circular icons? Here's how to fix them

by @edent | , , , | 2 comments | Read ~9,373 times.

Each icon has a unique shape.

One of Android's mottos is "Be Together; Not The Same". What does that mean to you? To me, it means that you don't need to conform to a single way of doing things. Sadly, Google seems to be moving far away from that ideal. The latest change - adaptive icons. All "adaptive icons" means is…

How to avoid JPG compression on Twitter

by @edent | , , | 6 comments | Read ~27,077 times.

Screenshot of a graphics editor. One pixel has been removed from the image.

Update for 2019! Twitter have changed how they compress images. Some of the techniques in this blog post may be out of date. Let's talk image compression! Services like Twitter will often apply aggressive levels of compression in order to reduce their storage space and decrease download times. This can have negative consequences for usability…

Making a Twitter Collage

by @edent | , , , , | 1 comment | Read ~639 times.

This is a lazy way of making a collage of Tweets. I was originally going to use this method: No idea about getting urls, but this may or may not be useful (cmd is also in image alt-text) pic.twitter.com/Jh3YH4yKI0 — Mike (@6byNine) October 29, 2016 but, sadly, gnome-web-photo crashed repeatedly when I tried to use…

Selecting Text In Images - Pure SVG, No JavaScript

by @edent | , , | 1 comment | Read ~1,187 times.

Recently, I wanted to embed an photograph of a book page. I thought it would be nifty if the text from the page could be selected. If you hover your mouse over this image, you should be able to select part of the text. Ideally, it will look something like this... It even works on…