GitHub GitHub Satellite India 2021 - Open Source: Day 1, 28 Mar 2021

Previous Meeting Next Meeting

⏯

youtube image

►

From YouTube: GitHub Satellite India 2021 - Lightning talk: i18n-ize your app today!

Description

Presented by Amruth Pillai, Software Engineer, Postman

When Amruth Pillai was building his open source project, Reactive Resume, he came to realise that the language in which your users interface with your application can play an important role. Translating your app to the user's native language can encourage them to spend more time on the app—and convert potential users into customers.

In this talk, Amruth will discuss his learnings from developing Reactive Resume, and the impact of having it translated into 22 languages (and counting) with the help of the community. He'll also talk about the tools that helped him simplify the process of internationalisation and localisation, while highlighting the benefits that a multi-language UI has provided to both the project and its users.

As always, feel free to leave us a comment below and don't forget to subscribe: http://bit.ly/subgithub

Thanks!

Connect with us.
Facebook: http://fb.com/github
Twitter: http://twitter.com/github
LinkedIn: http://linkedin.com/company/github

About GitHub
GitHub is the best place to share code with friends, co-workers, classmates, and complete strangers. Millions of people use GitHub to build amazing things together. For more info, go to http://github.com

A

A

Hey guys, hello, uh good morning, everyone uh yeah current. uh I also my mouse timers as well. When I say international lies, it is it's difficult. So uh thank you for that great introduction. um I am amrit pillai and, uh to be honest, I really don't have much to say about myself, except that I got insanely lucky when building a personal project of mine, uh a simple resume builder called reactive resume.

A

This talk is just going to be about decoding how I got lucky and hoping that this journey of mine would help you in your product development as well.

A

I only have one simple idea to share with you today and that's internationalization.

A

I could end this talk right here right now for those who already know what that is, but do stick around, I think you might enjoy this.

A

I'm going to talk about how I implemented I-89 in my project, how it helped me in increasing collaboration amongst other open source devs, and also how it helped me reach my project goals, much faster than I ever expected.

A

Finally, I'll also be talking about how you can adopt i18n into your apps today and also some tools to help you in the process cool. So, let's head on over to the link on the screen, this is rx residue.me and I'm going to be logging in right now into the app on this screen. You can create multiple resumes uh depending on your job profile, clicking on your resume.

A

You are taken to the resume builder and while you're on the screen, you can edit stuff, like your name, and you can see, watch it instantly uh change uh in the preview.

A

On the left side you can edit a bunch of sections and on the right you can change layouts organize your layout. You can switch between templates, organize layouts. uh You can change colors even uh for fonts or a lot of other things.

A

uh You can even export your resume as a pdf or you can share a url with anyone who would want the latest copy of your resume. But all that's great. The crux of today's conversation is right here: languages reactive resume is currently available in 26, different languages and counting.

A

I can simply switch to a language like, let's say german, and it would change the interface completely and also certain tokens used within the resume.

A

Well now that you've seen the app a question that you might have popped into your mind would have been. You know what was your, what motivated you to add multiple language support in the first place or on the other hand, if your brain have has that question? Here's the answer to it anyway?

A

uh Well, it was purely accidental. I added support for i18n to just allow the people around me to be able to use it in languages like kannada and tamil, for which I could translate on my own.

A

With the help of my friends, it was used by a few people here locally, but once it got a bit of traction on sites like reddit or hacker news, that's when a lot of users as well chimed in and added translations for their own languages, all that's great! But what was it good for having added all these languages or even more having to develop the architecture to be able to translate the app, because it wasn't easy for one increased collaboration?

A

I never expected that I'd be working alongside so many amazing developers and translators who contributed to reactive resume. This increased the overall participation for this project on github and was a contributing factor to why this particular repository received so much traffic.

A

Secondly, positive conversions. Now, if this project had some kind of premium model, I could tell you how this helped me in making a lot of money, but sadly it had none of these things since reactive resume is a non-profit project. I only measured conversions by analyzing how many people are talking about the project and thus spreading the word to those who need it. The most for this I often head to twitter to see what people are saying, and it's been good things so far.

A

Some other key takeaways from this journey were finding out more about my domain, because now I had to cater to a larger audience.

A

One specific example to this is that when I started having people translate, the app to european languages like german or french people from these regions were requesting for a special type of template called europass, which is widely used there. This is something I would have never known about if it weren't for them.

A

It also helped me in increasing accessibility in the product. Overall, I was inclined to use icons in place of text more often than not so that translators wouldn't have to work too hard to convert every phrase into their language.

A

This also made it us possible for users of advanced stages or non-english speaking natives to navigate the user interface without any aid. A small example of this is that I've developed many projects before, but when I showed reactive resume to my dad, who is a native tamil speaker, he was able to use it just like how I imagined anybody else to be using it soon enough.

A

He was sharing the link to the project with his friends and family on various whatsapp groups, as more stats do, and this turned into a viral marketing campaign that I would have that would have never even crossed my mind, all right, okay, taking a quick detour from our regularly scheduled programming. Here's a neat gif, my conscience, wouldn't let me be free if I hadn't kept at least one resume-related gif in the presentation. So uh that's where it is uh a quick shout out to the fans of the office, all right so getting back now.

A

We have briefly gone through the advantages of having an architecture where you allow translations for your app.

A

Let's talk about how to adopt i18n into your app today, something that can take minimal effort is adopting multiple currencies for when, let's say you have an e-commerce platform, on the other hand, if you have an app where your users deal with dates and records, it would go a long way to support an option to choose multiple date time formats.

A

On top of this, implementing an architecture to include translations might be time consuming, but a very fruitful task. In the end, you can make use of libraries like iit next to incorporate the architecture necessary to allow translations into your app.

A

There are even automation: tools like iet index scanner, to help you extract all the strings from your app into a single json file.

A

Next, you can use a translation management platform such as crowdin to help you manage your different languages and strings this aids in non-tech folks as well to help you translate your app without having to clone your github repo and edit a json file without any context, a big big shout out to github's student developer back here. If you have access to this, it has a lot of offers for much more advanced and feature rich language manager, management platforms that you can use for your public or private repositories.

A

Fun fact I actually found crowding through this list myself and countless of other tools that help me in building reactive resume.

A

Before moving to the end of this talk, I'd like to go through a few glossary of words that you would tend to come across while dwelling in the domain of languages- they all might seem the same, but there is a very important distinction between each of them and understanding them would ensure that you've covered your bases.

A

Ga11N is the father of all buzzwords globalization. It simply means to make your existing product available to a global market. The methods of making a product global- well, that's what's coming next i18n is the one that I used to title this talk and repeat it numerous times during this presentation, but it isn't everything internationalization uh means to try to make your product cater to an international audience.

A

This could mean that they speak the same language as you, but have other differences such as currency or date time. Formats l10n, is something that I haven't picked on specifically for this talk, but an important step. Nevertheless, localization is all about creating content that caters to audience from different cultures or even different languages.

A

For example, if you were to have a cooking blog, you wouldn't want to feature an article about biryani recipes in a location, that's known for its sweet tooth. You would want to tailor some specific content for people located there. Maybe gulab jamun on a much grander scale. Netflix tries to incorporate localization by actively producing content, not just in english, but in other spoken languages such as spanish, hindi or even tamil t9n is all about translation, making your user interface available for consumption in multiple languages.

A

That's it and finally, a11y is something you might have heard about in other contexts: accessibility, but equally applicable here. By creating more products that can be used in multiple languages, we are creating a much more accessible internet for everyone.

A

Coming back to the original idea that I wanted to share with you, if there's just one thing to take away from this lightning talk it's that if you have an app out there today or better, yet, if you're planning to build your next project, please make it accessible through multiple language of multiple languages.

A

Your users will thank you for it.

A

I'd like to take a quick slide to dedicate this talk to all the people who helped reactive resume, be what it is today to all the donations made to all the pr's that have been raised and the languages that have been contributed. A big thank you to all of you.

A

My name is amrit pillai and you can reach out to me through my website at amritpillai.com or on my email at hello. Amritpillai.Com I'll also be available to answer any questions you might have at the github discussions board. Then I'll also be sharing links uh to this slide and other resources spoken for in this talk so yeah come say: hi.

A

Thank you to github india, for this amazing opportunity and thank you so much to everyone watching. You've really made one of my dreams come true today,.

A