Graphic Design workflow to deliver faster, high quality visuals for Social Media Platforms

As Visualizers in a Social Media Agency, we all know that creating a visual takes time to stand out in our Social feeds and the challenge is to deliver our work in time, while not compromising with the quality. As for me and my team, majority of our work is for Social Media Platforms where you need to be pro-active in real time. Most of the times we have to adapt the same design for multiple platforms and it helps if we have a well defined processes to do that.

So ask yourself, “Am I well managed?

If not, then sit tight and just go through this and you will learn some valuable “Time Saving Tips”

1) Start with preset sizes on your designing applications, so that you can save half of your time.

1_preset

Sizes for Twitter, Facebook, G+ platforms:

  1. Twitter Cover Image – 1500×500 px
  2. Facebook Cover Image – 851×315 px
  3. Facebook Post Size – 470×385 px
  4. Facebook Link Post Size – 484×252 px
  5. G+ Cover Image Size – 628×354 px

2) Manage the assets of your project in your project folder.

It’s a good habit as a designer to manage the assets in a folder which include all images, project brief doc, references, raw files and more and manage the multiple iteration date wise. This will ensure that you never lose any changes you made while iterating multiple times.

3) Managing Layer’s systematically helps in faster workflow

Working on a tight schedule, it gets difficult for a designer to maintain such workflows, but believe me, it’s a great time saver in crunch times. It will also help you out when you have to adapt the same design for several other platforms.

2_managing-layers

One important thing to note – If you have to prepare the same artwork for several platforms then you should prepare your images as Smart Object.

3_converting_SmartObjects

So Smart Objects turn layers into an “object” that doesn’t lose its quality when it gets resized.

While applying filters like sharpening in smart objects it’s not destructive, you can always show or hide filter pressing eye icon next to name of filter, or change blending mode by double clicking two arrows on the end of filter name, even change amount of sharpening by double clicking on its name. This works for any filter not only for sharpening.

4) Exporting your Creative Artwork

It’s a tricky job for a designer to understand the web requirements while working in a social media firm. As we have to prepare web standard images in RGB palette at minimum 72 Dpi. Few designer’s may have the misconception of preparing their files in higher resolution such as 150 Dpi or 300 Dpi considering quality factor. But the fact is higher Dpi has nothing to do with better quality until we are dealing with web. So whenever, you export an image as per the given social platform standards, try to upload it, then download the same image from the page. You will find that it has been converted into 72 Dpi while uploading. So its better you should rework on your basics first.

As we all know that, JPEG, PNG, GIF are commonly used image extensions for all web standards, although we had entered in the era of SVG “Scalable Vector Graphics” as well. But the Social platforms are not yet that flexible, so for now we are just focusing on our classical image extensions only.

  • JPG is still the king for photographs and photo-like images on the internet, but be careful, as your file can degrade with every save.
  • PNG is good option for transparency and non-lossy, smaller files. Larger files, not so much, unless you demand non-lossy images.
  • GIF is largely a novelty and only useful for animation, but can produce small 8-bit images.

So prefer PNG24 images instead of PNG8 or JPEG if you desire a sharper and crispier image for your creative. If you have to sacrifice quality a bit with image size (which we designers have to face while working with lazy web developers), prefer JPEG as you can play with the image settings to optimize it for minimum web requirements.

4_Exporting_images

As you can notice in the above image, we are moving from original PSD image to the PNG and then JPEG, the quality gets reduced but rendering speed time on web also reduced, which is a basic necessity at the developers side as well.

The result? Look at the real time Facebook feed of the visuals we are creating for our various clients!

If you use some nifty tricks, do share with us.

I hope you enjoyed these tips and it will help you in making your work faster and better.

0 comments