Contents


Turn your smartphone into an IoT device

Create Bluemix apps to process, visualize, and store sensor data that is sent to and from your smartphone

Comments

This tutorial shows how you can send sensor data that is generated by your smartphone to the IBM Watson IoT Platform cloud-hosted service, and then create Bluemix™ applications that process, visualize, and store the data. Lastly, it shows you how to create an Android application for a smartphone.

This tutorial has been updated to reflect the latest names and versions of the services. The following video demonstrates these tutorial steps, but it uses the older versions of the services that use previous names (IBM Watson IoT Platform was previously IBM Internet of Things Foundation).

Video: Use your smartphone as an IoT
                    device
Transcript

Here is an overview of the architecture:

Chart showing architecture of solution
Chart showing architecture of solution

What you'll need to build your apps


 

1

Create an IoT app in Bluemix

The Internet of Things Platform Starter boilerplate contains a Node-RED engine that you will use later to process IoT messages. For now, you will create an Internet of Things service to send and receive MQTT messages to and from the IBM IoT server on the cloud.

  1. Log in to your Bluemix account (or sign up for a free trial).
  2. Click Catalog.
  3. Click Internet of Things Platform Starter.
  4. Enter a name for your application. Because this name is also used as the host name, it must be unique within Bluemix, for example, "iot<yourname>". For example, I might use iotdemodaniel4.Screen capture of the Create an app dialog
  5. Click Create.
  6. Click Dashboard in the toolbar, and click your newly created application (it is a Cloud Foundry or CF APP).
  7. Click Add a Service or API.
  8. In the left nav area, select Internet of Things to filter the list of available services. Select the Internet of Things Platform service. Screen capture that shows the Internet of Things filter                               and the Internet of Things Platform Service selected
    Screen capture that shows the Internet of Things filter and the Internet of Things Platform Service selected
  9. Leave the defaults, and click CREATE.
  10. Click Restage in the message that is displayed. Your application is restaged.
2

Add a device that will send MQTT messages to the IoT server

  1. From your Dashboard in Bluemix, select your application, and then click the new service.
  2. From the service page, click the Launch Dashboard button. Screen capture that shows the service page with the                              Launch dashboard button highlighted
    Screen capture that shows the service page with the Launch dashboard button highlighted

    The IBM Internet of Things server dashboard is displayed, which is a service that is independent of Bluemix. An organization ID is assigned to your app, and you will need this ID later in developing the mobile app. In the following image, the organization ID is 1xuhbp, which is displayed under your login information in the upper right corner of the dashboard.

    Screen capture of the service on the IBM Internet of                             Things Platform server and the organization ID highlighted
    Screen capture of the service on the IBM Internet of Things Platform server and the organization ID highlighted
  3. On the left menu, which pops out when you hover over it, click Devices. Then, click Add a device. Then, click Create device type. In your organization, you can have multiple device types each with multiple devices. A device type is a group of devices that share characteristics; for example, they might provide the same sensor data. In our case, the device type name must be "Android" (this device type name is required by the app that you will use later).Screen capture of the Create Device Type dialog
    Screen capture of the Create Device Type dialog
  4. Click Next. A page is displayed where you can enter details about the device, such as a serial number or model. You don't need to specify this information for this demo; just click Next. You also do not need to specify any meta information. Click Next until you get back to the Add Device dialog.
  5. Click Next. Enter the device ID. The device ID can be, for example, the MAC address of your smartphone. However, it must be unique within your organization only. Therefore, you might enter, as I did here, something like "112233445566".
  6. Leave the Meta Data field blank, and then click Next. Leave the Authentication token field blank, and then click Next.
  7. Provide a value for the authentication token. Remember this value for later. Then, click Next.Screen capture showing authentication token
    Screen capture showing authentication token
  8. Click Add.

    The generated device is displayed on the screen.

    Screen capture showing authentication token
    Screen capture showing authentication token
  9. Close the dialog window.

Now you are ready to send MQTT messages from a device to the IBM IoT Server.

3

Install and configure the Android app

You will use the IoT Starter for Android app to read and send sensor data on your smartphone. The source code and documentation of the app are in the IoT Starter for Android GitHub project.

If you are experienced in Android development, you can download the code from GitHub, import it into your Android development environment, and then build the apk file. Otherwise, to get the app installed and running quickly, follow these steps.

  1. On your phone, go to Settings > Security. Under Device Administration, enable Unknown sources. Now you can install .apk files from outside of Google Play.
  2. Open the browser on your phone, and enter this URL:

    https://ibm.box.com/v/iotstarterapp

    You are redirected to https://m.box.com and the iot-starter_501.apk file.

    Screen capture that shows the .apk file in a browser                             window to download and install
  3. Click Download.
  4. Use a file explorer app (for example, ES File explorer, which you can download from Google Play) to find the file in the Downloads folder.
  5. In the folder, click iot-starter_501.apk. Click Install. Screen capture showing apk file

    The IoT Starter app is now installed on your Android device.

    Note: The .apk file is compiled for Android version 5.0.1.

Next, you need to configure your Android app.

  1. Start the IoT Starter app.
  2. Enter the following parameters:
    • Organization: The organization ID that was displayed on the IBM IoT server (at the start of Add a device that will send MQTT messages to the IoT server). For example, y6spgy in this tutorial.
    • Device ID: The device ID that you configured, at the end of Add a device that will send MQTT messages to the IoT server. For example, "112233445566" in this tutorial.
    • Auth Token: The authorization token that you specified in "Add a device that will send MQTT messages to the IoT server."
    Screen capture that shows the configuration parameters                             for your Android app
  3. Click Activate Sensor. Now the app collects data from the acceleration sensor in your smartphone and sends the data to the IBM IoT server. The app displays the accelerometer data and the number of messages that were published or received. Screen capture of the accelerometer data from the running                             Android app
4

Verify that messages are being sent from your smartphone to the IoT server

  1. Back on your computer, open the IBM IoT server page for your organization again (see the start of Add a device that will send MQTT messages to the IoT server).
  2. On the Devices tab, your Android device is displayed.Screen capture of the Devices tab that lists the Android device
    Screen capture of the Devices tab that lists the Android device
  3. Click the device ID. A pop-up window is displayed that shows the incoming messages from your device. Click an event to see its details. Screen capture that shows the pop-up window with the incoming                              messages from the Android device
    Screen capture that shows the pop-up window with the incoming messages from the Android device

    The messages that are sent from your smartphone are in JSON format. They contain acceleration and position data.

Now you are ready to work with the message data on Bluemix.

5

Process messages in a Node-RED flow

In this section, you will enhance your Bluemix IoT app by using a Node-RED flow to process messages from your smartphone, and then send messages back to your smartphone. The phone will react on these messages by changing the background color in the app.

Node-RED is a visual tool that makes it easy to wire and process Internet of Things messages.

  1. Open Bluemix, click Dashboard, and in your Bluemix Dashboard, verify that your Bluemix IoT app (that you created in Step 1) is up and running.
  2. In a browser, open <yourappname>.mybluemix.net, where <yourappname> is the name for your Bluemix IoT app that you created in Step 1. In the Node-RED editor for your Bluemix app, click Go to your Node-RED flow editor.
  3. The editor opens, containing a sample flow.Screen capture showing sample flow
    Screen capture showing sample flow

    Using the drag-and-drop features of this editor, you can plug together a flow of messages. Although you can create your own flow here, we will import the code below. But first, select all existing nodes, and delete them by pressing the Delete key.

  4. Copy the following code (as a long single line of code), and paste it to a text editor. To ensure the formatting of this code, you can download the code as a text file from https://ibm.box.com/v/iotstarterNodeRedCode.
    [{"id":"215c6601.12d32a","type":"ibmiot in","authentication":"boundService","apiKey":"","inputType":"evt","deviceId":"","applicationId":"","deviceType":"","eventType":"accel","commandType":"","format":"json","name":"IBM IoT App In","service":"registered","allDevices":true,"allApplications":"","allDeviceTypes":true,"allEvents":"","allCommands":"","allFormats":"","x":264.1999969482422,"y":434.1999969482422,"z":"dc6a0ca6.7993b","wires":[["ce21edbb.320628","fdfdaaa2.a45678"]]},{"id":"ce21edbb.320628","type":"function","name":"calc color","func":"var accelZ = msg.payload.d.acceleration_z;\nvar r = 0.0;\nvar b = 0.0;\nvar g = 0.0;\nif (accelZ > 0) {\n\tg = Math.round(accelZ * 25);\n} else if (accelZ < 0) {\n\tr = 255.0;\n} else {\n\tr = 104;\n\tg = 109;\n\tb = 115;\n}\na = 1.0;\n\nmsg.eventOrCommandType = \"color\";\nmsg.payload = JSON.stringify({\"d\":{\"r\":r,\"b\":b,\"g\":g,\"alpha\":a}});\n\nreturn msg;","outputs":1,"noerr":0,"x":437.1999969482422,"y":430.1999969482422,"z":"dc6a0ca6.7993b","wires":[["9df37edb.5d4588"]]},{"id":"9df37edb.5d4588","type":"ibmiot out","authentication":"boundService","apiKey":"","outputType":"cmd","deviceId":"112233445566","deviceType":"Android","eventCommandType":"text","format":"json","data":"{\"d\":{\"value\":\"text\"}}","name":"IBM IoT App Out","service":"registered","x":629.1999969482422,"y":443.1999969482422,"z":"dc6a0ca6.7993b","wires":[]},{"id":"fdfdaaa2.a45678","type":"debug","name":"","active":false,"console":"false","complete":"false","x":442.1999969482422,"y":364.1999969482422,"z":"dc6a0ca6.7993b","wires":[]}]
  5. In the text editor, make sure that all the code is on a single line. Remove any line breaks. Copy the line of code.
  6. In the Node-RED editor, press Ctrl-I to open the Import Nodes dialog. Paste the code, and click OK.Screen capture of the Import Nodes dialog
    Screen capture of the Import Nodes dialog
  7. Now you need to adapt the flow to your specific parameters. The only relevant parameter is the Device ID. Double-click the node IBM IoT App out. In the pop-up window, enter the Device ID that you used earlier (for example, 112233445566), and click OK.
  8. Click Deploy in the flow editor. The flow is deployed and should be active immediately.
  9. Move your smartphone around; flip and tilt it. The background color of the app on your phone should now change colors, depending on the orientation of the z-axis.
  10. In the Node-RED editor, click the rectangle next to the msg.payload node, and click the debug tab to enable debugging. You should see messages that are sent from your phone. The data is in JSON format. Screen capture of msg.payload node in the the Node-RED                             editor and the debug tab that shows messages
    Screen capture of msg.payload node in the the Node-RED editor and the debug tab that shows messages
  11. Inspect the flow: Double-click the calc color node. It calculates the red, green, and blue values based on the incoming z-acceleration value, and passes them on as JSON data.Screen capture of the Edit function node that shows the                              code for changing the color of the background on the smartphone

You now have two-way communication between your smartphone and the first Bluemix app.

6

Create a Bluemix app to visualize sensor data

In this step, you create an additional app on Bluemix, which receives the messages from your smartphone (now an IoT device) and visualizes the data.

  1. Download the iot-visualization-0.2.0.zip file from the iot-visualization Github project. Extract the files.
  2. Open Bluemix, and click Dashboard.
  3. Click Create App.
  4. Select WEB as the type of application.
  5. Select SDK for Node.js.
  6. Click Continue, and enter an app name. As before, the name must be unique within Bluemix because it is used as a host name. Enter something like "iotvisualizer<yourname>" and click Finish.
  7. Within a few moments, you should get the feedback that Your app is running.
  8. From the folder where you extracted the iot-visualization-0.1.0.zip file, open the manifest.yml file in a text editor. Change the host and name parameters to the app name that you chose. Save the file.Screen capture of the host and name parameters in the manifest.yml file
  9. Open a command window, and change to the directory where you extracted the iot-visualization-0.1.0.zip file.
  10. Enter the following Cloud Foundry commands:
    cf api https://api.ng.bluemix.net
    cf login -u <your_bluemix_login_id>

    The cf login command is required only the first time you use the cloud foundry command line tool. You might also need to enter your Bluemix password. If you have more than one Bluemix Organization (not the default case), you are asked to select one of them.
  11. Deploy the application to Bluemix by entering the following command:

    cf push <your_application_name>

    This command looks for the file manifest.yml and uses the parameters from that file. It then uploads the code to Bluemix. After a while, you should see a message similar to the following message:

    OK

    App <your app name> was started using this command 'node app.js'.

  12. In the Bluemix Dashboard, open the Overview page for your app. Click Bind a service or API.Screen capture of the service overview page and the Bind                             a Service or API button highlighted
    Screen capture of the service overview page and the Bind a Service or API button highlighted
  13. Select the Internet of Things service that you defined in Create an IoT app in Bluemix. Click Restage to restage the app. Now the app can receive messages from the IBM IoT server.
  14. To verify the visualizer app, in a browser, open http://<your app name>.mybluemix.net
  15. In the Device drop-down box, select your device id.Screen capture of the IoT visualization app with the                             device selected and the sensor data displayed in a line chart
    Screen capture of the IoT visualization app with the device selected and the sensor data displayed in a line chart

Conclusion

In this tutorial you learned how to easily turn your smartphone into a sensor device, connect it to the IBM Internet of Things server, and send and receive data. You also learned how to process and visualize device data on Bluemix. With these two apps, you can recognize the value of Bluemix for the Internet of Things, and all you need is your own smartphone.


Downloadable resources


Related topics


Comments

Sign in or register to add and subscribe to comments.

static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=1
Zone=Internet of Things, Cloud computing
ArticleID=1019421
ArticleTitle=Turn your smartphone into an IoT device
publish-date=08292016