Rapid Prototyping Tools

Turn Python logic into a shareable web app in hours — no HTML, CSS or JavaScript. Learn why traditional web dev is slow, and how Streamlit and Gradio fix it.

17.1 GenAI Rapid Prototyping

Why rapid prototyping matters:

• Speed wins — build and test ideas in hours, not weeks.
• Ideas need testing — validate assumptions early, gather feedback fast.
• Democratising access — turn Python logic into tools non-technical teams can actually use.

17.2 HTML/CSS Limitations

Why does traditional web development slow you down?

What begins as a "simple web page" often becomes weeks of work. That is exactly why rapid prototyping tools exist — they let a Python developer skip the whole frontend stack.

17.3 Introduction to Streamlit

Key features

• Python-only — if you can write Python, you can build a web app.
• Automatic reactivity — the script re-runs automatically whenever a user interacts; no event/callback management.
• Built-in professional design — clean, responsive UI by default.

Running a Streamlit app

Write a file app.py, then in the terminal run streamlit run app.py — a browser tab opens with your live app.

import streamlit as st

# Text hierarchy
st.title("Text Analyser")
st.header("Paste your text below")

# Input widget - returns the typed string
text = st.text_area("Enter text:")

# A button triggers an action when clicked
if st.button("Analyse"):
    word_count = len(text.split())
    st.metric("Word count", word_count)
    st.success("Analysis complete!")

Common Streamlit elements

17.4 Introduction to Gradio

The Gradio philosophy — function-first

Streamlit builds complete applications. Gradio wraps a single function: you provide a Python function plus its input and output types, and Gradio generates the interface. It handles images, text and numbers easily — built specifically for ML demos.

import gradio as gr

# Step 1: a normal Python function
def greet(name):
    return f"Hello, {name}! Welcome to GenAI."

# Step 2: tell Gradio the inputs and outputs
demo = gr.Interface(
    fn=greet,
    inputs="text",
    outputs="text"
)

# Step 3: launch - opens a local web app
demo.launch()

Three steps: (1) write a normal Python function, (2) describe its inputs/outputs to gr.Interface, (3) call .launch() — Gradio builds the UI for you.

17.5 Streamlit vs Gradio

What you can build

Internal data tools, text-analysis apps (sentiment, readability), ML model demos, GenAI summarisers, shareable prototypes, business calculators — all in hours, in pure Python.

Streamlit/Gradio syntax and the choice between them are common questions.

import streamlit as st

st.title("Square Calculator")

num = st.number_input("Enter a number:", value=0)

if st.button("Calculate"):
    st.success(f"The square of {num} is {num ** 2}")

import gradio as gr

def reverse(text):
    return text[::-1]

demo = gr.Interface(fn=reverse,
                    inputs="text",
                    outputs="text")
demo.launch()