The µPanel system permits to equip any microcontroller-based device with a fully customised graphical interface that permits to remotely monitor and control the device with smart phones, without the need to design the mobile APP and without the need to know any wireless communication protocol. Nevertheless, the panel that will appear on the smartphone is fully customizable! The designer of the electronic systems can completely define the structure and layout of the panel, including indicators, controls and all other elements required to monitor and control the electronic system in the most efficient way.
Thanks to a simple graphical language that has been specifically conceived by the µPanel engineers , the graphical and functional aspects of the panel are handled by the micro-controller consuming a very limited amount of memory. Thus our solution is suitable for any kind of micro-controller, even for the smallest one.
As an example, the designer can easily include LEDs, displays, buttons, switches, sliders, keypads, messages, editable boxes, but also pictures, icons, plots and much more. Moreover, the graphical panel is not static, but it can be even completely changed during the run-time, giving the possibility to implement menus and even true multi-page applications. µPanel will also take care of keeping the panel synchronised with the electronic device, which means the micro-controller doesn't have to worry about data synchronisation, retransmissions and so on... When the user launches the APP, the current state of controls and indicators will appear automatically! Read on and you will discover as easy it is to use µPanel!
Figure 1.
Main features:
|
Panel fully customizable (the Panel design Simulator will help you to design the graphics)
|
|
Wide collection of Panel Objects (leds, switches, analog controls, plots, images and much more)
|
|
Data automatically synchronised (e.g. no need to manage retransmissions, logon, logoff,...)
|
|
Real-time capability
|
|
No need to learn any programming language
|
|
Can be used with any micro-controller (Atmel, Microchip, ST, ...) |
|
Design syntax extremely compact (ideal for systems with limited memory)
|
|
Easily integrable into pre-existing electronic systems
|
|
Low cost (the µPanel APP it's FREE and there are NO subscriptions) |
How µPanel works
Our system consists of two elements:
- a mobile APP installed on a smartphone
- a WiFi module programmed with µPanel connected to the system to be monitored and controller
Figure 2. Logo of the µPanel App and Wi-Fi module (with its breadboard adapter)
The microcontroller of the system to be controlled communicates with the WiFi module through a common 2-line serial interface and by using a very easy and compact language (HCTML) that has been specifically designed for µPanel.
By means of this language, the microcontroller can easily define both the graphical and functional aspects of the Panel. Moreover, it can both change the Panel state and receive notification messages reporting the user interaction with the panel. No specific knowledge of internet protocols nor of graphical languages are required to successfully use µPanel.
Lets consider a simple example where the electronic system wants to create a panel with a single LED indicator and a push button. In this scenario the microcontroller will initially send through its serial interface the graphical description of the panel, which contains the LED and button definition (you will learn that this message is something like: $P:L1G:0;B1:Push;). Later, when the system wants to turn on/off the remote LED, it will send another simple message through its serial line (something like #L11 for turning on, and #L10 for turning off).
Figure 3. First step: panel layout definition
The WiFi module receives these messages and deliver them to the APP when possible. If the APP is not running at that time, the module will keep them into its memory until the user connects the APP. This way the microcontroller has not to bother about the fact that the user is actually online or not. Everything is synchronised automatically without the intervention of the microcontroller.
Figure 4. Example of message from your microcontroller to µPanel APP
When the user launches the APP the LED and then button will appear on the screen. The LED will appear on or off, accordingly to the last message sent by the microcontroller. The user can also interact with the button. When the button is pressed, a message will be sent by the APP to the WiFi module, which finally will send a simple HCTML message to the microcontroller reporting the user action (in this example, something like #B1P)
Figure 5. Example of message from µPanel APP to your µController
The µPanel APP can establish a connection with the WiFi module in three ways:
1. Direct connection (access point)
2. Connection through the LAN
3. Connection through INTERNET
The µPanel APP is developed to automatically search for the selected WiFi module trying, in the order, all the three possibilities.
In the first scenario, your smartphone will connect directly to the WiFi module (seen as an acces point). The connection can be open or protected by a password.
Figure 6. Direct connection.
In the second connection mode, both the WiFi module and the mobile device connect to a wireless router (e.g. the home internet router)
Figure 7. Connection through WLAN.
In the third connection mode, the WiFi module connects to a WiFi router that provides Internet connectivity. The mobile device can communicate with the system through its Internet connection.
Figure 8. Connection through INTERNET.
Watch Panel Examples, simple Arduino Uno Projects or try the Online Panel Simulator.
THE KIT CONTAIN:
µPanel Mobile APP (for Android and iOS )
1x SCF-01 (ESP-01 WiFi module with µPanel Firmware)
1x ADP-01 Breadbard Adapter
8x Breadboard wires (Jumper connectors, Male-Female)