OpenPencil
Lets you describe a web page or app screen and watch an AI draw the design on a canvas
by ZSeven-W
Better Interface
by Jakub KrehelSkillMake visuals
Looks over the screens of an app you are building and returns one ranked list of fixes
The problem it solves
You built an app with an AI agent and it works, but the screens look slightly off and you can't say why.
For People building apps with AIDesigners who codeFront-end developers
- Before
- You ask for feedback, get a long list of opinions and can't tell which change matters most.
- After
- You get one ranked report of at most 15 findings across six areas, each with a location in your project and a suggested fix.
- Stars
- ★ 9.4k
- License
- MIT
- Cost
- Free
- Level
- Intermediate
- Contents
- Instructions only
Overview
Better Interface is a skill that checks a screen, flow or whole interface in your project for problems with accessibility, layout, wording, typography, color and visual polish. It hands each area to a sibling skill from the same collection, then merges the results into one report of at most 15 findings, ranked by how much they affect people using the app, each with its location and a suggested fix. By default it only reports and changes no files. It suits people building web apps or sites with an AI agent.
Instead of loose design opinions, you get a short ranked list where each item points to a place in your project and names a concrete fix.
Try these first
Start with the first one: it is a small task you can check easily.
- Review the sign-up screen of this project. Don't change any files.First try · read-only
- Review the whole checkout flow, including its empty, loading and error states.
- Which of the six areas could you not check, and why?
- Fix the three highest-ranked findings from the last review.edits files
Example prompts written by Agent Flows Hub.
What you get
From the creator's documentation.
| Output | What it is | Reads |
|---|---|---|
| Accessibility | Keyboard use, focus, labels, forms and screen-reader behavior | Your project |
| Layout | Grouping, alignment and how a screen holds up when resized or translated | Your project |
| Wording | Labels, errors, empty states and confirmations in the interface | Your project |
| Type and color | Type scale, line length, palettes and measured contrast | Your project |
| Ranked report | At most 15 findings, ranked by impact on users, each with a location and a fix | Your project |
| Fixes on request | Edits files only when you ask it to apply the findings | Your project |
Good to know
Ask your agent to review one screen or flow of an app you are building. It checks six areas and returns one ranked report of findings, each tied to a location in your project with a suggested fix.
Limits
- It loads the six better-* skills from the same collection, one per area, and reports any area whose skill is not installed as not checked. Installing the whole collection with the official command covers this.
- It works on a project's files and rendered pages. Reviews of a branch, pull request or uncommitted change belong to the separate interface-review skill, which you start yourself.
Notes by Agent Flows Hub (original project name: better-interface), written from the creator's documentation, not from running it ourselves. better-interface: skill instructions · Interface skills collection: install
Stuck setting it up?
Tell us what happened. We take a look first; if it needs paid work, you get an estimate before anything starts.
More to make visuals
Other skills
- Cash Flow Forecast Turns your income and expense records into a 30, 60 and 90-day cash forecast
- Caveman Makes your AI agent put the answer first and drop filler, with code and facts kept exact
- Charlie AI CFO CFO-style thinking on cash, runway and hiring for self-funded founders
- Company Research Report Writes a full value-investing report on one listed company from four investors' views
- Competitor Ad Teardown Breaks down a competitor's public ads into hooks, offers, calls to action and test ideas
- Competitor Analysis Maps your main competitors and shows where you can stand out