Использовать промпт
Добавьте своё задание
Добавьте контекст ниже. Он будет включён в промпт при копировании или скачивании.
Создайте редактируемую HTML-презентацию с холстом 16:9, кнопками перехода назад и вперёд, навигацией с помощью клавиш со стрелками, счётчиком слайдов и макетом печати, в котором каждый слайд размещается на отдельной странице, для [PROJECT] и [AUDIENCE]. Задача: презентация пути клиента.
Обязательные контент и структура
Отобразите этапы, цели пользователя, точки контакта, затруднения и возможности для улучшения.
Используйте [APPROVED_CONTENT] как источник названий, дат, числовых данных, утверждений и целевых страниц. Перечислите недостающие исходные данные, прежде чем что-либо заменять. Если нужна демонстрация, обозначьте её контент как вымышленный. Не придумывайте отзывы клиентов, рейтинги, логотипы партнёров или возможности продукта.
Направление дизайна
Используйте [BRAND_RULES] и уже выбранную для проекта дизайн-систему. Если система не предоставлена, начните с такого направления: белый, глубокий темно-синий и сдержанный синий; четкое выравнивание и простые диаграммы с доказательными данными. Соблюдайте единообразие типографики, интервалов и цветовых ролей. Ставьте задачу выше декоративных элементов и избегайте типового набора не связанных между собой карточек.
Подготовка контента
Выберите конкретный сценарий клиента и соберите данные об этапах, целях, точках контакта, наблюдаемых затруднениях и возможностях. Обозначайте предполагаемые эмоции как допущения, а не выдавайте их за результаты исследований.
Макет и поведение
Расположите этапы вдоль единого пути и свяжите каждую возможность с конкретным затруднением. Размещайте доказательства рядом с наблюдением, которое они подтверждают.
Проверка критериев приёмки для задачи
- Отделяйте наблюдаемые данные от предполагаемых эмоций.
- Пройдите весь путь с точки зрения клиента.
- Отделите то, о чём действительно сообщили пользователи, от интерпретации команды и не объединяйте несколько несовместимых путей в одну гладкую историю.
Реализация и проверка
Оставьте текст редактируемым. Используйте семантическую структуру, понятные элементы управления, видимый фокус клавиатуры и подходящие состояния отсутствия данных и ошибок. Проверьте узкие и широкие макеты. Учитывайте настройку уменьшения движения. Сохраните существующие фреймворк и зависимости проекта; не заменяйте стек без предупреждения. Верните редактируемые файлы и опишите любое неполное поведение или неподдерживаемые исходные данные. Проверьте именно эту задачу, прежде чем предлагать дополнительные функции.
Посвящайте каждый слайд одной основной мысли. Используйте диаграммы только при наличии фактических сопоставимых значений; указывайте единицы измерения, даты источников и ограничения. Храните заметки докладчика отдельно от видимого содержимого слайдов.
Референс и цель воссоздания
Прикрепите файл reference.webp из пакета загрузки этого дизайн-промпта к самому промпту в OpenDesign. Создайте редактируемый результат с похожими композицией и иерархией; не вставляйте всё референсное изображение в качестве готового интерфейса. Если утверждённый контент проекта и правила бренда противоречат вымышленным примерам подписей, сохраняйте утверждённые материалы. Если изображение отсутствует или нечитаемо, запросите его, а не заявляйте о визуальном соответствии.
Композиция и контент референса
Используйте прикреплённый файл reference.webp как визуальный референс для презентации пути клиента. Перед началом работы определите основные области сверху вниз, их относительную ширину и высоту, выравнивание, интервалы, типографическую иерархию, цвета поверхностей, границы, изображения и повторяющиеся компоненты. Сохраните эти взаимосвязи, не заменяя их универсальным шаблоном. Обязательное содержимое задачи: отобразите этапы, цели пользователя, точки контакта, затруднения и возможности для улучшения. При преобразовании изображения в редактируемые элементы следуйте этим указаниям по компоновке для данной задачи: расположите этапы вдоль единого пути и свяжите каждую возможность с конкретным затруднением. Размещайте доказательства рядом с наблюдением, которое они подтверждают.
Визуальное направление из примера проекта
белый, глубокий темно-синий и сдержанный синий; четкое выравнивание и простые диаграммы с доказательными данными.
Структура слайдов и поведение презентации
Воссоздайте композицию слайда в виде редактируемых элементов заголовка, основного текста, визуальных материалов и аннотаций. Изображённый слайд — это одно представление, а не доказательство наличия полной презентации. Используйте предоставленное повествование, чтобы создать все запрошенные дополнительные слайды; сохраните его типографику, поля, цветовые роли и выравнивание. Расположите этапы вдоль единого пути и свяжите каждую возможность с конкретным затруднением. Размещайте доказательства рядом с наблюдением, которое они подтверждают. Разместите элементы навигации за пределами экспортируемого содержимого слайдов. Отделяйте наблюдаемые данные от предполагаемых эмоций.
Визуальное сравнение и передача результата
- Сравните результат с прикреплённым изображением при совпадающих пропорциях. Перед проработкой декоративных деталей проверьте расположение основных областей, относительные размеры изображений, переносы строк, интервалы, типографическую иерархию, контраст, активные состояния и плотность контента.
- Затем протестируйте узкий макет, не сжимая текст для настольной версии до крошечных подписей.
- Храните логотипы, фотографии и значки как отдельные ресурсы, а все значимые подписи оставьте редактируемыми. Перечислите недоступные шрифты и ресурсы, а также намеренные отступления. Верните рабочие файлы вместе с кратким описанием реализованного поведения и оставшихся интеграций; не обещайте попиксельное совпадение только на основании промпта.
Адаптация референса к размерам слайдов
Прикреплённый визуальный референс — концептуальное изображение в формате 3:2, тогда как для запрошенной презентации используются слайды 16:9. Перекомпонуйте текст, изображения, диаграммы и интервалы в виде отдельных редактируемых элементов на холсте 16:9. Не растягивайте референс и не обрезайте всю композицию, чтобы подогнать её под нужный формат. Сохраните иерархию и читаемость предоставленного содержимого и адаптируйте каждый слайд к его собственному сообщению.
Скачать промпт и изображение
Содержит полный промпт и полноразмерное референсное изображение. Добавьте оба файла в OpenDesign, чтобы задать направление макета.
Как написать дизайн-промпт для презентации пути клиента
Используйте этот дизайн-промпт для презентации пути клиента, чтобы отобразить этапы, цели пользователя, точки контакта, затруднения и возможности для улучшения.
Референс — концепция, созданная ИИ. Приведённые ниже инструкции описывают, что нужно создать и протестировать; изображение не демонстрирует работающее поведение.
Отделите наблюдаемые затруднения от предполагаемых эмоций
Презентация карты пути клиента показывает развитие задачи во времени.
Названия этапов полезны, только если цели, точки взаимодействия и свидетельства объясняют, что на самом деле происходит на каждом этапе. Расположите этапы вдоль единого пути и свяжите каждую возможность с конкретной проблемой. Размещайте свидетельства рядом с наблюдением, которое они подтверждают.
Из промпта
Расположите этапы вдоль единого пути и свяжите каждую возможность с конкретной проблемой.
Настройте под себя
Отобразите [STAGES] с целями пользователя, точками взаимодействия и наблюдаемыми проблемами. Приложите [EVIDENCE] к выводам и явно обозначьте предполагаемые эмоции или непроверенные возможности.
Подготовьте содержимое презентации карты пути клиента
Этапы идут слева направо, а цели, точки взаимодействия и данные занимают отдельные строки. Подготовьте наблюдения для каждого этапа, вместо того чтобы делать вывод обо всём пути на основе диаграммы воронки.
Выберите конкретный сценарий клиента и соберите данные об этапах, целях, точках контакта, наблюдаемых затруднениях и возможностях. Обозначайте предполагаемые эмоции как допущения, а не выдавайте их за результаты исследований.
Из промпта
Отобразите этапы, цели пользователя, точки контакта, затруднения и возможности для улучшения.
Настройте под себя
Для [PROJECT] используйте [APPROVED_CONTENT] как источник для этой презентации карты пути клиента. Выберите конкретный клиентский сценарий и соберите этапы, цели, точки взаимодействия, наблюдаемые проблемы и возможности. Обозначайте предполагаемые эмоции, а не приписывайте их участникам исследования. Выявите недостающие исходные данные, прежде чем заменять их демонстрационным содержимым.
Проверьте заявленную проблему
Нижние строки явно отделяют предполагаемые эмоции от препятствий и возможных улучшений. Проверяйте предположения с помощью исследований и связывайте каждую возможность с конкретной наблюдаемой проблемой.
Свяжите формулировку проблемы с наблюдением. Если это лишь гипотеза, слайд должен предлагать способ её проверки, а не представлять её как установленное поведение. Пройдите весь путь с точки зрения клиента. Отделяйте фактические высказывания пользователей от интерпретации команды и не объединяйте несколько несовместимых путей в одну гладкую историю.
Из промпта
Отделяйте наблюдаемые данные от предполагаемых эмоций.
Настройте под себя
Проверьте презентацию карты пути клиента на соответствие этому требованию: отделяйте наблюдаемые свидетельства от предполагаемых эмоций. Пройдите весь путь с точки зрения клиента. Отделяйте фактические высказывания пользователей от интерпретации команды и не объединяйте несколько несовместимых путей в одну гладкую историю. Сохраните утверждённое содержимое и исправьте только те части, которые не проходят эту проверку.
Проверьте результат презентации карты пути клиента
Сгенерированное изображение не позволяет проверить презентацию целиком или приведённые в ней доказательства. Отдельно проверьте каждый слайд, навигацию с клавиатуры, макет печати и все экспортированные файлы.
- Пройдите весь путь с точки зрения клиента. Отделите то, о чём действительно сообщили пользователи, от интерпретации команды и не объединяйте несколько несовместимых путей в одну гладкую историю.
Уточняющий промпт
Используйте это после получения первого результата. Так доработка будет сосредоточена на самой важной части задачи.
Улучшите текущую презентацию пути клиента. Пройдите весь путь с точки зрения клиента. Отделите то, о чём действительно сообщили пользователи, от интерпретации команды и не объединяйте несколько несовместимых путей в одну гладкую историю. Сохраните утверждённое содержимое и визуальное направление; измените только то, что необходимо для устранения этих проблем.
