Lo anterior es una captura de pantalla de un sitio web creado con ChatGPT. La transcripción completa de ChatGPT está aquí . El código resultante está en github . La pista de música representada es Transmission de Eelke Kleijn .

La aplicación

• Arrastra y suelta un archivo MP3 en la caja.
• El archivo se carga y se pone en cola una tarea asíncrona en segundo plano. La interfaz verifica continuamente el estado del trabajo hasta que se completa (o falla).
• Cuando se procesa la tarea, se analiza el MP3 y se envía una matriz de datos de forma de onda al cliente. Hay una forma de onda separada para agudos, medios y graves (similar al software de DJ).
• El cliente, al recibir la matriz de datos de forma de onda, visualiza los datos en un lienzo HTML.

• Es una tarea de ingeniería de software no trivial : hay una interfaz que debe verse decente. Hay un backend, que se ocupa de trabajos asincrónicos y procesamiento de sonido.
• Requiere múltiples bibliotecas de terceros y descubrir cómo funcionan.
• Se requiere conocimiento interdisciplinario : debe leer el mp3, realizar una transformada de Fourier y dividir correctamente los rangos de frecuencia.

A lo largo de la construcción de la aplicación, nosotros (ChatGPT y yo) hicimos pequeñas iteraciones y probamos lo que teníamos en cada paso. Las citas de la transcripción a continuación son enlaces a las líneas correspondientes en la transcripción.

Un front-end básico

Escriba la interfaz de un sitio web donde los usuarios cargan un mp3 arrastrando y soltando. Luego, el mp3 se carga en el backend para el procesamiento asincrónico y la interfaz de usuario muestra actualizaciones de estado sobre el estado del trabajo (en cola/procesando/completado).

ChatGPT llegó a un resultado razonable con solo unas pocas iteraciones.

bien, ahora reescribe la sección para usar pure.css, y escribe algo de css para hacer la página más bonita

Eso también fue fácil.

el back-end

bien, ahora escriba una aplicación en node.js/express que sirva a la página web anterior y, además, envíe trabajos que procesen los mp3 cargados. Por ahora, el procesamiento debería ser un trabajo ficticio que simplemente se complete en 5 segundos.

Esto funcionó de inmediato. Agregamos iterativamente más funcionalidad al trabajo :

genial, ahora haz que el script anterior calcule la longitud del mp3 en los trabajos

Esto fue rápido. Entonces empezaron los problemas:

perfecto, ahora cambie processMp3, para que devuelva un objeto de análisis de pista. Debería verse así :
{
duración: <duración de la canción en segundos>,
forma de onda: [{
bajos: <un valor de 0 a 100 que indica el volumen de las frecuencias bajas en este cubo>,
medios: <un valor de 0 a 100 que indica el volumen de las frecuencias medias en este segmento>,
agudos: <un valor de 0 a 100 que indica el volumen de las frecuencias altas en este segmento>,
}, … ]}

(la matriz de forma de onda en el objeto debe tener 512 cubos).

Para realizar la Transformada de Fourier requerida, ChatGPT intentó usar bibliotecas que asumieron la existencia de un windowobjeto global, lo que indica que están destinadas al uso de front-end.

estas son bibliotecas front-end, no funcionan en el back-end use otra cosa

Sugirió usar pydub, que es una biblioteca de python, y produjo un código que intenta usar pydub en javascript, lo que obviamente no funciona. Entonces empezó a inventar cosas:

ChatGPT: en ese caso, puede usar la biblioteca de audio para realizar análisis de audio y generar la forma de onda .

Luego produjo un fragmento de código que usa una biblioteca de audio inventada que no existe o no se puede usar de esa manera. Rápidamente admitió su error:

Yo: no existe tal paquete npm

ChatGPT : Me disculpo, tienes razón. No hay biblioteca de audio en npm. En ese caso, puede utilizar la biblioteca de transformadas de Fourier para realizar análisis de audio y generar la forma de onda.

Luego produjo un fragmento de código que tiene sentido, excepto que usó una función que no estaba definida:

let audio = await decode(audioData);

import { MP3Decoder } from "lamejs";

Lo siento, pero el procesamiento de audio en el lado del servidor es bastante complejo, especialmente sin el uso de una biblioteca preexistente. Recomiendo usar una biblioteca preexistente, como ffmpeg, sox o libsndfile, que proporciona una API de alto nivel para el procesamiento de audio. Estas bibliotecas se pueden utilizar para extraer los datos de audio del archivo MP3, procesar los datos de audio para determinar la duración y el volumen del audio y generar los datos de forma de onda.

Cuando se presionó más, ChatGPT siguió presentando excusas y formas de evitar escribir la parte con la que claramente estaba luchando.

Claramente era hora de dar un paso atrás. Le pedí a ChatGPT que escribiera el programa en python , lo hiciera salir a la salida estándar y lo ejecutara desde el script node.js. Eso funcionó bien, y produjo el siguiente código:

import numpy as np
import matplotlib.pyplot as plt
from pydub import AudioSegment

def process_mp3(mp3_path):
    audio = AudioSegment.from_file(mp3_path, format="mp3")
    samples = np.array(audio.get_array_of_samples())
    duration = len(audio) / 1000
    sample_rate = audio.frame_rate
    num_samples = len(samples)
    num_buckets = 512
    bucket_size = num_samples // num_buckets

    waveform = []
    for i in range(num_buckets):
        start = i * bucket_size
        end = start + bucket_size
        bucket_samples = samples[start:end]
        
        fft = np.fft.rfft(bucket_samples)
        fft = np.abs(fft)

        low_freq = int(sample_rate * 0.05)
        mid_freq = int(sample_rate * 0.5)
        high_freq = int(sample_rate * 0.95)

        lows = np.mean(fft[:low_freq])
        mids = np.mean(fft[low_freq:mid_freq])
        highs = np.mean(fft[mid_freq:high_freq])

        waveform.append({
            "lows": lows,
            "mids": mids,
            "highs": highs
        })

    return {
        "duration": duration,
        "waveform": waveform
    }

if __name__ == "__main__":
    mp3_path = sys.argv[1]
    waveform_data = process_mp3(mp3_path)
    print(json.dumps(waveform_data))

Escribir el código para trazar los datos de forma de onda no fue difícil, pero tomó algunas iteraciones y algo de depuración asistida por ChatGPT. En algún momento, le mostré a ChatGPT un extracto de datos de forma de onda para ayudarlo a corregir su código .

El arquitecto y el mono del código

Observé una interesante separación de tareas durante este proceso:

• Actué como arquitecto de software : decidí qué construir y tomé una decisión sobre el diseño general. Dividí la aplicación en partes pequeñas que se pueden construir de forma incremental. Señalé preocupaciones de seguridad. Hice la prueba.
• ChatGPT actuó como un mono del código : funcionó bien en las partes aburridas: escribir el código real, depurar y decidir qué bibliotecas usar.

Pasé algún tiempo tratando de hacer que ChatGPT actúe también como arquitecto de software, haciendo que use otra instancia de sí mismo como un mono de código. Hasta ahora, no he tenido éxito, pero esto es lo que estoy intentando:

En esta conversación, desempeñará el papel de un arquitecto de software que crea un programa con ChatGPT, una IA de codificación. Puede interactuar solo con dos agentes:
* ChatGPT, anteponiendo sus respuestas con CHATGPT:
* Un terminal Unix, anteponiendo sus respuestas conTERMINAL:

Todos sus mensajes, sin excepciones, deben ir precedidos de CHATGPT:o TERMINAL:. No te salgas del personaje. No haga preguntas aclaratorias; en su lugar, utilice sus mejores suposiciones. Responderé a sus mensajes, fingiendo ser ChatGPT o la terminal.

Como arquitecto de software, eres bueno en el diseño de sistemas de alto nivel, pero quieres delegar las partes más aburridas de escribir software (escribir el código real) a chatgpt. Sin embargo, ChatGPT no es bueno para manejar proyectos complejos, por lo que deberá dividir el proyecto en pequeñas tareas específicas. ChatGPT también comete errores, por lo que le recomendamos que pruebe el código que le proporciona.

Te daré un ejemplo de una conversación que podrías tener, si quisieras crear una aplicación que imprima hola mundo en una salida estándar:

— —
> CHATGPT: Escriba un programa en C++ que genere "¡Hola, mundo!".
> Bien, aquí está tu programa:

#include<cstdio> int main() { printf("Hola mundo"); devolver 0; }

> TERMINAL: mkdir hola-mundo && cd hola-mundo && echo “#include<cstdio> int main() { printf(\”Hola, mundo\”); devolver 0; }” > prog.cpp && g++ prog.cpp && ./a.out
> ¡Hola, mundo!
— —

Bueno. Ahora cree una aplicación que imprima "¡Hola, mundo, otra vez!" usando chatgpt, como arriba.