Melanie Kyle & Kelly Howarth
Visual explainers with Napkin AI
Generate visual explainers (diagrams, infographics, flowcharts), improve accessibility with screen-reader friendly descriptions, and embed them into Canvas.
Generate Accessible Image and Diagram Alt Text
How to generate an infographic from a text prompt using Napkin AI and then create a detailed accessibility description for it using a separate AI tool
This workflow demonstrates how to use multiple generative AI tools to create accessible instructional visuals. First, Napkin AI is used to generate an infographic from a descriptive text prompt. Then, a separate AI chat tool like Microsoft Copilot is used with a specialized prompt to generate a detailed, screen-reader-friendly description of the final image. This two-tool process ensures that the visual content created for a course is accompanied by high-quality alt text, making it accessible to all learners.
00:04Access Napkin AI and start a new project. Navigate to Napkin AI. You can use the free version or sign in to a subscribed account. Click 'New Napkin' to begin.00:33Prepare and copy a text prompt describing your desired visual. Write a clear, descriptive prompt for the infographic or diagram you want to create. Copy this text to your clipboard.01:05Paste the prompt into Napkin and generate the visual. Paste your text into the blank Napkin canvas and click the lightning bolt icon to the left of the text to start the generation process.01:29Review the generated options and select the best design. Napkin will provide several visual interpretations of your prompt in the left-hand panel. Click through the options and select the one that most accurately represents your content.02:15Refine the visual for clarity and accessibility. Remove any automatically generated titles that you don't need. Check the colors for accessibility compliance; click on any element to open the color palette and change colors that have poor contrast (e.g., yellow on white).03:52Export and download the finished visual. Click the 'Export visual' button in the top right. Select 'PNG' as the format and click 'Download'.04:10Prepare to generate the detailed description. Open a separate AI chat tool (e.g., Microsoft Copilot). Paste in a detailed prompt that instructs the AI to create a screen-reader-friendly description of an image.04:36Upload your downloaded image to the AI chat tool. Attach or upload the PNG file you downloaded from Napkin to your prompt in the chat tool.04:48Generate and copy the detailed description. Submit the prompt and image to the AI. Once the detailed description is generated, review it for accuracy and copy the text.05:03Add the image and its description to your course page. In your learning management system (e.g., Canvas), upload the image. Then, paste the detailed, screen-reader-friendly description into an appropriate element on the page, such as an accordion or text block, to accompany the visual.
Tool (Visuals) | Napkin AI is used to generate infographics and diagrams from text prompts. |
|---|---|
Tool (Alt Text) | Microsoft Copilot is used to generate a detailed accessibility description from an image and a specialized prompt. |
Access (Napkin) | The free version of Napkin AI allows for approximately 15 - 20 image generations per month. |
Example Prompt (Napkin) | The presenter used the prompt: "Tiered infographic showing three layers: Audience Behavior at the bottom, Algorithm Response in the middle, and Content Visibility at the top. Show how these three layers interact between algorithms, which impacts reach." |
Example Prompt (Alt Text) | The presenter used a detailed, structured prompt from the TeachAI 'Generate Accessible Image and Diagram Alt Text' workflow to create the screen-reader-friendly description. |
Export Format | The visual is exported from Napkin AI as a PNG file. |
Human Review | AI-generated visuals should be reviewed to remove unwanted elements like titles and to ensure colors meet accessibility standards for contrast. |
Related skills
- Integrate multiple tools into workflows — This activity demonstrates a key workflow of using one AI tool (Napkin) for visual creation and another (Copilot) for generating accessibility text.
- Create multimodal outputs — The core task involves transforming a text-based idea into a visual infographic, directly illustrating the creation of multimodal content.
- Apply human judgement to validate AI outputs — The process requires the user to select the best visual, remove unwanted titles, and adjust colors for accessibility, highlighting the need for human oversight.
- Use simple prompts — The activity begins by using a straightforward, descriptive sentence to generate a complex visual in Napkin AI.