Goodbye Serial Monitor: Build Stunning Arduino Dashboards with LCD & OLED Displays

Professional Polish: Custom Characters

The LCD has a boring font. A, B, C… But it allows you to define up to 8 Custom Characters (0-7). Each character is a 5x8 pixel bitmap.

Let’s make a “Pac-Man” and a “Ghost”.

byte pacman[8] = {
  0b01110,
  0b11101, // Eye
  0b11111,
  0b11100, // Mouth open
  0b11111,
  0b11111,
  0b01110,
  0b00000
};

void setup() {
  lcd.init();
  lcd.backlight();
  lcd.createChar(0, pacman); // Assign bitmap to Slot 0
  lcd.setCursor(0, 0);
  lcd.write(0); // Use write() for special bytes, print() for strings
}

Design Tool: Search online for “LCD Custom Character Generator”. You can click pixels and get the binary code instantly.

Advanced Logic: Building a Menu System

A display implies interactivity. Users expect to push buttons and change settings. This requires a State Machine. Don’t use delay(). Use a switch-case.

int page = 0; // 0=Home, 1=Settings, 2=Info

void loop() {
  if (digitalRead(BUTTON_PIN) == LOW) { 
    page++; 
    if (page > 2) page = 0;
    updateScreen();
    delay(200); // Debounce
  }
}

void updateScreen() {
  lcd.clear();
  switch (page) {
    case 0:
lcd.print("Home Screen");
lcd.setCursor(0,1);
lcd.print("Temp: 24C");
break;
    case 1:
lcd.print("Settings");
lcd.setCursor(0,1);
lcd.print("Set Alarm >");
break;
    case 2:
lcd.print("System Info");
lcd.setCursor(0,1);
lcd.print("Uptime: 42s");
break;
  }
}

This is the skeleton of every UI you have ever used.

Part 2: The OLED Upgrade (SSD1306)

LCDs are cheap ($2) and reliable. But they look… retro. If you want “Cyberpunk”, you want OLED.

• Self-Emitting: No backlight. The pixels are the light.
• High Contrast: Deep black backgrounds.
• Graphics: It’s not just text. It’s a $128 \times 64$ pixel canvas. You can draw lines, circles, and logos.

The Library: Adafruit SSD1306 + Adafruit GFX. (Note: These libraries are Heavy. They use 1KB of RAM just for the screen buffer. on an Uno with 2KB RAM, this is 50% of your memory! Be careful).

#include <Adafruit_SSD1306.h>

// Screen dimensions
#define SCREEN_WIDTH 128
#define SCREEN_HEIGHT 64

// Declaration for an SSD1306 display connected to I2C (SDA, SCL pins)
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, -1);

void setup() {
  if(!display.begin(SSD1306_SWITCHCAPVCC, 0x3C)) { 
    Serial.println(F("SSD1306 allocation failed"));
    for(;;);
  }
  display.clearDisplay(); // Clear buffer

  display.setTextSize(1);
  display.setTextColor(WHITE);
  display.setCursor(0, 10);
  display.println("Hello, OLED!");
  display.drawCircle(64, 32, 10, WHITE); // Draw a circle
  display.display(); // IMPORTANT: Push buffer to screen
}

Critical Rule for OLEDs: Nothing happens until you call display.display(). All your drawing happens in the Arduino’s RAM (the buffer). display.display() sends that buffer to the screen over I2C. If you forget this, the screen stays black.

Drawing Bitmaps (The Logo)

To draw a complex image (like your startup logo), you need a bitmap. This is a C-array of hex codes representing pixels. display.drawBitmap(x, y, myBitmap, width, height, WHITE);

How to generate it:

• Draw your icon in MS Paint (save as monochrome BMP).
• Use an online “Image2Cpp” converter.
• Paste the array into your code. (We will go deeper into this in the “Advanced Projects” week).

Geometric Shapes

The GFX library is powerful.

• display.drawLine(x1, y1, x2, y2, WHITE);
• display.drawRect(x, y, w, h, WHITE); (Hollow box)
• display.fillRect(x, y, w, h, WHITE); (Solid box)
• display.drawCircle(x, y, r, WHITE);
• display.drawTriangle(x1, y1, x2, y2, x3, y3, WHITE);

Use these to make progress bars or battery indicators!

// Simple Battery Bar
void drawBattery(int percent) {
  display.drawRect(0, 0, 20, 10, WHITE); // Battery body
  display.fillRect(20, 3, 2, 4, WHITE);  // Positive terminal
  int width = map(percent, 0, 100, 0, 18);
  display.fillRect(1, 1, width, 8, WHITE); // Charge level
}

Project: The Standalone Atomic Clock

Let’s combine Day 19 (RTC) and Day 20 (LCD). This is a device you can actually put on your desk.

The Bill of Materials (BOM)

Wiring: Daisy chain them! Arduino A4 -> RTC SDA -> LCD SDA Arduino A5 -> RTC SCL -> LCD SCL 5V and GND to both.

The Code (Snippet):

void loop() {
  DateTime now = rtc.now();
  lcd.setCursor(4, 0); // Center the time
  // Leading Zeros trick
  if (now.hour() < 10) lcd.print("0");
  lcd.print(now.hour());
  lcd.print(":");
  if (now.minute() < 10) lcd.print("0");
  lcd.print(now.minute());
  lcd.print(":");
  if (now.second() < 10) lcd.print("0");
  lcd.print(now.second());
  lcd.setCursor(0, 1);
  lcd.print("Temp: ");
  lcd.print(rtc.getTemperature()); // DS3231 has a temp sensor too!
  lcd.print(" C");
  delay(1000); 
}

Avoiding “Flicker”

A common rookie mistake in loop():

void loop() {
  lcd.clear(); // Wipe screen
  lcd.print(time); // Write new time
  delay(100);
}

Do NOT use lcd.clear() inside a loop. It takes a long time (milliseconds) to execute. The screen will blink and flicker annoyingly. Better: Overwrite old data. If you print “12:00” and then “12:01” on top of it, it looks smooth. If you need to erase a longer string, print spaces: lcd.print(" ").

Conclusion

You have escaped the Serial Monitor. Your projects are now standalone devices. They can communicate with humans.

• LCD: Best for text, numbers, low memory usage. Rugged.
• OLED: Best for graphics, small size, “Cool factor”. High memory usage.

This concludes our “Core Modules” arc. We have covered Input (Sensors), Output (Sound, Light, Displays, Motors), and Time. Tomorrow, on Day 21, we enter a new realm. We are going to make the Arduino Think. We will explore State Machines—the logic pattern used to build complex robots and game consoles.