Introduction: HackerBox 0050
Greetings to HackerBox Hackers around the world! For HackerBox 0050, we are assembling and programming the HB50 embedded processor board. The HB50 supports experimenting with ESP32 microcontrollers, embedded IoT WiFi, bit bang sound, RGB LEDs, full-color TFT LCD displays, touch screen inputs, Bluetooth, and more. HackerBox 0050 also explores a tiny keyboard solution for any embedded project, I2C interfaces, power budgeting, and cellular automata.
This guide contains information for getting started with HackerBox 0050, which can be purchased here while supplies last. If you would like to receive a HackerBox like this right in your mailbox each month, please subscribe at HackerBoxes.com and join the revolution!
HackerBoxes is the monthly subscription box service for hardware hackers and enthusiasts of electronics and computer technology. Join us in livin' the HACK LIFE.
Step 1: Content List for HackerBox 0050
- Exclusive HB50 Printed Circuit Board
- ESP-WROOM-32 Dual Core WiFi Module
- QVGA Color TFT LCD 2.4inch Display
- Integrated Display Touchscreen with Stylus
- Six WS2812B RGB LEDs
- Six Surface Mount Tacile Buttons
- Piezo Buzzer 12mm SMD
- AMS1117 3.3V Linear Regulator SOT223
- Right Angle 40pin Breakaway Header
- Two 22uF Tantalum Capacitors 1206 SMD
- Two 10K Ohm Resistors 0805 SMD
- CardKB Mini Keyboard
- Grove to Female DuPont Breakout Cable
- CP2102 USB Serial Module
- DuPont Jumpers Female-Female 10cm
- Hokusai Great Wave PCB Decal
- Exclusive HackerBox WireHead Decal
- Exclusive HackerBox 50 Challenge Coin
Some other things that will be helpful:
- Soldering iron, solder, and basic soldering tools
- Computer for running software tools
Most importantly, you will need a sense of adventure, hacker spirit, patience, and curiosity. Building and experimenting with electronics, while very rewarding, can be tricky, challenging, and even frustrating at times. The goal is progress, not perfection. When you persist and enjoy the adventure, a great deal of satisfaction can be derived from this hobby. Take each step slowly, mind the details, and don't be afraid to ask for help.
There is a wealth of information for current and prospective members in the HackerBoxes FAQ. Almost all of the non-technical support emails that we receive are already answered there, so we really appreciate your taking a few minutes to read the FAQ.
Step 2: HB50 Printed Circuit Board
To commemorate HackerBox Number 0050, we've spun an updated version of the most popular HackerBox circuit board by popular demand. The HackerBox 0020 Summer Camp badge kit sold out at DEF CON 25 in less than two hours. The PCB files have since been frequently requested. The board has been reprinted at least a couple of times by third parties. The design has inspired a handful of other badges and embedded IoT projects that we are aware of and hopefully several more that we are not aware of.
The updates found in the new HB50 PCB Kit include swapping the ESP-32 DEVkitC for the more compact ESP-WROOM-32 module. The five capacitive touch buttons have been replaced with mechanical tactile buttons. The five RGB WS2812 LEDs that were in white packages have been increased to six and are now in black packages. The piezo buzzer has been replaced with a more compact surface mount version. The power supply has been simplified. The color TFT display has been increased from 2.2 inches to 2.4 inches. The PCB is more compact and even has a few IO pins broken out for your hacking pleasure. Since the time of HackerBox 20, there are a lot more projects, examples, and code available for the ESP32, so let's get ready to rumble...
- ESP32 Dual Core 160MHz Processor
- 2.4 inch QVGA Color TFT LCD Display
- WiFi 802.11 b/g/n/d/e/i/k/r
- Bluetooth LE 5.0
- Five Tactile Pushbuttons (+ one for Reset)
- Six RGB WS2812 LEDs
- Piezo Buzzer
- 3.3V Linear Regulator
- Expansion Header
As with its predecessor, the HB50 can be worn on a lanyard, used as a handheld, mounted on a wall, or deployed pretty much anywhere in countless wireless and colorful applications.
Step 3: Bring Up the HB50 Board
To minimize, or at least isolate errors, we suggest starting assembly by populating only the bare minimum of components to the HB50 PCB that are required to program the ESP32. This minimum viable approach is outlined in these steps:
- Watch this video on soldering castellated modules.
- Solder the ESP-WROOM-32 module onto the PCB. Take your time. Don't worry about the central ground pad under the module. It can only be soldered by reflow and is only there for added thermal coupling.
- Use a multimeter to make sure there is no short between 3V3 and GND. If there is a short, it must be identified and removed before applying power to the board or the smoke monster might come out.
- Solder the two 10K resistors just above the EN and IO0 buttons.
- Solder the EN and IO0 buttons. The other four buttons can be left off for now.
- Break off a 16 pin strip of header. Insert it from the CPU side of the PCB such that the pins are pointing to the nearest edge of the PCB. Then solder the header into place from the button side the of the PCB.
- Verify again that there are no shorts between 3V3 and GND.
- Use four DuPont jumper wires to connect the CP2102 module as shown. Note that we are temporarily using the 3V3 power source since the linear regulator is not yet populated onto the PCB.
- If your computer does not already have the Arduino IDE installed, obtain it here.
- Configure ESP32 support within the Arduino IDE using this guide.
- In the IDE, set tools > board to "ESP32 Wrover Module".
- Plug the CP2102 module into a USB port on the computer.
- In the IDE, set tools > port to the correct USB port for the CP2102.
- If a new port doesn't appear when the CP2102 module is inserted, install a the required USB driver from Silicon Labs.
- Grab the button_demo sketch.
- Compile and upload the sketch.
- When uploading starts, hold down both EN and IO0 buttons. EN is basically a reset button and IO0 is the strapping pin to force reprograming the flash.
- Once the dots and dashes appear in the IDE, let up the EN button (release reset) but continue holding down the IO0 button until the flash programming begins to be sure that the strapping pin in recognized upon boot.
- When programming is complete, hit the EN button again to reset and start the newly flashed code.
- Open the Arduino IDE Serial Monitor and set it to 115200 baud.
- Pressing the IO0 button should generate a message in the serial monitor.
Step 4: Buttons, Buzzers, and LEDs, OH MY!
Once the initial programming step is successful, power off the HB50 board and solder on the remaining four buttons. The same button_demo sketch should now report all five buttons (IO0, A, B, C, and D) to the serial monitor when they are pressed.
Power off the HB50 board and solder the buzzer onto its pads. Orient the dot on the buzzer to be closest to the "+" pad on the HB50 board. Program the buzzer_demo sketch and reset (EN) the board to let it run. Sounds good?
WS2812B RGB LEDs
Power off the HB50 board and solder the six LEDs onto their pads. Orient the white marked corner of each LED to correspond to the tabbed corner as shown on the PCB silkscreen.
From the Arduino IDE tools > Manage Libraries, install the FastLED library.
Open the sketch: File > Examples > FastLED > ColorPalette.
In the sketch code, change LED_PIN to 13, NUM_LEDS to 6, and LED_TYPE to WS2812B.
Upload the sketch and reset (EN) the board to let it run. Enjoy blinky lights of every color.
LINEAR POWER REGUALTOR
With the LEDs in play (and especially once the WiFi transmitter is enabled) the HB50 is drawing a lot of current from the 3V3 supply. Let's improve the 3.3V power capacity by soldering the AMS1117 (SOT 233 Package) Linear Regulator into place. Also populate the two 22uF filter capacitors next to the regulator. Note that one side of each capacitor silkscreen is rectangular and the other side if octagonal. The capacitors should be oriented so that the dark stipe on the package aligns to the octagonal silkscreen side. The regulator will now turn some of the 5V supply into 3.3V and can provide a lot more current than the CP2102 module by itself. To now supply power to the HB50 through the 5V supply, move BOTH ENDS of the 3V3 DuPont jumper over to 5V. That is, source 5V from the CP2102 module into one of the 5V input pins on the HB50 header. Note that the 5V pin can actually be supplied with any voltage of between 3.5V and 5V.
Step 5: ILI9341 QVGA Color TFT LCD Display
The MSP2402 Display (lcdwiki page) is an SPI bus module based on the ILI9341 chip. The chip drives a 2.4inch color screen supporting 65,000 colors and a resolution of 320X240 pixels (QVGA).
The module also features touch screen input and an SD card slot.
PRE-TEST DISPLAY I/O PINS
If you've been having problems with the ESP-WROOM-32 pin soldering up to this point, it might be a good idea to pre-test the display module I/O pins before soldering the display module into place. As shown below and on the schematic diagram of the PCB, the ESP32 IOs in play are 19, 23, 18, 5, 22, 21, and 15. Note that these are the IO numbers and not the pin numbers. The pins can be tested by writing a small program that sets all of those IOs as outputs and then loops cycling through the IOs turning each one on and off in turn with a second or two delay between. A simple LED with a current-limiting resistor attached can be used as a probe to make sure that each IO pin mapped to the display headers (see the schematic) is being properly turned on and off and that none of them are coupled together.
Once all of the pins are verified, the TFT display can be soldered into place using both the long and short headers.
INSTALL AND CONFIGURE TFT LIBRARY
From the Arduino IDE: tools > Manage Libraries, install the TFT_eSPI Library
Go to the Arduino Libraries folder. Open the TFT_eSPI folder and edit the file User_Setup.h to configure the module driver chip, pixel resolution, and IO pins. Do this by making sure that the defines are (un)commented as shown below and set to the values as shown. You can verify that these correspond to the connections in the PCB schematic.
// Section 1. #define ILI9341_DRIVER #define TFT_WIDTH 240 #define TFT_HEIGHT 320 // Section 2. // For ESP32 Dev board #define TFT_MISO 19 #define TFT_MOSI 23 #define TFT_SCLK 18 #define TFT_CS 5 #define TFT_DC 22 #define TFT_RST 21 //#define TFT_RST -1 //#define TFT_BL 32 #define TOUCH_CS 15
Open and upload the sketch:
File > Examples > TFT_eSPI > 320 x 240 > Cellular_Automata
This sketch is a cool visual demonstration of Conway's Game of Life.
A hacker glider might evolve into existence... keep an eye out!
DISPLAY HACKERBOX LOGO ON TFT LCD
Try out the BitHeadDemo sketch.
Step 6: Touch Screen User Input
The following sketch can be used to configure and test out the touch screen functionality:
File > Examples > TFT_eSPI > 320 x 240 > Keypad_240x320
The "send" button transmits the entered number to the serial monitor at 9600 baud.
Step 7: CardKB I2C Keyboard
This tiny board implements a full-featured QWERTY keyboard which can be used with pretty much any of your microcontroller projects. The keyboard communicates using a GROVE A port (I2C interface) on Address 0x5F. Button combinations (Sym+Key, Shift+Key, Fn+Key) are supported to output rich key values.
Start with the simple example CardKB_Serial sketch, which communicates with the keyboard over GROVE I2C and echoes keypresses to the Serial Monitor. The sketch can be run on ESP32 (such as the HB50), Arduino UNO, Arduino Nano, or any platform supporting I2C.
Note that there are two different Wire.begin calls for ESP32 and for UNO/Nano. Uncomment the appropriate one of those lines for the host you are using. Wire up the yellow and white GROVE breakout wires to the pins specified on that line of code. Wire the red GROVE breakout wire to 5V and the Black GROVE Wire to GND.
Manufacturer Documentation Page. Note that even though the CardKB onboard microcontroller comes pre-programmed, the firmware source is available if you wish to hack the keyboard.
We hope you are enjoying this month's HackerBox adventure into electronics and computer technology. Reach out and share your success in the comments below or on the HackerBoxes Facebook Group. Also, remember that you can email email@example.com anytime if you have a question or need some help.
What's Next? Join the revolution. Live the HackLife. Get a cool box of hackable gear delivered right to your mailbox each month. Surf over to HackerBoxes.com and sign up for your monthly HackerBox subscription.