Using Picamera2 isn’t difficult, but for some the pure Python interface can be challenging. We’ve covered how to use Picamera2 with all models of Raspberry Pi but what if you just want to point and shoot?
Berlin-based James Mitchell has created Picamera2 Web UI Lite, a web interface for Picamera2 which provides us with a full suite of camera settings to tweak, along with an image gallery where we can view and download our images.
In this how to we will learn how to install Mitchell’s app and use it to take images using the official Raspberry Pi Camera Module 3. We’ll also show how to use the video stream in OBS.
For this project you will need
- Raspberry Pi 4 or 5, we used a Raspberry Pi 5
- Official Raspberry Pi Camera Module 3
- micro SD card with the latest Raspberry Pi OS
Picamera2 WebUI Lite Setup
Installing Picamera2 Web UI Lite is simple, but we do need to complete a few steps in preparation. We need to connect a camera, update our OS and then download and run the software.
1. Follow the guidance to connect your camera to the Raspberry Pi 5, for other models follow the guidance here. The Raspberry Pi 5 has two camera ports, but the Picamera 2 web UI lite only supports a single camera, for now.
2. With the Raspberry Pi powered up and connected to the Internet, open a terminal and update the software repositories list and upgrade your software. This isn't an essential step, but having the latest software on a fully updated Raspberry Pi will make things go much smoother.
sudo apt update && sudo apt upgrade -y3. Get the hostname of your Raspberry Pi. Make a note of the hostname for future use. The hostname can also be found in the prompt. It is the text directly after the @ symbol. Adding -I to the end of the hostname command will show the IP address of the Pi.
hostname4. Download the project archive from GitHub to your home directory. When opening a terminal, it will default to your current user’s home directory. Note that Picamera2 web UI lite’s Github page states that we should clone the repository, but recent changes to Github authentication prevented us from achieving this, hence the archive download.
wget https://github.com/monkeymademe/picamera2-WebUI-Lite/archive/refs/heads/main.zip5. Unzip the archive to the current directory. This will create a new directory in your home directory.
unzip main.zip6. Change directory to Picamera 2.
cd picamera2-WebUI-Lite7. Launch the project using Python.
python app.py8. On another computer, open a browser and visit your hostname followed by :8080 to see the interface. In our case we used a Windows 10 machine and went to raspberrypi.local:8080. If this does not work for you, try the IP address of the Pi or install Bonjour print services.
Using Picamera2 Web UI Lite
The user interface for Picamera2 Web UI Lite is simple and we’ve broken the areas down to help you navigate.
1. Main menu: Here we can open the image gallery, get information about the connected camera and learn more about the application. The image gallery stores all of the images taken using the app.
2. Preview window: This is the camera’s view of the shot and we use it to compose the scene.
3. Camera settings: Using this menu we can change various camera settings to tweak before taking a picture.
4. Capture Image: This button will take a picture using the currently selected settings. The image is saved into the Image Gallery.
To capture a basic image
This is a basic “point and shoot” demo. Think of it as the “hello world” of Picamera2.
1. Place the object in the shot using the preview window.
2. Click Capture Image to take a shot.
3. Click on View Image Gallery to view the image.
To tweak the camera settings
Now that we understand how to take a picture, we now delve into the settings menu. Here we can find options to tweak the image brightness, saturation, sharpness etc.
On the right-hand side of the screen we have a series of drop-down menus which can be used to tweak the camera settings for a custom shot.
1. Orientation Settings: Here we can flip the image either horizontally or vertically.
2. Auto Focus Settings: This is only enabled if using the Raspberry Pi Camera Module 3 which has a built-in autofocus motor.
3. Gain and Exposure Settings: This menu is used to alter exposure times (how long the shutter is left open), auto-exposure metering and flicker.
4. Auto White Balance Settings: These settings can alter the color temperature of a shot. Typically this is left on auto, but experts will tweak the color temperature based on the light source. Sunlight is warm, indoor lights are typically fluorescent / LED and often make an image “cool”.
5. Brightness & Contrast Settings: These settings will alter the brightness of the image, color saturation, contrast and sharpness.
6. Scaler Crop Settings: Rather than capture the entire frame, we can crop the image to a specific resolution and set the center of the frame using a X / Y offset.
Tweaking the settings before a shot
We’ll now use the settings to alter the brightness and to crop the image to focus on a specific part of the subject.
1. Frame the subject using the preview window.
2. Set the focus using the Auto Focus settings menu. We chose to use continuous autofocus. This will force the camera to hunt for the best focus. We can change the focus range if our subject is close to the lens (macro).
3. Leave the Gain and Exposure settings as is. You can tweak these if you are a photographer.
4. Tweak the Auto White Balance Settings to match the temperature of the light source. Normally auto will work just fine, but try the other settings to warm or cool your image.
5. Alter the Brightness & Contrast settings to match your requirements. Even with our bright studio lights we bumped the brightness to 0.1. All other settings were left as is.
6. Crop the image to focus on the subject. We set the image size to 1080p and set the X and Y offset to capture the subject dead center of the crop. To reset, click on Reset Default Settings.
7. Click Capture Image to take the shot.
8. Click on View Image Gallery and then click on View for that image.
9. Download the image to your computer.
Using the camera output with OBS
Picamera2 web UI Lite streams a raw video stream as a URL and we can use this with OBS to create a streaming camera. We can also use it for a basic webcam streaming setup.
To access the stream via a browser, open a browser tab to the address of the stream, followed by :8080 and then /video_feed. For our stream we went to raspberrypi.local:8080/video_stream.
To use the stream in OBS
We’ve got a few OBS tutorials to help you get to grips with this fantastic video streaming tool. How to record videos using OBS is a great starting point. Moving onwards we have a how to stream using OBS. Lastly, we have an advanced how to crop and zoom video in OBS.
1. Open OBS and choose the scene that you want to add the stream to.
2. Under Sources click on the + and select Browser.
3. Name the source Picamera2_stream and click OK.
4. Set the URL to the video stream, and the width and height for a 1080p video, then click OK. Our example stream URL was raspberrypi.local:8080/video_stream . Tweak the width and height as you see fit, we chose 1080p as it is a common resolution for streaming video.
5. The Picamera2 video stream will now appear in OBS. Try switching scenes from one camera to another.
