ai newsFr., 16. Okt.
EilmeldungWhat an Empty Prompt Costs: Measure the Baseline Tokens of 4 Coding Agent CLIs

I Built a Claude Skill That Turns a Boring Resume Into an Animated Web Page

I wanted to try something really fun for generating online profiles and websites; mostly, I wanted it to be customised for each person and have some personality. So I built a small Claude skill that takes a normal resume (or a LinkedIn PDF) and turns it into an animated, interactive one-page profil

dev.toFreitag 22:11 · 16.10.1 Min. Lesezeit
Bild: dev.to

I wanted to try something really fun for generating online profiles and websites; mostly, I wanted it to be customised for each person and have some personality.

So I built a small Claude skill that takes a normal resume (or a LinkedIn PDF) and turns it into an animated, interactive one-page profile.

In this post, I'll show you what it does, how it works under the hood, and how you can try it yourself in about two minutes.

The demo uses a fictional person, so no real data was harmed in the making of this GIF. 😄

And the output is just one HTML file. No framework, no build step. You can drop it on GitHub Pages, and you're done.

When you ask Claude to make an animated resume, the skill walks through four steps:

That's the whole trick. Claude does the reading and the interviewing, and a plain Python script does the building.

Here's roughly how the skill folder is laid out:

skills/animated-resume/ ├── SKILL.md # the instructions Claude follows ├── assets/template.html # the animated page ├── assets/example-profile.json # a full fictional example ├── references/schema.md # every profile.json field └── scripts/build.py # profile.json → index.html Enter fullscreen mode Exit fullscreen mode Try it yourself If you use Claude Code, installing it takes two commands:

/plugin marketplace add dooa-ansari/animated-resume-claude-skill /plugin install animated-resume@animated-resume Enter fullscreen mode Exit fullscreen mode Then just ask:

If you use the Claude app (claude.ai or desktop), download animated-resume-skill.zip from the repo and upload it under Settings → Capabilities → Skills.

Since the result is a single HTML file, hosting it is easy:

The code is open source under the MIT license, so feel free to use it, fork it, or borrow ideas for your own skill:

👉 github.com/dooa-ansari/animated-resume-claude-skill

Quelle: dev.to (dev.to). Original öffnen