Not everything needs to be AI-powered, even within an AI-first tool. I recently learned this while writing a Claude skill paired with the Claude in Chrome extension, and I got a lot more clarity on how to get the most out of these tools. Here’s what I learned.
Writing My First Claude Skill
I was tasked with fixing mobile layout issues on several screens in a web application. This application ran with a CMS in the background and various RBAC (role-based access control) features. To see the issues, I needed to be logged in with a real, running version of the site, not just look at the code.
I had been reading Claude’s docs about skills, and I thought, alright here’s my chance to build a reusable tool! So, I decided to pair my Claude skill with the new Claude in Chrome extension. I wanted Claude to open the problematic screen, analyze it at mobile width, propose 2 solutions to the layout, spin up 2 subagents to code the fixes, then let me review those fixes.
Educate Claude About Its Own Tools
I began writing this skill by asking Claude to do what I wanted in plaintext. I asked it to open up my browser to the website I gave it. Here’s how this step looked at first:
**Open the problematic page**: Use the URL I give you to open the page at 320 width
However, each time Claude saw this step, it had to think a while before it knew how to open my browser. Even though Claude in Chrome was installed, Claude didn’t stumble upon that tool after trying a few other ways to open a browser window. Eventually, I modified the command to use the exact commands Claude in Chrome used. Things are starting to look a lot more like code now!
1. **Open the page at mobile width:** Call `mcp__Claude_in_Chrome__tabs_context_mcp` with `createIfEmpty: true` to ensure a tab group exists, then call `mcp__Claude_in_Chrome__tabs_create_mcp` to open a new tab. Navigate to `$ARGUMENTS[0]`.
Divide Tasks into Deterministic vs Variable Outcomes
I wanted to startup the worktree code that each subagent had written, and open it up in Chrome tabs. At first I was trying to do this with Claude in Chrome. After a few passes at that, I found it was much easier to have a bash script that opened Chrome with a simple command, no AI needed. My Claude skill called a script called start-variants.
At the end of the start-variants script, here’s how I opened Chrome:
open -a "Google Chrome" \
"http://localhost:3001${URL_PATH}" "http://localhost:3002${URL_PATH}"This started up way faster than the Claude in Chrome command! It did exactly what I needed.
Refine Your Skill, Looking For Inefficiencies
While building this skill, I ran it several times on the same website. Here are some red flags I looked for that showed inefficiencies:
- It thought for too long on something that should be straightforward.
- It tried the wrong approach first, like when it got confused about how to open a website, because it took a while to find the Claude in Chrome tool.
- It began trying to create “workarounds.” Often it wanted to render the site using the source code rather than looking at the real website.
- It tried a command that did not exist. It tried various commands and tools to resize the window. Eventually I learned Claude in Chrome did not have that ability, so I asked it to pause and have me manually shrink the window to mobile size.
Let Claude Do What it Does Best
Claude was a great orchestrator, launching each step and verifying what happened. It was also really fun to see it go once it was running smoothly! Claude would open the URL I gave it, take screenshots, analyze its mobile layout, come up with multiple ideas for how to fix it, and launch subagents to code those fixes in parallel. Rather than just explaining how it would fix the problem, I got to see multiple mobile layout prototypes within my own code.
Sigh… Remember AI tools are a moving target (especially beta tools)
I wrote this skill a month ago, planning to use it in a workshop. It was working smoothly and consistently. While I could refine it further, it was working well enough for the workshop. Then, while preparing for the workshop, and found that my month-old skill was broken. Claude in Chrome is a beta feature, which means breaking changes may occur. My Claude environment no longer knew how to run the Chrome plugin. I had to take extra steps to log back into the extension in my agent window, and the browser.
Even once I’d done that, I still had problems. The extension was no longer able to take screenshots. So now Claude was trying to use further tools for screenshots, including the screencapture Mac utility, which captures the entire screen. It worked terribly! And also, Claude forgot how to scroll the window up and down, even though it’s a Claude in Chrome ability. I still haven’t gotten my skill back to working condition as I write this.
Conclusion
The key lessons I’d take away are these: tell Claude exactly which tools to use rather than letting it guess, offload deterministic tasks to plain scripts, and watch your runs carefully for signs that Claude is spinning its wheels. And treat your skills like living code, because they’ll need maintenance as the underlying tools evolve. Good luck out there!