IoT Display

Introduction

This project's goal is to make a display that sits on my desk and has the following features

1. Can be used as an IoT Control panel to control other devices

2. Display current Time and set timers

3. Show current weather

4. Expandable with other features.

*This Project is still in progress!

*AI Generated Image

Item List

I decided to use only a display and a microcontroller for now. Afterwards, I might add some small components, such as a battery and buzzer.

I chose the Raspberry Pi Pico2W for the microcontroller because it has a really large RAM compared to other microcontrollers this small, also there is a lot of documentation on it, and it has wireless(Wi-Fi and BLE) functionalities.

I chose the Pico Display Pack2.0 by Pimoroni(LCD Display) because it can directly connect to the Raspberry Pi Pico without any soldering and has a well-built library.

Initializations

This is the most boring part of the whole project. I had to install the Pimoroni UF2 for rpi pico2w to access the Pimoroni display library. Then I had to initialize the display and write some color presets. (This is not fun to do at all).

Networking

Since I need the user to input Wi-FI Credentials to get the pico connected to Wi-Fi, I need to find a way for the user to input it. My idea is to first use the Pico as a AP(Access Point) and to let the user connect to it. Than tell the user to go on a webserver to input Credentials. This is what I have to do:

1. Start the Pico as an access point (AP) using the 'network' module

2. Display the Pico’s Wi-Fi credentials with a QR code for easy connection.

3. Launch a web server.

4. Log the user’s Wi-Fi credentials.

5. Connect the Pico to the user’s Wi-Fi.

This Picture is part of the code to start AP

Showing QR Code

The Starting AP Stuff is quite simple, so let's skip to the QR Code display. My initial plan is to directly generate the QR code on the pico, but the "qrcode" module doesn't work on the pico so I decided to generate the picture on my laptop and than upload it to the pico. This(On The Left) is the script that I used to generate the QR Code, feel free to use it for your own project!

Why PNG

I chose to use PNG because JPEG uses lossy compression, which caused some noticeable ‘shadows’ on the QR code(As shown on the left) These distortions were visible even on the LCD display, so PNG, with its lossless compression, was a better choice for maintaining the clarity and accuracy of the QR code.

JPEG

PNG

QR code and wifi AP display

I decided to display both the QR Code and the Wi-Fi SSID & Password on the screen. This ensures that users can easily connect to the network using either mobile devices (by scanning the QR Code) or laptops (by manually entering the credentials). This dual option enhances usability and flexibility for a seamless connection experience.

Inputing user's Wi-Fi

I chose to use an HTML web app as the interface for users to input their home Wi-Fi credentials. This approach makes the process much easier, as users can conveniently type the information on their own devices, rather than relying on the display’s four push buttons, which can be less intuitive and time-consuming.

Detailed Instruction

Once the user connects, the display provides detailed instructions on how to navigate to the web page. This ensures that even individuals with no prior knowledge of IP addresses or IoT can easily understand and use the product. By simplifying the setup process, the product becomes more accessible to a broader audience.

Confirmation Page

To enhance usability, I added a confirmation page to the interface. This allows users to review the Wi-Fi credentials they entered, ensuring accuracy before proceeding. This step minimizes errors and streamlines the connection process.

Page updated

Google Sites

Report abuse