Optimizing Images on a Budget

Welcome to the all new MacGyver Monday. This segment will be centered on ways of accomplishing tasks using various items at hand. If you don’t know who MacGyver is, shame on you. The man is famous enough to have his name in the Oxford Dictionary of English. Get googling right away.

In skating over thin ice, our safety is in our speed.

That dear reader is a quote by the American philosopher Ralph Waldo Emerson. It basically means that to endure trying or troubling times, one must move quickly. You’re probably wondering how this relates to the topic of the day. Well, let me explain. In today’s society, speed is everything. This is especially true when it comes to the technology arena. We like our tech working fast and efficient. With regards to the quote above we can liken the ice to a user’s patience, the safety to how often the user uses an app and the skating to how the app performs. When the app is slow, the user’s patience begins to “weaken” and if it can’t tolerate anymore, the app will sink (be uninstalled or discarded).

Basically, if your product is slow, then it’s got to go (In the trash). With the eruption of social media, there has been a growing desire to share a large variety of media, specifically images. This form of media is used on both web and mobile applications and is one of the contributing factors to how they perform.

If you are a developer or are just interested in learning something new, I want to show you a rather simple way to optimize your images and get them consumer ready in a short amount of time.

 

Why optimize images?

Now as you may or may not know, the speed of loading a website is greatly influenced by the size of images on the pages. Larger images equals better quality but longer load times while smaller images equals lower quality but faster load times. The goal here is to maintain both quality and speed and deliver a great UX (User Experience). How do we do this? We optimize the images. Run them through an algorithm to compress them all the while maintaining quality.

There is software that can be used for this but you may not have access to them either due to affordability or processing power on your machine. These software include Adobe Photoshop. Some of them I can’t vouch for as I have yet to even try them (New ones seem to pop up everyday). Others come with undesirable contingencies like they may insist on placing a watermark on your image to pressure you into purchasing premium services.

 

The alternative

To curb the aforementioned issues, you can use Facebook photo uploading. This is a free service and is available to all Facebook users. When you upload a photo to Facebook, it is run through a compression algorithm that reduces its size but retains its quality. I have personally used this service for some personal projects like this very site you see before you and have been quite pleased with the results I got. This is how I usually go about it:

 

1. Round up the images
Get the images you wish to use. It would help if you placed them in a similar folder for ease of access.

 

2. Create a new album
Go to the photos section of your Facebook profile and create a new album.
fb-upload-create-album

 

3. Upload the selected images
Upload the desired photos to the album and give it a random name. For safety purposes, I would recommend you restrict the album’s privacy so that the photos can only be viewed by yourself and no one else. Until you’re done at least. This can help avoid sharing images unintentionally.

 

4. Download the album 
Once you are done, give it a moment to process the images. You may get a notification to alert you once the album is ready to be downloaded. Proceed to download the album back to your device. You can also choose whether to leave the photos online or delete them from your account.

 

Result

Take a moment and compare the original image to the one you just downloaded.

 

fb-upload-original-image
Screenshot showing the original image taken with an iPhone 6 camera

 

fb-upload-optimized-image
Screenshot showing the optimized image after compression

 

You will notice that they have relatively similar quality but, the optimized image takes up less storage space. Don’t believe me? Then have a look at the Nairobi Skyline photos in my portfolio. Each one underwent this procedure and have still retained the clarity and sharpness they had on the device when I captured them.

 

Advantages

The Facebook photo upload service is free to all its users and has no defined limit on the number of photos you can upload. It also provides unlimited storage space for your photos and hence, can double up as a backup location.

The optimization is quite efficient so you don’t have to worry about people complaining that they lack the bundles to download an image you sent them (*Cough* Kenyans *Cough*).

 

Disadvantages

Despite using their services, I am quite skeptical about Facebook and their data mining methods. I know that big brother is watching and you should too. Due to this, I would advise you not to use the service to optimize sensitive images such as schematics of a cutting edge product prototype or something of the sort. The internet, just like diamonds is forever and you wouldn’t want to risk photos of that nature leaking out.

 

Conclusion 

This is simply a quick hack that can help make your work easier. I am well aware that there are other free web-based or standalone alternatives. If you can get your hands on them, then by all means player do you.

I do hope you found this post useful. Leave a comment down below as I would like to hear from you. Give feedback and suggestions and let’s make MacGyver Mondays worth looking forward to. I will be posting another piece on Wednesday for my new segment, Wordplay Wednesday. Do join me then.

K.O. Out