Interactive Prompt UI Design

In this lesson, you will learn how to transform basic, text-heavy shell scripts into clean, intuitive interfaces that guide your users through complex tasks.

When writing interactive scripts, the most common mistake is overwhelming the user with a wall of text or cryptic input requests. A well-designed prompt UI reduces cognitive load by providing clear instructions, visual separation, and immediate feedback.

The Power of Whitespace and Delimiters

In a terminal, whitespace is your best friend. Instead of dumping output directly against the prompt, use echo commands to create "breathing room." Visual delimiters (like rows of dashes) help users scan the screen quickly.

Consider this simple pattern for a user input prompt:

#!/bin/bash

# Clear the visual clutter
clear

echo "------------------------------------------"
echo "  SYSTEM MAINTENANCE TOOL"
echo "------------------------------------------"
echo "1. Backup user home directory"
echo "2. Clear temporary cache"
echo "3. Exit"
echo "------------------------------------------"

read -p "Please select an option [1-3]: " choice

case $choice in
    1) echo "Starting backup..." ;;
    2) echo "Cleaning cache..." ;;
    3) exit 0 ;;
    *) echo "Invalid selection. Please try again." ;;
esac

Tips for a Better UX

• Prompt Formatting: Always use read -p to define a clear prompt string. Adding a space at the end of your prompt (e.g., Enter path: ) prevents the cursor from bumping into the text.
• Status Indicators: Don't leave the user wondering if the script froze. Use simple status messages like [OK] or [WORKING...] in brackets. This acts as a visual anchor that the system is processing their request.
• Validation: Never blindly accept input. If a user enters a path that doesn't exist, provide a friendly error message and return them to the prompt immediately rather than letting the script crash with a cryptic bash error.

By treating your terminal like a graphical window—keeping things centered, spaced, and validated—you turn a functional script into a professional tool.

Key Takeaway: Effective terminal UI design relies on whitespace, consistent delimiters, and clear, validated input prompts to guide the user through the script logic.