Our journey towards a mobile-friendly UI

Our first attempt to provide a better experience for mobile users started in 2016. That was a pretty late attempt, considering that smartphones were already very widespread by then, but better late than never.

We were faced with basically two options:

1. Developing a mobile app. 
2. Making the website responsive.
   

Developing a mobile app would have probably been the better option, but it was not an option we could afford. It would have meant dividing our efforts. The time we spend on re-implementing Tatoeba as a mobile app is time that we don't spend on maintaining and improving the existing website. So we went for the second option: migrating the existing UI towards a responsive UI and improving its design along the way.

This attempt was put on hold by the end of 2016, as we shifted towards other priorities. From this attempt, Tatoeba had some look and feel update, but was still not responsive.

Last year, however, thanks to Mozilla Open Source Support (MOSS) who granted us an award of $15,000, we were able to resume the initiative.

We first updated what was left to do with the look and feel, to make as many pages as possible visually consistent.

Then next (the hardest part), we re-implemented all the features from our "old" sentence component into our "new" sentence component, with some improvement and an updated design. Even though all the features were re-implemented, we could not completely switch away from the old sentence component yet. Throughout the whole process, our registered members have had the option to use either the old or new design. A majority have started to use the new design but there are still some issues in the new design we need to address before we can comfortably transition.

Lastly, in the past couple of months, we worked on making the landing page and the search results responsive. These two pages represent the largest portion of the traffic on Tatoeba so we figured it would be most beneficial for our mobile users to have these pages mobile-friendly first. The responsive landing page was deployed in July and the responsive search results in mid-August.

So finally! It took four years but we now have a responsive UI 🎉 

...Or at least partially. 

We will, of course, continue our efforts to redesign the rest of the pages, and also improve the speed. This might take another four years, who knows, but we will get there, eventually! You can, in any case, check our progress on GitHub. And if this is a topic which you wish to see progress faster, please consider contributing as a developer :)

We would like to thank MOSS again for their financial support, as well as everyone who helped with the development, with the testing. or who simply took the time to give us valuable feedback.