An Open Web App sample that controls your music by just waving


Since the dawn of “Touch less” music navigation has begun from different phone manufacturers, i was curious enough to replicate the feature to Firefox OS by using the Proximity API.


Meet “Air Wave” a sample Open Web App that lets you pause or play a music file by just waving your hand near the proximity sensor of a phone.

Thanks to WebAPI, you can create awesome innovations that involves information from your phones hardware!


Here’s a video demo (Instagram Video):

If you want to play with the code, you can get it on GitHub:

Happy Hacking! :)

Tren 1.1 for Android has been released!


It’s just 10 days after tren has been first released on Google Play, from the start we promise to deliver relevant features to our consumers by bringing innovation on the table and better refinements to the app experience. Now, enough chit chats!

What’s new in TREN 1.1 for Android?

  • TREN Alerts (BETA): We’re launching Tren Alerts. Get the latest news and scoop from us via “Push Notification” so you can get the up-to-date announcements from LRT/MRT and PNR. How cool is that? 😉
  • Simplified User Interface: We’ve made some minor U.I changes. We’ve added a new tab for the “About” section.
  • Better performance: 20% faster than before. It’s a huge performance deal breaker here.

I hope you’ll like this new version. If you’ve seen some bugs, you can e-mail me at:

Like TREN on Facebook:

Follow Tren on Twitter:

Join our TREN Commuter Facebook Group:

Tren: Behind the scenes

I want to talk about “Behind the scenes” of Tren, my newest app that you can download for free on Google Play, Windows Phone Marketplace and Firefox Marketplace.

When did you started developing Tren?

Tren is a weekend app. I started planning and coding the mock-ups on March 28 2014 (Friday). Worked really hard on each feature on March 29-30 (Saturday and Sunday) and sunday night, i already have the alpha app for testing. My friends are my guinea pigs (and i love them, truly they have an eye for quality). And on Monday, i have been busy testing the BETA app for release. Making sure that the app won’t crash on my device, and won’t make my testers unhappy.

And on April 1 2014, tren has finally launched in Google Play. It’s a living proof that April Fools Day is not only just for pranks. 😛

Why did you focused on developing Tren?

I have a LOT of app ideas in my mind. But these ideas are needed to be cultured, it needs to be planned. A perfect way to launch an app is timing and research. I think it’s the best time to launch a train guide to serve better my fellow countrymen and the fact that  the growing need for info app focusing on public transportation is becoming a necessity.

Why is the CCTV feature NOT built-in on the app?

I’ve been getting the same question right before i’ve launched the app. It’s simply because it’s MRT’s property. I don’t like the idea of serving a feature and have to sneak on their system just to make that feature work. I respect the whole organization. But if ever they would offer an API access for third party developers, like me. I’ll be more willing to cooperate.

Are you seeking partnership?

Yes. Specially if the offer would really benefit the users. If you have a proposal, you can E-mail me instead.

Is Tren really FREE? How do you earn?

Tren will always be FREE to use. I’ll earn through Google’s Ads. I’ll use the money to buy me some coffee. Or a small meal when i’m hungry coding.

Why is iOS not supported from Day 1?

Technical stuff. But hopefully, i would launch an “Up-to-date” version of the app at the end of the year.

That’s it! I hope you liked reading this behind the scene post. I’d like to thank a good friend Bea Fel, My mom, My Uncle and all of my friends who helped and supported my app. I appreciate all of your efforts! You guys are awesome!

Introducing Tren: Your guide to manila transit

What was your first train trip felt like?

We all have this first train trip experience. I bet before your first trip was all excitement and expectations. Everyone does. But it all goes down to the frequently asked questions before that awesome experience. And possibly, you may have asked these questions yourself:

What are the next few stations before we reach our destination?

How much would a single journey ticket cost?

I’ve been riding different train stations everyday for the last 5 years and i’m still asking some of those questions. Not until, i made Tren.

I’m a commuter myself. I love riding the train! And i want an app that would help me with my ride. I want instant answers when i needed the most. So that’s the main reason i started tren in the first place.

What can Tren do for me?

Tren was created for commuters like YOU and ME. It was crafted to answer quickly. We don’t usually ask train questions, but when the time we needed to. That’s when we needed the answers FAST.

From the planning stage, i want tren to…

  • List the stations on a certain train line (LRT 1 & 2, MRT 3 and PNR)
  • List the daily operation schedule of each train line
  • Solve the train metric fare for you
  • Some train reminders
  • …and contact information from every train line you ride.

And i’ve also included a link from the official CCTV  of MRT-3, so you can take a peak at the current condition of a station before you take a ride. Pretty sweat, right? :)

And most of all, this app is FREE. Free to use, feel free to love. Share the good news to your friends and family who are also commuting via train!

What’s next for Tren?

Tren doesn’t stop at this version. It’s a continuous work. I’ve made a solid roadmap for the app and looking forward for the right steps ahead. But for now, you can always count on tren. :)

TREN is available for download at these platforms:

Tren for Android

Tren for Windows Phone 8

Tren for Firefox Marketplace

Tren for iOS is currently in the works and will be released soon.

If you liked it, don’t forget to rate it. If you need technical support or if you want to suggest a feature, kindly email us at: thetrenapp[at]gmail[dot]com.

Attend the Firefox Automation Training Days online!

If you’re interested in testing software and writing code to test code on Firefox, the Mozilla QA Team is organizing a two day online automations training! For FREE!

All you need is a stable internet connection, a browser (Well, don’t be shy to use Firefox!) to attend the training.

You can check out the Public Etherpad for useful resources online, join the video conference on Vidyo, and join the others on IRC (If you don’t know how to install IRC, you can check it out how here) #automation channel.

This is an awesome opportunity if you want to contribute to Mozilla. Help test software, report bugs and make Firefox more awesome!

See you at the Automations training!

Should you stop building on web and just build on mobile?

I recently came across a quote from a friend:

Stop building on web, start building on mobile.

If you’re a big fan of the web,  it could rage spark. But if you think deeply, and analyze the quote and the current situation of the web. The ‘web’ and ‘mobile’ is actually asynchronous. If mobile will evolve, so is the web.

Remember the Symbian phones?

Forget about Smartphones! Let’s go back to the days where Nokia rules the world. I can remember that i have been using a web browser to download Java games from a telco website.

As far as i remember, the website that i have been browsing on is not the same site that you will stumble upon these days using a smartphone. It’s responsive. It’s finger friendly. And it’s expensive because back then, there is no such thing as “unlimited” internet. It’s all KB charge, baby!

It’s the iPhone that changed the web

When the first iPhone was launched, it promised to carry a full blown browser on your fingertips. Steve Jobs once said that developers doesn’t need an SDK to build apps on the iPhone. Just use Safari, and you’re good to go.

But things got different when Apple introduced the App Store. And i believe that the unified application store is the only reason why the platform took off.

The web back then has no offline support

Back when the web was young and ‘unlimited’ internet was a dream, users wanted to use apps offline. The iPhone offers safari and developers then can build web apps. But developers aren’t happy. Users aren’t also happy. So Apple took the opportunity to revive the old symbian way on using your app. Get it from an ‘application platform’ and use it offline.

But things are different now.

Firefox OS is here.

Firefox OS is a great example of Web and Mobile working together in harmony. It’s not a dream, nor a beta project. But it’s a real open product. It exist. It’s a living proof that the Web is dead.

In fact, Firefox OS offers an Application Marketplace that is available on both Firefox OS and Firefox for Android, you are not tied to one platform. Firefox OS also offers offline capabilities for your apps. WebGL is also an interesting technology that works on Firefox OS when making advanced graphics. Firefox OS also offers cross platform notification that works on all platform.

And if you really want to monetize your ‘web app’ you can simply use Apache Cordova to port it to other platforms.

The web is matured and it keeps getting better

The web is accessible for all. It keeps getting better and better. It’s an open platform that everyone can dive in and contribute.

Instead of choosing and comparing Apple and Oranges, wouldn’t be nice if we just use the right tools for the right job?

486 hours at Voyager Innovations Inc

It was one of those normal days when i was just actually waiting for a company who are interested to hire me for an internship. Then someone called me on my mobile phone, and it was from Smart’s H.R. She told me that they are inviting me for an interview somewhere at Ortigas, and without further ado, i’ve accepted the offer!

“The Interview”

Then the day came from my interview, i still remember the place where i will be deployed. It’s at Voyager Innovations Inc. The same venue where Smart held their AngelHack event last year, where Mozilla Philippines Community is also a local partner for the said event and i was a “Mentor” back then.

The interview lasted for less than 15 minutes, and got an e-mail from SMART saying that i have been accepted as intern in less than 35 minutes after the said interview. So it was that fast and i think it was one of the most epic interviews i had.

“A new beginning”

When i entered Voyager, they are already working on a weather application that will be dealing with the chance of rain. I was assigned to test the said app and i was lucky enough to see it progress because i was testing the early “Alpha” versions. I was really excited to the job, i had no background of testing apps in a formal way and got the whole process after i have filled a few bugs.

I’ve also attended a product launch. It was that awesome that your work is beginning to unfold in the media that then will be broadcasted to millions of filipinos not only in the country, but worldwide.

And i couldn’t imagine more that the apps that has gone before the consumers are being tested on my hands, and it’s truly an awesome job if you think about it.

I was so inspired by my job that i even wrote this blogpost. lol

“Moving forward”

It was an awesome experience working with Voyager Innovations Inc! I learned so many things that will be helpful in the real world. In just 3 months! :)

I’d want to thank the people who mentored me during my internship, and to my co-interns. You are all awesome!

I’m glad to be part of a company that works together and shares a common vision. :)

Firefox Marketplace app needs some content rating love! Rate it now!

If you have an app in the Firefox Marketplace, then probably you might have received this email from the Marketplace App Team. It’s important to rate your content rating as soon as possible to prevent any further inconvenience at your end.

Those apps who have failed to submit a content rating will be pulled out from the Marketplace on April 15 2014.

You can read the full context of the email here:


Time is running out to prevent your app from being removed from Firefox

If your app does not have an IARC rating by April 15th 2014, we will remove
your app. To add an IARC rating to your app, please follow the steps outlined

Want to keep your app in Firefox Marketplace?

Mozilla has implemented a content rating system for all apps on Firefox
Marketplace, and we noticed that your app has not yet been rated.

Adding an IARC rating to your app is easy, free, and takes just a few minutes.

Upon completion of your IARC rating form, you will receive a confirmation email
with your rating certificate and security code. Be sure to keep a copy for your

Once completed, your app will receive instant ratings for all participating
rating boards. This not only helps educate your users about content, but also
dramatically reduces the cost and hassle associated with obtaining various
global content ratings individually.

Why delay any longer? Visit your My Submissions page to get started:

Thank you for your time and for helping Mozilla create a more user-friendly
marketplace for users around the world!

The Apps Team

Should you localize your app in different dialects?

Photo from

The Philippines – The texting capital of the world may soon to get a huge upgrade when it comes to smartphone usage in the coming years.


Because smartphones are getting cheaper each month. Local smartphone vendors like My Phone and Cherry Mobile are actively releasing new devices, making old Android devices cheaper. Who would have thought that in 2014, you can actually buy a smartphone for less than 2,000 pesos?

And since low end devices are getting cheaper, we can’t deny that Android 2.3 is still important if you want to target the 1/4 of the pie. And different players are trying to battle the low-end segment of the market. Just look how Mozilla and Nokia are working very hard to conquer that space.

With that saying, would you localize your app in different dialects in the Philippines? Should you even bother?

Maybe you should?

I’m guessing that majority of the Filipinos who are buying these low-end devices might have been their first time to access the internet on a mobile device and are somewhat new to the “App culture” we are enjoying with our smartphones.

The problem.

If you want to localize an app, the usual problem is.. Where do you start? If you have the money to outsource, who do you hire? And if you’re on a tight budget, what tools/libraries can i use to translate my app to different dialects?

So localization is a challenging task to work on, specially if you want to target the “Masa” and reach the next million filipinos. But it’s really exciting to see some new players focusing on this part of the mobile revolution.

And who knows? We might see some published apps gets the dialect update that will bring Kapampangan, Bisaya and Chavacano in your favorite local apps.

If you’re developing an app, or have developed an app that focus on bringing innovations to the masses, will localization be on your top list of To-do’s?

Send an SMS using SMART DevNet’s API Console

SMART DevNet has opened up their API together with the SMART API Console (Powered by APIGEE) last December 2013 for everyone to use, for free. Right now, everyone will get an access to their FREEMIUM API which means you can only send an SMS using your SMART mobile number. It’s not bad if you want to try out the API and get started developing an app or website service that offers an SMS/MMS feature.

At the end of this post, you will learn how to:

  • Create your own SMART DevNet account
  • Register an app/website name and bind your SMART number with that app
  • Get to know your App’s API information
  • Hack the API Console

You will need:

  • A SMART powered phone (I used my SMART Prepaid number. I haven’t personally tried Talk N’ Text, SUN or RED Mobile)
  • Your favorite text editor (I used Notepad during my first trials of the API Console)
  • Your favorite web browser (I used Firefox *wink*)

Follow these steps!

Step 1: Visit

step1From here you can register for a SMART DevNet account and get to read some API docs, register an app and try out the API Console. On the top of the page, click the red “Register” button to get started.

Step 2: Fill out the forms


You can also register using your Facebook or Google account. Still hoping for support in the future =p

Step 3: Log-in

Once logged in, just click the “Freemium API’s” option in the top menu navigation.

Step 4: Create an app

Step4You will be needing a SMART Prepaid/Postpaid number here.


Take note, you can’t change your Smart mobile number once you’ve confirmed that number during the app’s registration.

Also you can’t change your app’s name. The only information you can always change in your app is your callback URL.

Step 5: Your App’s Dashboard

testappIf you have been successful in the past steps, then you can finally take a peek at your Application’s dashboard. This dashboard holds the information that you will use in the API Console.

You will copy and paste some information from this dashboard to the API console.

Step 6: Using the API Console: OAuth Authorize


Click the left arrow in the API console to open the console drawer, and select OAuth Authorize.

In the QUERY tab, you will find:

  • client_id
  • client_secret
  • scope
  • redirect_uri
  • response_type

Now, match the form using the information from your Application’s dashboard:

  • Consumer key
  • Consumer secret key
  • Put “SMS” without the “
  • Callback URL in this format: ( You will observe that i have removed the HTTP and /)
  • Leave it as it is.

And press SEND. This will generate a hyperlink in the response window. Open a new tab in your browser and paste that generated hyperlink, then you will be redirected to a page where you will input the mobile number you’ve used in the app registration (Don’t have a my.Smart account).

It will ask for yet another confirmation code. Once you got that right, it will redirect you to another page and will ask for authorization. Just click the “Allow button” and again, will redirect you to another page. But this time, you will get “PAGE NOT FOUND” error.

(Note: What’s with the “PAGE NOT FOUND” ? It’s because for the sake of the demo, i’m not using a REAL callback URL thus this is the system’s reaction on fake callback links. If you’re working on a real app, you must provide a working Callback URL.)


You will notice this paragraph:
The requested page “/” could not be found.
Copy and paste the code after the %3D… This code will be useful in the next step. (WARNING: DO NOT INCLUDE THE %3D in your code, just the characters AFTER and before ” is YOUR code.)
Save that code in your favorite text editor as Code: XXXXXXXX.
Step 7: Getting your token

Now that you have your code,  hover your mouse to TOOLS > and click API CONSOLE then it will redirect the page to the API Console. Now press the arrow button to open the console drawer and press “OAuth Get Access Token”


In the QUERY tab, you will find:

  • client_id
  • client_secret
  • scope
  • redirect_uri
  • grant_type
  • code

Similar to the first QUERY tab, match the form using the information from your Application’s dashboard:

  • Consumer key
  • Consumer secret key
  • Put “SMS” without the “
  • Callback URL in this format: ( You will observe that i have removed the HTTP and /)
  • Leave it as it is.
  • Code (Remember that we saved that code in our notepad? Just get the 8 character code and paste it)

Now press “SEND

The response window will generate a JSON data. We will only need this:

  "OAuth20": {
    "access_token": {
      "token": "<TOKEN GENERATED>",
      "refresh_token": "<TOKEN GENERATED>",
      "expires_in": "<TOKEN EXPIRATION>"

We will only need the TOKEN code in the next step.

Take Note: Every information generated in this JSON file is important. We will only use the TOKEN code for demo purposes.

Step 8: Send SMS

Now, press f5 on your keyboard to reload the page. Once reloaded, open the console drawer and select “Send SMS


In the TEMPLATE tab and change the senderAddress information to SMS Access Code (This code can be found in your app’s dashboard)

Select the HEADERS tab and change the Authorization information to: Bearer <SPACE> TOKEN

Now select the BODY tab and select the TEXT field and find this text and change the values to:

  • message“: “Hello SMART DevNet! It works!

and press “SEND

You will receive an SMS within 30 seconds. If nothing happens then…

  1. You’re not following the instructions.
  2. Network delays
  3. Server delays

But as you can see, it works.

Screenshot_2014-02-07-17-33-54Congratulations! You have successfully sent an SMS using SMART DevNet’s API Console!!! Now what?

BONUS STEP: Confirm if the SMS request was sent successfully.


Save the JSON data generated from “Send SMS”:

“resourceURL”: “”

Open the console drawer and select “Send SMS

Select the TEMPLATE tab and change the

  • senderAddress to your Apps’ SMS ACCESS CODE.
  • requestId to the link generated from the JSON file. It’s usually the longest number in the link.

Select the HEADERS tab and change the

  • Authorization to BEARER <SPACE> TOKEN

and press “SEND

If you see this JSON data on the Response window:

"deliveryInfoList": { "resourceURL": "", "deliveryInfo": [ { "address": "6392XXXXXXXX", "deliveryStatus": "DeliveredToTerminal" } ]

Then we can say that your SMS was sent successfully! AWW YEAH!

That’s it! At first, the console may be tricky but you will get it at the long run.

And oh, if you’re looking for a SMART PREMIUM API or have any questions in mind about their API, you may want to send an e-mail to the DevNet team:

Join the SMART Developer Network facebook group here.