OPENAI API // GPT For Sheets // PROMPT ENGINEERING // NEXT.JS 13 // Vercel Edge functions

An Important Reminder About Chat Interfaces In The Wake of ChatGPT

Chatbots have a long history of uselessness.

I’m not trying to make a bold statement about web UX here, it’s just something I’ve had to remind myself of lately–how badly (but properly) maligned chatbots were until ten weeks ago.

It’s where I most quibble with the dismissal of ChatGPT by AI bigwigs as “nothing revolutionary”–in web UX terms at least, LLMs redeeming the chat interface is about as revolutionary as it gets.

This is something I’ve reflected on while navigating the first crop of ChatGPT clone demos, a hot category in my January YouTube algorithm. Each new project keeps me wondering, will this project feature-match or feature-exceed OpenAI’s chatbot implementation? What even are ChatGPT’s most important features? How exactly does ChatGPT make chatbots tolerable?

Vercel Edge functions on the left, serverless functions on the right.

The first major UX upgrade I noticed about ChatGPT was its staccato text delivery: whatever ChatGPT was spewing, it was spewing in chunks. The earliest template I saw to get this right was @nutlope’s AI Twitter Bio demo, which more or less sold me on Next.js for LLM front-ends and Vercel Edge functions for LLM streaming (for the next few experiments at least.)

After tweeting the Vercel template, my old Web 1.0 comrade Greg Beato reached out suggesting a perfectly plausible customization. At some point he’d registered the domain name dearaibby.com and wondered if we could hijack the Vercel demo’s one-question interface to simulate an old-fashioned advice columnist.

With ease! Deploying an adapted prototype took maybe an hour, and applying Greg’s powerful purple design took even less. Thinking about the best wording for our prompt context took me a little bit longer.

Greg will maybe find a nice AI-generated background pattern at patterned.ai

Greg’s prompt (see below, left) returned a convincing Dear Abby, but I couldn’t help feeling like we were ignoring an equally impersonable advisor: Dear Dotti. It occurred to me whatever editorial guidelines the Weekly World News originally devised for the column in the 1980s probably looked a lot like a GPT prompt, ie. what fits on a standard-sized post-it note.

INSULTING, QUICK-TEMPERED, EASILY DISTRACTED got us a very convincing Dotti, and the last two terms were probably overkill. (Like SLIGHTLY MAD, they foreshadow my plans to prompt GPT to footnote poetry in the scholarly style of Charles Kinbote. Stay tuned!) Ultimately Greg was quite taken with the Dotti simulacrum, he thinks she has a real knack for emojis. See for yourself:

“You should have swallowed your pride and used a net.”

One noteworthy takeaway from this exercise was my discovery of Google Sheets as a surprisingly functional scratchpad for GPT prompts. The same day Google’s CEO was being panned for that Bard demo, I was being blown away by this free 3rd-party extension, GPT For Sheets.

Here’s an example: I’d suggested we give each correspondent an alliterative nickname like “Sleepless in Seattle.” If we didn’t mind prompting users for location permissions, it would be easy enough to grab latitude and longitude with the browser’s Geolocation device API.

Now, there are endless APIs that’ll reverse geocode GPS data, but what if we just let text-davinci-003 figure out the whole thing for us?

Perfecting that prompt is obviously quite doable in a Python notebook or OpenAI’s playground or a HuggingFace space, but constructing it over a series of cells in Sheets is just a different level of easy. (I mean, it auto-caches and auto-saves.)

The question in cell A1 is implicit, I discover later.

With the city name in hand, prompting for an apt alliteration was as simple as asking:

There’s also a GPT_CREATE_PROMPT helper function to cleanly concatenate cell ranges.

It’a hardly a streamlined prompt yet, but it’s eye-opening to see how well the spreadsheet medium works for prompt engineering in general. To me, that counts as a somewhat big deal. Google Sheets as a viable prompt IDE feels like more than a cool hack–the workflow may well become a new habit.

TRY FOR YOURSELF

• Install GPT for Sheets and Docs on Chrome on Google’s Workspace Marketplace. All the functions work intuitively, but I’ve found the individual explanations useful to walk through alongside an open sheet. Give creator Stanislas Marion a follow on twitter.
• Along with the AI Twitter Bio template, Vercel Developer Advocate Hassan El Mghari has blogged the code and YouTubed a short explainer vid. The Edge vs. Serverless parts of that video (which I excerpt in the animated results gif above) and the speed-test in particular (4:05–4:40) are jaw-droppers.
• My modifications to Hassan’s code for dearaibby.com are on GitHub. Greg’s demo is currently alive and kicking at dearaibby.com. (Although it’ll hiccup once certain API limits are reached.)
• React writers interested in AI demos should give a look to Vercel’s recent focus on the AI category, their developer advocates have been releasing a barrage of useful AI-driven templates this winter.

An excellent point by Vercel’s CEO!

Joey Anuff is a first-wave web hacker, former TV developer, and current ML developer. For 2023, he’s trying to tweet more. Currently on the lookout for interesting DevRel work.