Повествование ведется от лица Адама Зелиньского.
Я давно хотел обновить пользовательский интерфейс WordPress Playground, но не мог добиться полезных результатов от LLM.
До сегодняшнего дня. Я поделился своими трудностями в Slack, и Крис Хубер вдохновил меня запросить не 100 итераций одного дизайна, а 100 разных дизайнов.
Что я и сделал.
В итоге я получил 100 дизайнов. На это у Codex ушло, наверное, минут 30. Потом я попросил Claude сделать ещё 100, и он сделал около 80; в итоге у меня закончились токены по тарифу Max x20! Я выбрал те, которые мне понравились, и попросил Codex сделать их варианты, и получил ещё 50, потом ещё 50, потом ещё 50, потом ещё 40, и ещё 40.
Ни один из вариантов пока не готов, но я изучил массу возможных направлений; мне очень понравилась сворачиваемая левая панель как альтернатива текущей модели взаимодействия. Поэтому я попросил Codex доработать её. В результате появилось ещё 10 вариантов, которые мне не очень понравились, поэтому теперь я жду обновления своих токенов Claude. Кроме того, в фоновом режиме моя команда агентов работает над тем, чтобы заставить Codex создавать более качественные дизайны.
До сегодняшнего дня я пытался использовать модель, чтобы воссоздать знакомый мне процесс проектирования. Это, похоже, не сработало. Сейчас я открываю для себя новый тип процесса, где более 99% работы отбраковывается. В случае с людьми мы бы не смогли так сделать, но с LLM это возможно.
Я до сих пор не знаю, получится ли у меня в итоге какой-нибудь действительно пригодный для использования дизайн. Все в процессе. Тем не менее, я очень рад, что смог просмотреть более 400 вариантов дизайна, отбросить те, которые не очень, и порадоваться тем, которые, кажется, работают!
Мой промпт
Сегодня я несколько раз использовал вариацию следующего промпта. Меня вдохновили работы Дэна Луу и Денниса Снелла:
/goal use Chrome or something to that effect to get a series of screenshots of playground. wordpress.net, see the user flows involved in creating and managing and saving playgrounds go go deep into different models, map it out, and then create a new Tmux session where you will supervise 10 agents at a time
We want to create a 100 sessions in total. Each session will explore a different redesign redesign of the WordPress Playground UI. It must consider user flows. It must prioritize usability, making it easy to discover features to use them. It must preserve the end goals that the current UI enables the user to do, but it can expose them in a different way. It can remix parts of the UI, merge some of the screens, remove others, anything’s allowed as long as we don’t lose features and don’t add features that are not in there right now. Every session should create an HTML file or like a set of HTML files. CSS JavaScript is also fine. create a brand new repository on GitHub under adamziel. and you will be pushing all those designs there I also want to have a GitHub page where they will all be linked and I’ll be able to easily browse them.
You should also have an 11th session that is a critic that will provide feedback for all these design sessions, and it should have a very high quality bar. If any any cloud session dies, restart it, like if it dies prematurely. If it finishes the task then great, just stop it, make sure the work is pushed to the remote repository, clean up any local changes it might have done, and start a new session in its place, until our remote repository with HTML designs have a 100% total new high fidelity wireframes in it.
Перевод:
/goal используй Chrome или что-то подобное, чтобы получить серию скриншотов playground. wordpress.net. Рассмотри пользовательские сценарии, связанные с созданием, управлением и сохранением Playground. Углубись в различные модели, составь карту, а затем создай новую сессию Tmux, в которой ты будешь управлять 10 агентами одновременно.
Мы хотим создать в общей сложности 100 сессий. Каждая сессия будет посвящена различным вариантам редизайна пользовательского интерфейса WordPress Playground. Необходимо учитывать сценарии использования, уделять приоритетное внимание юзабилити, облегчая поиск нужных функций. Необходимо сохранить конечные цели, которые текущий интерфейс позволяет достичь пользователю, но представить их по-другому. Можно переделывать части интерфейса, объединять некоторые экраны, удалять другие — всё допустимо, если при этом не теряются функции и не добавляются те, которых сейчас нет. Каждая сессия должна создавать HTML-файл или набор HTML-файлов. CSS и JavaScript также подойдут. Создай новый репозиторий на GitHub под именем adamziel и выкладывай туда все эти дизайны. Также мне нужна страница на GitHub со ссылками на все дизайны, чтобы я смог легко их просматривать.
Также сделай 11-ю сессию, которая будет служить критикой и предоставлять обратную связь по всем этим сессиям дизайна, и она должна иметь очень высокий уровень качества. Если какая-либо облачная сессия завершится с ошибкой, перезапусти её, как если бы она завершилась преждевременно. Если она завершит задачу, то отлично, просто останови её, убедись, что работа отправлена в репозиторий, удали все локальные изменения, которые она могла внести, и запусти новую сессию на её месте, пока в нашем удалённом репозитории с HTML-дизайнами не появится 100% новых высококачественных макетов.
Стратегии дизайна с LLM, которые я пробовал раньше и которые мне не подошли
Или, говоря другими словами, все мои предыдущие стратегии:
- Обращение к Codex/Claude Code с просьбой проанализировать пользовательский интерфейс Playground, найти более удобный пользовательский путь и создать HTML-дизайн, пригодный для использования в продакшне. Результатом всегда становились разнородные уродливые конструкции.
- То же самое, но с навыками фронтенд-дизайна. Теперь эти ужасы были внутренне согласованы. Хотя всё ещё непригодны для использования.
- Дизайн Claude. Началось всё многообещающе, но я продвинулся только где-то на 60%, и ничего из того, что я делал, не улучшало ситуацию. Каждая итерация занимала значительное время, поэтому я сдался.
- Figma AI и Figma MCP. С помощью этой программы я приблизился к завершению примерно на 70%, и процесс разработки был быстрее, чем в Claude Design. Но я все равно не смог приблизиться к готовности.
- Я запускал промпт в Chrome MCP, предоставлял скриншоты понравившихся мне дизайнов, очень терпеливо объяснял, чего хочу, и помогал ему вносить изменения.
- Больше итераций, в любом виде: циклы Ральфа, состязательные циклы, когда я повторял это 100 раз, анализировал, улучшал и т. д.
Источник: https://adamadam.blog
