I sometimes use ‘burst mode’ on my camera if I’m making photographs of my daughter (or cat), so I can select the best photo and discard the rest. After a while I found out that these burst-photos are also cool to show as a video. These short ‘movies’ look they are shot with an old-fashioned videocamera.
Here’s my process 🤓
Images to MP4
The command to create a movie from a series of jpg-images (without resizing):
-crf 20: great quality / filesize (28 is default, 16 is visually lossless)
-an: no audio
-pix_fmt yuv420p: also necessary for playback in Quicktime
-preset veryslow: slow encode, best quality
-r 20: 20 ms between frames
optionally-vf "scale=-1:420, format=gray": rescale (to 420p) and gray-scale
CRF is a factor to indicate quality/filesize. I find it extremly hard to judge the result from this. One source suggests using CRF 16, but to my eye there is no difference between 17 or 20. You can check for yourself with two samples I generated: image 1, image 2. I’ve included the previous encoder of choice in the table below as well to show how impressive H.265 is. According to the documentation, CRF 23 is default in H.264 and CRF 28 is default in H.265.
H.264, CRF 17
H.265, CRF 17
H.265, CRF 20
H.264, CRF 23
H.265, CRF 28
good (impressive for this filesize)
for 24 JPG images all at 4,7MB (totaling 112,8MB)
Images to GIF
H.265 is nice, but sometimes you need a more archaic format if you want to share your movie. The following incantation converts a series of images to a GIF. You will need ffmpeg and ImageMagick installed (which is easy, if you have brew on your Mac).
We got some photos printed, but I wasn’t 100% satisfied with the quality. Thirty-year old photos from my childhood look sharper! At first I thought this was because of the photos being taken with a digital camera, but then I realised it could also be the printer.
I’ve since found out that the company we used (Hema) is rated as one of the worst places to print photos.
In the search for a better photo-printing service I’ve decided to order 20 photos at three different providers so I can see the quality differences for my self. I looked around at several online reviews, comparison sites and forums to see which providers I would compare. Below are the sources that mostly influenced my decisions.
This horse-photographer made a very detailed comparison of three professional photography printers. I’m going to use her post as a blueprint for my when I compare the photos.
Profotonet: most consistent quality, but least sharp
Saal Digital: cheapest, but less consistent in quality
FIFO Color: sharpest prints, but too dark
Fotovergelijk is a place where people rate printed photos and compare pricing. Hema is rated the worst…
I’ve added the printer-service used by the website if they don’t print their own photos.
Albelli (9) uses Albumprinter to print
Webprint (9) (named Smartphoto in other countries)
Pixum (9) CeWe
Fotogoed (9) Küpper druck
Blokker (8) Fujiprint
Albert Heijn (7) CeWe
Aldi (6) CeWe
Kruidvat (5) CeWe
Hema 🤨 (4)
The scale originally goes from 1 to 5, but I converted it into a 10-point scale so I can compare it with the scoring of Onlinefotoservices.
Everybody agrees Profotonet is the marketleader in high quality photo-printing. Albelli and Webprint seem to be a good 2nd place. CeWe is popular, but has a mixed track-record. The other two high-rated services from Fotovergelijk are not known to me (Fotofabriek and Fotogoed) and are also more expensive. They are highly rated in service, so perhaps I can go back to them some time.
For now I will order photos at Profotonet, Albelli and Webprint. In the next post I’ll compare the outcomes!
I use Axure in my work as UX-designer and thought I’d share some of the tricks I’ve come up with in the past 5 years. This post was originally named “OMG Axure, WTF?”, because these are some nice hacky workarounds 🤓
I’ll add more over time, but for now I have two image-related tips.
1: Never optimize images
By default Axure asks if you want to ‘optimize images’ on import:
I always answer ‘no’ on this: Axure has a very aggressive image optimization. You will notice JPG-artifacts (especially in corners) and enlarging the image will make it look extremely bad. On top of that, lose the alpha-channel in PNG (so no more ‘see-through’).
Optimizing images is not necessary. This is not the ’90s anymore! I have very image-heavy files with dozens of pages in them (because for some projects our agency still uses static-comps) and my six-and-a-half year old MacBook Pro handles them just fine.
Of course, if the image does slow you down, you can very easily optimize it later by right-clicking ‘optimize image’ or slicing a tiny piece off of it (CMD-6). But be careful: there is no ‘unoptimize image’!
If you do remote-testing and you worry about page-load: read on!
2: Preload images for remote testing
Axure does not export an image multiple times if the same image is on multiple pages. Instead it links to the same image-file. ‘So what’, you might think, ‘big deal!’
But this is actually very useful information for us! For remote testing we sometimes have users with very little bandwidth and in that case it might be detrimental to the test if the pages load very slow. Especially because I ‘never optimizing images’ 😇
Here’s the tip: after you’re done with your masterpiece of a prototype, create another page in Axure and call it ‘preloader’. Go through all your pages and copy all images to the ‘preloader’ page. Easiest is to CMD-click on the images in the bottom-right pane to select all of them, then CMD-C to copy.
Now you should have all images from your prototype on the ‘preloader’-page. Simply add a huge white-box over them and add a bit of an explanation for the people participating in the test. Also include a button so people can start the test. If you want to be really fancy, you can disable the button first and have it be enabled after ~10 seconds (because people never read the label ‘wait for instructions’).
Why cover the images with a big white box, and not set the images to ‘hidden’ in Axure? Because some smart browsers might realise the images are set to visibility:hidden and not load the images to preserve bandwidth.