I have been using Photoshop since my school days after my brother introduced me to it. Its been 9 years since then and I’ve just turned 23. I also use other software in parallel because I am a 3D artist and 3ds Max is still a companion. These software we use are pretty good and can get any job done (as long as you know what you’re doing). Like a lot of other people, in my free time I’ve composited z-depth passes in Photoshop, played with high-pass and offset filters and channels, learned how pre-multiplied alpha differs from the usual alpha, explored why color bleeding happens on scaling (still not absolutely clear on that), imported 3d models in Photoshop since the support started in CS4 Extended. So Photoshop has become one of the primary software I use over these years. Its a good piece of software, does what it was designed to do, helps you do even the tasks it was not made for. Soon, it became too good to be ignored.
I started facing problems with the text part of these software few weeks after I joined a language technology company in Bangalore. The company has designed typefaces of its own…and these are not just any typefaces. These are typefaces designed for Indic languages for an Indian audience. Imagine somebody taking Indic languages that seriously, and then taking all 22 official Indian languages seriously.
So where does image processing software come in Indic languages? It comes to use when you use text layers. Things start breaking and falling apart. Issues crop up with character mapping and rendering. A small quick mockup job becomes labor intensive one followed by other tiny things which you might miss unless you are careful. Imagine if ‘what’ read as ‘wha’ after you finish the job. But English is too simple to give you any problems. It’s linear…it starts from left and goes only in one direction. Indic languages make you look in every direction, up, down, left, right, diagonally, half character adjusting at the bottom and so on.
Bless yourself if you’re on a Mac but that’s also a problem because Windows based systems can read half characters in Bengali while El-Capitan cannot. Mac will add the half character at the end as a full-character making it look like a never-seen-before character, while Windows will render it just fine.
The image above shows Indic language matras shift to odd places, the kerning goes kaput for the entire string and every character starts looking like an individual object – good if you want to count them but not good if you’re writing something in a language other than English. If you were not designing for Indian languages, you wouldn’t even know such a problem exists.
So the work around (more like a workflow) is:
- Copy the strings in the Indic language (for example Hindi which uses Devanagari script)
- Paste this Hindi string on the text layer in your software and expect it to be accurate the way copy/paste works with English…that is if you can read the language! You’ll realize its not showing properly on screen.
- So you use Script Editor which comes by default on a Mac, which is like WordPad in Windows. Why Script Editor you ask? Because it can read scripts properly 95% of the time.
- Now, paste these strings, change the color and your typeface if you have a proprietary font file
- Take a screenshot at a good size (having a 15 inch Mac helps here)
- Import the screenshot into Photoshop, remove the background to make it transparent (a good image size helps with contrast here)
- Then overlay it on image with a white patch. Do it for every string, every time. But if its paragraphs that you’re dealing with, your screenshot might not optimize space properly to a mobile screen resolution. Now, it becomes harder because you’ve imported an image which is baked. You cannot rewrite it in Photoshop. It no longer remains the dynamic text layer you could realign or change by a double-click. At this point you go back to Script Editor and reposition words with an estimate and hope that it’ll work out this time. So, you take the screenshot again and re-do this entire process. FOR EVERY SINGLE LINE.
A 15-inch Mac helps because it can take large screenshots even if the text is small which is not possible in other laptops with such ease. Did I say ease? Its not that easy actually. It becomes labor intensive because all you want to do is build screens in Indic language for an existing app just to show a client. A workaround to this is that you can recreate the whole app in 4-5 Indian languages from scratch in Sketch. It works very well with Indic languages by the way, better than any other software using text layers as much as I’ve used.
So if you are ever designing with Devanagari/ Gurmukhi/ Bengali or other Indic fonts or using Indic text in your artwork, you can rely on Script Editor if your flow includes Photoshop (the long and sad process explained above). Otherwise just go with Sketch. Except that you will start from scratch every time, which you might not want to do after 3 times because all you want to do is just show a few screens in Indic languages.
If you’re very kicked about it, go ahead and prove me wrong. Build interactive mockups in Indic language by adding Invision to your flow. And because everything a designer makes is kind of a presentation, so why show static screens to somebody? Why not show the entire flow of a localised app if Invision/ Principle are already there. These software companies could improve character mapping or do the necessary and speed up the process, which is quite broken as of now.
Visual Design with Indic Languages: The incident with Google Hangouts
There was an incident where I had asked someone to send me the correct Kannada strings via Google Hangouts. I was on a Mac and he was on Windows. I could see few Kannada strings wouldn’t render properly on the screen in the Google Hangouts chat box itself. I didn’t know how to handle that spelling mistake because if the font wouldn’t render properly on the screen in the first place how would I correct on a software later on. I had to go back to the screenshots workflow. That too on a Windows screen which did not support full HD. Life becomes hard when such problems come up and you have a deliverable to submit.
Visual Design with Indic Languages: The time when Sketch nearly had me exported
Yet another incident happened where I exported a .PNG / .PDF from Sketch. It would show the characters properly on screen and you’d expect everything to be perfect, but its not when you export it. Always check the last character on the last word because the last character might not show up in your exported file even though it shows up nicely on the artboard. Something happens to it while exporting Indic languages. While Sketch is very good for reading Indic scripts, you need to be aware of where it might break, I might have missed a few more of such examples in Sketch so if you know more, do leave a comment.
Visual Design with Indic Languages: The time when Photoshop broke my text
A third incident happened when for an event we were making artworks for our standees and booths in Odia. I copied the correct string but when I pasted it in Photoshop it did not paste correctly and showed the wrong spelling. It became a nightmare as I could not read that language.
From what I’ve experienced, Photoshop CC is not very good with Indic languages though its primary strength is image processing, which it does beautifully. Problems come when half characters would show a halant under the character, the kerning might become too wide, such that each portion of a character may look like a separate character by itself. One of the co-founders at the company actually helped CorelDRAW support Indic scripts back in 90’s.
Apple’s Script Editor is pretty good too but breaks at rendering certain characters in Tamil, Kannada and Odia. Use this as as your fallback option if you need to take screenshots. You also need to know the language too to see the problem with rendering otherwise everything will look right if you cant read a language. Try to always get it verified by someone who knows the language or upload to a helpful public forum if it does not contain sensitive information.
The Principle app is not too good and I would not rely on it for reading Indic scripts, but you will have to write text within Principle otherwise the imported raw files from Sketch will give you a hazy/ blurry text on your mobile screen. Principle needs its own text layers, not imported text from sketch.
I have been testing 3ds Max and it can read these individual letters and some words perfectly, but I still have to do more tests with it.
This blog takes a narrow view of whether certain software can show Indic languages, but does not talk about the other aspects of what goes into designing for Indian audiences. Most software might work for a popular language script, but we have so many of them in India. It’s puzzling why some of the above mentioned software do not support them. Indic scripts should be added even to more recent software like Affinity Designer, because its 2017 and we’re still facing these problems.
Every piece of software is designed for a certain type of work. Some software are like Swiss army knives and its us who generalise the use-case, call them strong or weak depending on the workarounds we find and use in our flow. Its okay to have our own biases towards these software because that is how, at the end of day, we claim some of them to be very close to our heart. It becomes a companion and doesn’t give up on you like others.
Lastly, my suggestion would be to use Sketch, add Invision to your flow and build full fledged mockups. Developers can pitch in and create live apps on top of these mockups to give local language audiences apps and content that is tailored for them. Indic language users have been ignored for far too long now. Its 2017 for us with GPU’s in SLI and Xeon processors on Bridge doing realtime interactive rendering or multiple racks of servers in-house and EC2 services at the back. But its 1996 for them even now.
There was nothing for them back then on the Internet and there’s nothing for them even now.
