MicroZed Chronicles: Packages, Custom Projects and Web Apps for the Ultra96

The Ultra96 is designed for IoT and IIoT applications, and we can start developing them right out of the box if we so desire. In this blog, we are going to look at the three elements we need to know in order to get a simple IoT/IIoT application up and running and create a simple example pulling it all together.

1. Install new packages and libraries, e.g. OpenCV.

2. Create a custom Python project.

3. Create a custom web app front and back end.

The Ultra96 uses the PetaLinux operating system; those familiar with PetaLinux know that as it is intended for embedded solutions, there is often no support for installing packages. This means that if we want to add in a package later such as OpenCV, we need to regenerate the PetaLinux Image.

However, the Ultra96 comes with the smart package manager which enables us to add in new packages at run time. To add in new packages, we do not do this via the web interface but instead via a terminal program such as PuTTY.

To connect with PuTTY, all we need to know is the IP Address — which is 192.168.2.1 if we are connected to the Ultra96 access point — the port number (22), the username (root), and password (leave blank).

Once we are connected, we can then check if the desired packages are installed before we add them using the command:

pkg-config — cflags

If the package is installed, this will return the installation directory. If it is not present, we need to install it.

Installing a package is easy, and for this example as we need the OpenCV libraries, they will provide the example.

Using the smart package manager, enter the commands:

smart install opencv

smart install opencv-dev

When prompted, if you wish to install the packages, select Y and after a few minutes, both packages will be installed and available for out use. To verify they have been installed correctly, run the pkg-config command again looking for OpenCV and you will find the installation path reported.

With OpenCV installed, we can now progress to creating a custom project running on the Ultra96. For this to make the maximal use of OpenCV, I am going to use a USB web camera, in this case a Logitech 720P.

To ensure the web camera is detected correctly by the Ultra96, you can run the command:

usb-devices

This will list all of the devices connected the USB hubs, beneath which you will find the web camera if detected. Most importantly, the driver needs to show uvcvideo — if this is not present, you may struggle to use the web camera correctly.

Once we are happy we can see the web camera, the next step is to create the custom project. We do this by clicking on the custom content link in the web browser menu.

This will navigate us to a page where we can create a custom project, scroll down to the bottom of the page, and select ‘create new project.’

Doing this will open a new page, which presents a text editor and an output window where we can see responses from our project. Note that even though we are working with OpenCV, we cannot display images in the output window, yet we can in our custom webapp.

The code we are going to add into the text editor is very simple. It will import OpenCV such that we can use its functions. Before attempting to open the web camera and taking a single image. If successful, the single image will then be stored in a location, which can be accessed and displayed by the web app we later develop.

When you save the code in the editor before running it, remember to add the file extension of .py. This is not added automatically and will result in error if the file is not correctly identified as a Python file.

To check the image before we develop the web app front and back ends, we can use a program like winscp (with the same parameters as for PuTTY above) to connect to the Ultra96. This will let us navigate around the Ultra96 file structure to the location of the saved image, which we can then download and view.

Of course, what we really want to be able to do is to view the image we have captured over the web web camera. To do that, we need a web app front end and back end — both of these must be named the same.

The Ultra96 web server uses flask to serve webpages, which is ideal for our applications as it is Python-based and means we can use Python when GET or POST events occur. But for now, we will keep it nice and simple to demonstrate the flow.

The back end file is the one called by the flask server to serve the front end file. Therefore, if you look at the file I created for this example, you will notice the routine is tied to the front end file adam.html, and when either a POST or GET operation is executed that is the HTML which is served.

When you create a new back end file, there will be several position using the text CHANGE_ME. These are the areas you need to update to point to the name of your HTML file.

The front end file is also very simple for this example. The server will use the defined Ultra96 webpage template and add in the text served by our front end HTML file.

In this instance, we have added some simple text and displayed the image we captured earlier via the custom project.

With both front and back end web apps created, the next thing we need to do is include them in the flask server. To do this, click the include option and then select the reload web app option. Doing this will restart the Ultra96, however you only need to do this the first time you include your web app and not every time you make modifications to it at a later date.

Once the web app has been included and the Ultra96 has rebooted, on the Custom Content page you will notice a custom web app page appear.

Clicking on the view button will then open the web app you have created. When I clicked on this for the first time with this example, I was served the webpage below:

While this is a pretty simple example, it presents a great introduction to the capabilities of the Ultra96 for IoT and IIoT right from the start. Of course, we will examine more in-depth use cases as the blog goes on, but for now this should allow you to hit the ground running.

See My FPGA / SoC Projects: Adam Taylor on Hackster.io

Get the Code: ATaylorCEngFIET (Adam Taylor)

Access the MicroZed Chronicles Archives with over 240 articles on the Zynq / Zynq MpSoC updated weekly at MicroZed Chronicles.