В прошлом уроке мы закончили на том, что научились более продвинуто работать с внутренностями — связывать модули в агентскую систему, диспетчить суб-агентов, передавать данные между ними. Это всё про то, что происходит «под капотом».
Но не менее важно то, как это всё выглядит визуально.
Подумайте сами. Почему мы работаем не в терминале (а большая часть курса как раз про терминал и Claude Code в нём), а в красивом Claude Desktop с вкладками, кнопками и боковой панелью? Потому что здесь есть привычные нам штуки. Можно понажимать мышкой. Можно перетягивать файлы. Всё понятно с одного взгляда, не надо запоминать команды.
Любой человек, не айтишник, заходит в такой интерфейс — и сразу понимает что делать. Это и есть визуальный дизайн. Он не «украшение поверх программы». Он — тот самый язык, на котором программа общается с пользователем.
Поэтому, когда вы начинаете делать настоящие приложения (а мы уже движемся к этому), вы обязаны разобраться с визуальной частью. Хотя бы на уровне «знаю основные принципы и умею донести их до Claude». Сегодня про это.
Это пригодится для разного. Интерфейс для нашей агентской системы — той самой, которую мы спроектировали в прошлом уроке. Чтобы запускать её не командами в Claude Code, а парой кнопок и формой. Дизайн сайта — если у вас есть проект и нужен лендинг. Интернет-магазин или веб-приложение — если задача серьёзнее.
Про то, как делать полноценные веб-приложения и выкладывать их в интернет, чтобы ими могли пользоваться другие люди — поговорим в следующих уроках. Мы планомерно к этому идём. Если кто-то ждёт когда же начнётся разговор про «полноценные приложения, которыми можно делиться» — он уже прямо вот-вот, не за горами. Сегодня мы подходим к этому через визуальную часть.
Поехали.
Сразу обозначу самое важное, на чём держится весь дальнейший урок. Дизайн начинается не с того как выглядит, а с того что делает.
Звучит банально, но именно тут спотыкается большинство людей, которые первый раз пытаются делать интерфейс через Claude. Открывают чат, пишут «сделай мне красивый сайт» — получают что-то общее. Потом «сделай красивее, добавь больше блоков» — получают ещё что-то. Через десять итераций сайт всё ещё непонятный и непрактичный.
Происходит так потому что Claude не знает, что именно ваша программа должна уметь. Он угадывает по слову «сайт» — рисует то, что обычно бывает на сайтах. Это никак не привязано к вашей реальной задаче.
Правильно…