Build with AI
How to use ChatGPT for UI design with references
Use ChatGPT to turn saved references into a UI brief, compare design decisions and review a screen without losing the original user task.
Give ChatGPT a design task it can inspect
ChatGPT can help develop a UI brief and discuss a design when you provide the screen, the user’s task and relevant references. Taste supplies saved inspiration and design preferences through its connection. Start by asking ChatGPT to retrieve a known collection so you can confirm it has the right material.
The available tools depend on the ChatGPT environment and connection. Do not assume that discussing a screen means ChatGPT edited a Figma file or changed your app. Ask which artifact it can produce in the current session.
Choose the tool for the missing input
For personal references and notes, use Taste. If your source of truth is a Figma file, use the available Figma connection and confirm its permissions. For research across product screens, evaluate Mobbin’s MCP offering. Check that the integration is supported in your client and plan; being an MCP server does not by itself establish availability in every chat.
A useful design conversation can combine sources, but you should name their roles. The existing product defines components and constraints. References suggest solutions. Your task determines which suggestions are relevant.
Turn a collection into a brief
Ask for a brief you can inspect before requesting an implementation. It should identify the audience, the main task, the order of information and the states the interface needs.
Use my Taste collection named Project direction. Inspect the references and notes, and tell me which items you accessed. I am designing a booking screen for a repair shop. The user needs to choose a service, see available times and confirm a booking. Write a brief covering information order, form fields, primary action, empty availability and validation errors. Explain the role of each reference. Flag conflicting directions instead of averaging them.
Carry the decisions into implementation
Once the brief is useful, open it alongside your project in the coding tool you use. Keep the selected collection available there too. Ask for the implementation to preserve the decisions in the brief, and review the actual running screen.
If you return to ChatGPT for critique, provide a current screenshot and explain the behavior that is not visible in it. A screenshot can show spacing; it cannot prove the booking request succeeds or keyboard focus moves correctly.
