Build a Slack focused Chrome extension that describes the image in the current message with one keyboard shortcut, presents the result in an accessible modal, and accepts follow-up questions about details you need.
Source episode · 05:30
How I AI: Building Custom AI Accessibility Tools for Slack with Joe McCormick & Claude Codewith Claire Vo
Joe presses Ctrl Shift D on a Slack message, receives a detailed stroller description, and asks a follow-up question without leaving the conversation.
A keyboard driven Slack image describer with a screen reader friendly modal and follow-up questions.
OpenAI conversational AI
Step by step
Follow the sequence once, then adapt the prompts, checks, and handoffs to your own setup.
5 steps
Create a Manifest V3 Chrome extension limited to the Slack web app. Register Ctrl Shift D, or another available shortcut, and route the command to the active Slack tab. Keep host permissions limited to Slack and the model endpoint.
In the content script, identify the Slack message that currently has keyboard focus and locate its image. Capture the image URL or data plus minimal surrounding message context. Return a clear status if the message has no image.
Send the image to a vision capable model. Ask for a concise overview followed by details useful for understanding the message, such as objects, visible text, layout, and anything uncertain. Keep the image in conversation state for follow-up questions.
Describe this image for someone who cannot inspect it visually. Start with a one sentence overview, then list the important objects, visible text, spatial relationships, colors when relevant, and any uncertainty. Use the surrounding Slack message only as context, not as evidence about what is visible.
Present the description in a real accessible dialog. Move focus to its heading, trap focus inside while open, support Escape, and restore focus to the original Slack message when it closes. Include a useful loading announcement before the result arrives.
Add a question field inside the dialog and send each question with the original image and prior answer. Joe used this to ask what age child a pictured stroller was designed for. Keep the answer in the same dialog and announce the update.
What age child is this product designed for? Base the answer only on visible evidence in the image. If the age range is not shown or cannot be inferred reliably, say that.
This interactive feature transforms the tool from a simple descriptor into a contextual Q&A bot for images.
Turn an idea into a PRD, user stories, and a plan.
After the steps
How to recover when the loop fails and where human judgment helps.
Recover
Keep building
A guide for solo entrepreneurs to manage business operations using AI. Learn how to source manufacturers, build and maintain an e-commerce site, and replace dashboards with voice commands, all without a human team.
Turn a complex, artistic concept into a manufacturable 3D model. This workflow shows how to use AI to generate a design from a photo and then create CAD files for 3D printing, even for previously 'unmanufacturable' items.
Learn to translate fashion sketches into a full suite of marketing visuals. This workflow covers creating a detailed design spec, generating a core product photo with AI, and iterating for different contexts like runway and influencer shots.
Join 100,000+ product managers who use ChatPRD to write better docs, align teams faster, and build products users love.