pen.dev – https://pen.dev
Figma alternative – which connects to agents and MCP
Creating components
Thinking about the UI
Starting with the look of the finished product
AI makes people think less
Keeping control of the project
Speeds up progress
It has access to your codebase and can build factually
Checking accessibility
Building in vector – makes it easier to build the project
BYOK – Bring Your Own Key
Free and Paid options – 5 agent days for free per month
Really clever pricing model
Once the design is done the coding doesn’t need to ask as many questions
Cloud Claude – need to look into it – https://code.claude.com/docs/en/claude-code-on-the-web
Claude Mods is brand new – https://www.claudemod.com/
Create mods that run within Claude
Examples – Progress bar for Claude steps – see how far it is along
What’s Next – suggest 3 things you can do next
Cache Control – 1 hour server side cache
Create context handover, clearing the chat and adding handover
Video with some good Claude Mods: https://www.youtube.com/watch?v=W5JSvXig3Ig&t=333s
Visit the website: https://www.thisweekwith.co.uk
Drayson Design Website – https://www.draysondesign.com
The Creative Tinker Website – https://www.thecreativetinker.com
Facebook: https://www.thisweekwith.co.uk/facebook
Youtube: https://www.thisweekwith.co.uk/youtube
* Full transcript will be available on the website. We may receive a referral fee from any of our links which help towards the costs involved in creating this content for you.
