{"id":90,"date":"2026-03-18T18:22:48","date_gmt":"2026-03-18T18:22:48","guid":{"rendered":"https:\/\/medlearn.imperial.ac.uk\/innovation\/?page_id=90"},"modified":"2026-04-09T13:55:57","modified_gmt":"2026-04-09T13:55:57","slug":"ai-alt-text-generator","status":"publish","type":"page","link":"https:\/\/medlearn.imperial.ac.uk\/innovation\/projects\/ai-alt-text-generator\/","title":{"rendered":"AI Alt Text Generator"},"content":{"rendered":"\n\n
\n \n \n \n \n \n <\/linearGradient>\n \n \n \n <\/linearGradient>\n <\/defs>\n \n \n \n \n \n \n \n \n \n \n \n <\/g>\n \n \n \n \n \n \n \n \n \n \n Drag & drop image<\/text>\n or click to upload<\/text>\n \n \n \n \n \n \n \n AI<\/text>\n Claude AI<\/text>\n \n \n \n \n \n ALT TEXT OUTPUT<\/text>\n \n \n \n \n \n \n \n Accessible<\/text>\n \n Context-aware<\/text>\n \n \n Copy ✓<\/text>\n \n AI ALT TEXT GENERATOR — ACCESSIBILITY TOOL<\/text>\n<\/svg>\n<\/div>\n\n
\n\n \n
\n ← All Projects<\/a>\n AI<\/span>\n Accessibility<\/span>\n EdTech<\/span>\n Proof of Concept<\/span>\n <\/div>\n\n

AI Alt Text Generator<\/h1>\n

Automated accessibility descriptions for LMS images \u2014 built for learning technologists.<\/p>\n\n \n

Creating accessible digital learning environments requires every image uploaded to a VLE or LMS to carry descriptive alt text \u2014 a task that is time-consuming when done manually at scale. This proof-of-concept tool allows learning technologists to upload an image, provide optional course context, and receive a high-quality AI-generated description within seconds, ready to copy directly into Moodle, Blackboard, or any content authoring workflow.<\/p>\n

The tool was developed initially for Global Public Health<\/strong> courses at Imperial London, where complex data visualisations, infographics, and clinical diagrams are routinely used in online learning materials. By providing Claude AI with both the image and a course context field, the generated descriptions are not just generic — they reflect the academic register and content type of the material.<\/p>\n\n \n

Project at a Glance<\/h2>\n \n \n \n \n \n \n \n
Status<\/td>\n Proof of Concept — active development<\/td>\n <\/tr>\n
Primary Use Case<\/td>\n Learning technologists uploading images to LMS \/ VLE platforms requiring WCAG-compliant alt text<\/td>\n <\/tr>\n
Initial Context<\/td>\n Global Public Health courses, Imperial London<\/td>\n <\/tr>\n
Technology<\/td>\n Vite · React · TypeScript · Express.js · Claude AI (Anthropic) · Supabase · Vercel<\/td>\n <\/tr>\n
GitHub<\/td>\n adrianImperial\/ALT-text-web-tool<\/a><\/td>\n <\/tr>\n
Year<\/td>\n 2024–25<\/td>\n <\/tr>\n <\/table>\n\n \n

How It Works<\/h2>\n

The workflow is deliberately simple. A learning technologist visits the tool, drags and drops an image (or selects it from their file system), and optionally adds a short note about the course topic or image context. Claude AI analyses the image and returns a structured alt text description optimised for screen reader compatibility and WCAG 2.1 AA compliance.<\/p>\n

The description can be copied with a single click for pasting into any LMS content editor. All generation requests and their outputs are stored in a Supabase database, giving teams a searchable log of previously generated descriptions — useful for audit purposes and to avoid duplicating effort when the same image appears across multiple course units.<\/p>\n

The Express.js backend handles image processing and API calls to Anthropic, keeping API keys server-side and ensuring the tool can be extended with authentication and usage quotas as needed for a production deployment.<\/p>\n\n \n

Context & Motivation<\/h2>\n

Accessibility in digital education is both a legal requirement and a quality standard. UK higher education institutions are required under the Public Sector Bodies Accessibility Regulations 2018<\/strong> to ensure online learning materials are accessible, which includes providing meaningful alt text for all non-decorative images. Despite this, manual alt text creation remains one of the most commonly skipped steps in LMS content workflows \u2014 primarily because it is slow and requires careful attention to each image’s pedagogic purpose.<\/p>\n

This tool tests whether AI can meaningfully reduce that friction. By combining Claude’s multimodal vision capabilities with a context prompt, the generated text goes beyond generic descriptions to reflect what the image is for<\/em> in its academic context — for example distinguishing between a graph used to illustrate epidemiological trends versus one used to compare intervention outcomes, and writing alt text accordingly.<\/p>\n\n \n

\n

“A fast, low-friction way to get proper alt text on every image — this is exactly the kind of tool learning technologists need to make accessibility genuinely manageable at scale.”<\/p>\n <\/blockquote>\n\n \n

Potential Next Steps<\/h2>\n

The current PoC demonstrates the core generation workflow. Possible directions for development include direct LMS integration (Moodle plugin or Blackboard Building Block), bulk image processing for retroactive accessibility remediation, a quality-scoring layer to flag descriptions that may need human review, and a faculty-facing version allowing academics to add context notes at point of upload during course build.<\/p>\n

There is also potential to broaden the scope beyond Global Public Health to any department with high-volume image-rich course materials \u2014 medical imaging, histology slides, anatomy diagrams, data visualisations, and maps.<\/p>\n\n<\/div>\n","protected":false},"excerpt":{"rendered":"

Drag & drop image or click to upload AI Claude AI ALT TEXT OUTPUT Accessible Context-aware Copy ✓ AI ALT TEXT GENERATOR — ACCESSIBILITY TOOL ← All Projects AI Accessibility […]<\/p>\n","protected":false},"author":16,"featured_media":0,"parent":7,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-90","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/medlearn.imperial.ac.uk\/innovation\/wp-json\/wp\/v2\/pages\/90","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/medlearn.imperial.ac.uk\/innovation\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/medlearn.imperial.ac.uk\/innovation\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/medlearn.imperial.ac.uk\/innovation\/wp-json\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/medlearn.imperial.ac.uk\/innovation\/wp-json\/wp\/v2\/comments?post=90"}],"version-history":[{"count":4,"href":"https:\/\/medlearn.imperial.ac.uk\/innovation\/wp-json\/wp\/v2\/pages\/90\/revisions"}],"predecessor-version":[{"id":261,"href":"https:\/\/medlearn.imperial.ac.uk\/innovation\/wp-json\/wp\/v2\/pages\/90\/revisions\/261"}],"up":[{"embeddable":true,"href":"https:\/\/medlearn.imperial.ac.uk\/innovation\/wp-json\/wp\/v2\/pages\/7"}],"wp:attachment":[{"href":"https:\/\/medlearn.imperial.ac.uk\/innovation\/wp-json\/wp\/v2\/media?parent=90"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}