Developers love automation. Our jobs depend on automation and taking away a bit of the pain in completing repetitive tasks. Unfortunately, not everyone at a company knows just how much basic automation of everyday work can greatly improve both their productivity and give them time to concentrate on more important decision-based tasks.

I witnessed one such case at an entry-level job about a decade ago. It was at a small company that lived off of advertising spaces that were sold by only one employee. She was the best employee on the team. We’d mainly interact whenever something went wrong with her computer, usually to scrub clean her malware-prone machine. In one such case, after cleanup, I noticed she was transferring several contacts from an email message to her Windows Address Book by retyping them with both programs’ windows tiled next to each other. I quickly learned that she wasn’t copy-pasting the information because she didn’t know that was possible. It only took 3 minutes of training, and after receiving a few flattering thank-yous, I realized just how much I took for granted the basic tools I was so familiarized with. This may be an extreme example, but it helps illustrate just how much benefit tiny improvements to our workflow can make, and how much time our team may be wasting on needlessly tedious tasks.

As a frontend developer, I can get projects up and running faster with every new tool I add to my toolkit. Armed with boilerplates, frameworks, preprocessors and building systems, I can generate more quality code while writing less than ever before. Yet this is not usually the case for designers, illustrators and image content creators. In this article, I want to give a few examples of designer-related tasks that can be improved using better toolkits.

frontend_dev

Picture by Alejandro Escamilla

Let’s start with some basic file exporting. Whether it’s preparing raster images or vector illustrations, we’re always faced with the time consuming task of adapting our work to the desired media. One such case is creating images for the web or mobile apps.

Since Photoshop’s Save-For-Web feature doesn’t export 8-bit PNG alpha channels correctly, and produces files that can be greatly reduced in size, let’s use ImageOptim-CLI along with Alfred (to avoid having to use the Terminal). After downloading and installing ImageOptim, ImageAlpha, ImageOptim-CLI, and Alfred, simply install the necessary workflow file. You can now generate small, metadata-free, web-ready JPGs and PNGs using a few keystrokes in Finder.

Another similar case are the bloated SVGs exported by Illustrator and Sketch. We’ll use SVGO and a simple folder to improve them. Any file dropped into the folder will be reduced in size and have unnecessary code removed. First we install SVGO. Next we install the Folder Action. Create a folder, right-click it and choose ‘Folder Actions Setup’. Select svgo.scpt, and close. That’s it!

For both the previous examples, creators will be able to improve how they work using familiar tools, and only using the Terminal during the installation of the dependencies.

Let’s look at a very different case: Many email newsletter design creators are familiar with HTML and CSS, but not with task runners. Email HTML has several limitations compared to what we use on the Web. Writing clean templates while minding the limited CSS support in email clients can be painful. Configuring Gulp is more complex than the tools used in the previous examples, and I’ll leave that out of this article, but the configuration I use is available for anyone wanting to use it. This building process does the following:

  • Lets you work in separate CSS and HTML files.
  • Removes unused CSS styles and reorganizes those styles for better compatibility.
  • Tells you the features you used that may conflict with specific email clients.
  • Compresses all images and optimizes their file size.
  • Generates a single HTML file that’s highly optimized.

A lengthy chore that can be replaced by running a single line of code to run the building tool.

The benefits of automation in these examples are evident, and I’m sure creative developers can think of similar cases that can help their fellow teammates. Design work is hard as it is with the creative decisions that need to be made, and the everchanging goals of the content they create. I used designers as an example in this article, but many other workmates can also benefit from our help. Taking the time to build your colleagues internal tools such as these is a worthwhile investment, and I’m sure many of them will appreciate the effort.

***
by Pablo Delgadillo
Front End Developer at Camaloon

Previous ArticleNext Article

Leave a Reply

Your email address will not be published. Required fields are marked *

B.

Buy an island & get to know the IPO pipeline

This is the Newsletter shared on the 2nd of September. If you wish to receive newsletter faster, you can subscribe here: https://itnig.net/newsletter

Hi there,

Coming back from holidays is tough. What if I told you that you can buy an island? This project allows you to even get the citizenship of the island if the crowdfunding succeeds. Interesting, huh?

If you are lost getting to know which companies are planning on doing an IPO, don’t worry, the list is not long. Ahead of WeWork, Cloudfare, and SmileDirectClub, the pipeline for IPOs is quite thin! In this sense, we just got to know that Ping, the online ID management company has filed an S-1 form indicating that it plans to raise up to $100 million in an IPO on the Nasdaq .

By the way, you may want to add some brilliant networking conversation starters as at Itnig we will host several events for techies and entrepreneurs. If you are interested in organising one, please, write me an email!

– Itnig’s team

Podcast #104: Digital Signature with Juan Zamora, CEO at Signaturit

In this week’s podcast, Juan Zamora from Signaturit shares with us who digital signature works. The Barcelona-based startup counts now with over 100 employees dedicated mainly to engineer a product that reduces the hustle of traditional contract signing.

Bernat and Jordi chatted with him to further understand how the technology works. They also took this opportunity to announce the new collaboration between Signaturit and Factorial.

This week’s podcast is sponsored by Codeworks, the most intense programming bootcamp in Europe in which you will learn JavaStipt and you will become a full-stack developer just 3 months!

Use the code ITNIG19 before the end of 2019 to get a 5% discount saving up to 500€. Choose the upfront payment plan, and benefit from the discount!

 

New funding for startups 

Random tech news Satellite Antenna on Twitter Twemoji 12.0

Events recommended 🎫

Find out about more vacancies at itnig.net/jobs.