Software developers like Telerivet face a number of unique challenges when designing and deploying software for users in developing countries:
- sporadic power and internet connectivity
- language barriers
- devices ranging from feature phones to smartphones to PCs
- older computers, phones, and browsers
- users with less computer experience
- higher latency and lower bandwidth
- increased cost of internet access
Much of our work at Telerivet goes into addressing the particular challenges of building software that works well in developing countries, in places where most other software doesn't work very well.
Among these many challenges, we've recently been focusing on the particular challenge of making Telerivet's web-based tools work on mobile devices.
Even though Telerivet is designed for communicating with non-internet-connected mobile phone users, we initially designed Telerivet.com around the idea that our customers would manage their SMS service from a web browser on an internet-connected PC with a large screen, keyboard, and mouse.
For people using Telerivet's Android app to send and receive SMS, this meant that our customers needed two computing devices: an Android phone, and a PC.
But as we started to reach out to customers in developing countries, we realized that many of them use their phone as their primary computing device, and they didn't have easy access to a PC.
So we are happy to launch two new features today that will make a big difference for many Telerivet customers in developing countries.
1. A Mobile web version of Telerivet.com that works on any smartphone (and many feature phones)
From any smartphone, simply open http://telerivet.com in your browser, to log in and manage your SMS service while on the go. Telerivet will automatically detect whether you are using a mobile or standard browser, so you use the same URLs on your phone as on your PC.
Most things work pretty well even on feature phones with Opera Mini (if you have enough patience)!
2. A new version of Telerivet's Android app that embeds Telerivet's web-based tools
For those using Telerivet's Android app, all of Telerivet's web-based administration tools are now available as tabs directly within the app. (For security, these tools require you to log in to your Telerivet account.) You can send and view messages, view and update contact information, view statistics, and configure automated SMS services such as subscriptions, polls, and auto-replies directly from the Android app. No PC necessary.
Of course, some actions are inevitably going to be tedious on a small touchscreen device, no matter what we do. So when it's convenient, you can still log into Telerivet.com using a PC with a keyboard and mouse.
How we did it
Instead of building entirely separate interfaces and interactions for mobile and desktop browsers, the two versions share almost all the same code.
(Actually there are three different versions, since the pages that show up within the Telerivet Android app are slightly different from those viewed in a normal mobile web browser.)
Most of the differences between the two (or three) versions of Telerivet.com are simply a matter of sending the browser a different CSS stylesheet. (CSS allows web developers to specify the sizes, positions, and colors of the various visual elements on screen when someone open a web page in your browser.)
Telerivet's desktop version assumes that the browser is at least 920 pixels wide, so the CSS stylesheet often specifies the exact pixel width of various parts of the user interface. In contrast, Telerivet's mobile version automatically adjusts the content to fit the width of the screen.
But some mobile optimizations aren't possible with CSS. In these cases, we create custom HTML templates to render parts of pages differently between the mobile and desktop versions of our website.
For example, in the desktop version of our website, each page includes a header with a graphical Telerivet logo:
On the mobile web version, showing this logo at the top of each page would take up a significant portion of the screen, leaving less space for the actual content (not to mention the extra bandwidth that would be used to download the logo). Instead, the mobile web version simply uses the text "Telerivet", while the version inside the Telerivet app doesn't include the word "Telerivet" at all.
However, customizations like these come at a cost — more code for us to maintain and test! Since we're always rapidly adding new features to Telerivet, we don't want it to be twice as much work to support both a mobile and desktop version.
So we try to keep the differences between the desktop and mobile versions at a minimum, and structure our code so that the mobile and standard views can use the same HTML and CSS whenever possible. Only 2% of Telerivet's HTML templates and about 11% of our CSS styles are different between the mobile and standard versions of our website.
To upgrade the Telerivet app on your Android phone, just open the Telerivet app and click the button to upgrade. (If you haven't started using Telerivet yet, sign up for free here.)
Try it out on your phone, and let us know what you think!
(Stay tuned for more blog posts where we'll discuss our work to optimize Telerivet for users in developing countries, and follow us on Twitter for more updates!)