The reason Matt Pocock’s /grill-me skill works so well is because it helps you tell the AI what you want. The agent asks you lots of questions, it helps you articulate what you want.
One of the more important skills is learning how to properly describe your goals to an agent so that it knows exactly where to start looking for the solution. It increases the probability of getting the right result from your agent and shortens the time to get it.
Just like with skills, we need to be specific about what we want. If we were to ask the agent to just make it “nicer” or “smoother”, the agent would have to guess. Precision is what we want here. You are the expert here, so feed the agent with the right words and instructions.
the share menu feels janky, make it smoother
transform-origin: center; transition: all 400ms ease-in-out;In this case we describe exactly what we want, and the agent builds it for us. At this point, you might even feel like you would’ve been faster if you did it yourself. In this specific scenario, that might perhaps be true, but it’s usually not, even if the prompt is long.
The models are fast enough these days that I almost never open my code editor anymore. Even for small visual tweaks, I just ask the agent to do it for me, with a very specific prompt like above.
Here’s another example of how using the right words matters:
the numbers in the recording timer keep jumping around, fix it
font-family: ui-monospace, monospace;Technically, both prompts fix the issue we are pointing at, but we obviously don’t want to switch to a mono font here. With enough experience, you know that using tabular-nums is the right fix here.
Here’s another one for incorrect nested radii:
the corners on the photo card look off
border-radius: 20px; /* card and photo */If you say that the corners look off, the agent might get it right, but it also might not. You could give it the right formula to calculate the correct radius instead. Way more precise, leaves no room for error.
Just to reiterate, you want to be precise, just as with skills. Leave no room for interpretation for the agent, tell it exactly what you want.
The text in the header feels cramped, can you fix it?
Add 0.02em of tracking to the uppercase labels in the header, leave the body text as is.
None of this means you should memorize every word. What you need is the name of the concept. The concept narrows the options the agent can choose from, all you need to do is give it a hint.
And sometimes a screenshot or a link to an interface you like does more than any word. Use both. I personally use screenshots a lot when I want to point the agent to something I want built or fixed.
This happens all the time, even to people who have been designing for years. There are two ways to deal with it.
The first is to ask. /emil-design-vocabulary or /emil-engineering-vocabulary work like a reverse dictionary. You describe the thing as best as you can and get the term back:
/emil-design-vocabulary what's it called when a popover grows out of the button that opened it?
/emil-engineering-vocabulary what's it called when the UI updates before the server confirms?
The second is to actually learn the words. You might’ve noticed the dotted underlines in this course. Upon hovering over a term, you’ll see the definition and a demo if you click on it. This helps you learn these words as you go through the course.
The timer needs tabular-nums, the labels need more tracking.
All of those words live on the vocabulary page. It consists of 244 design and animation terms across 22 categories, each one of them comes with an interactive demo (or two) so you can not only read the definition, but also actually see what it looks like.
You don’t have to read it top to bottom. As you go through the course and start working on your own stuff, look up the words you think you’ll need. This way it’ll stick with you better.
LLMs get better and better. There’s this vision where the right words won’t make a difference at all. This could happen. At that point, just a vague description will be enough to get the right results, since the models will be incredibly good at understanding your intent.
Let’s assume this is the case. You still learned a lot of useful concepts that will help you think clearer, and communicate better. It’s a win regardless of how this technology evolves.