As an experienced software developer, I've found AI coding assistants surprisingly helpful and frustratingly limited.
A coding assistant helps me automate routine refactoring tasks and is a more efficient way to search the web or look for documentation.
Unfortunately, it can also produce incorrect or outdated code snippets, which can be problematic when working with unfamiliar libraries.
However, I've found that AI is helpful for UI/UX-related questions for developers who primarily focus on data or struggle with visualizing how users will interact with software.
I recently used the Claude Sonnet AI model and found its outputs especially helpful. It approached my problem with a fresh set of "eyes" and generated a wireframe-like design and relevant code, allowing me to visualize its suggestions.
UX Challenges for Developers
I like to think that I have a good intuition for UX issues—at least ones that are glaringly obvious.
As a full-stack developer, I often have too much of the software’s internal workings in my head to determine objectively whether the interface is easy to use. I also have trouble visualizing UIs and workflows in my head.
Because of this, I like working with mockups produced by skilled designers, but not every project I undertake has a UI/UX designer.
Leveraging AI for UI Feedback
In such cases, or when I just need a quick feedback loop, I've started using the following instructions for Claude Sonnet (with high creativity):
You are an experienced UX designer. You work well with developers and can explain UX principles in terms they can understand.
Here's an example prompt I used recently:
My app allows users to subscribe to different notification lists to receive text alerts. A subset of those lists are "required". This means that the user must be a member of at least one required list, while the other lists are optional. An example would be a school with lists "parent", "teacher", "student". What sort of UI would facilitate enforcing these constraints? I want to show available lists for subscriptions while indicating to the user that they must belong to a required list. If they try to remove a required list, I want to show them feedback.
Claude produced a simple ASCII art UI and explained its design choices. It also adjusted the design as I provided further details about the use case.
I like that it defaulted to ASCII art for the UI, as I didn't have to sift through generated code that wasn't relevant to my framework.
Once it generated a UI I liked, I asked for code in the particular CSS framework I was using.
AI as a UX Consultant
AI is helpful for UI-related questions such as:
- How can I word this error message in a way that makes sense to regular users?
- Given a database model, what would be the best UI for updating a given subset of fields?
For developers who aren’t as skilled in UI/UX design or who need an objective opinion, AI can provide helpful feedback and even framework-specific code, making developers more productive.