Цели
Мы постепенно внедряли небольшие изменения в предварительной подготовке, такие как перемещение переключителя предпросмотра, интеграция предложений ИИ, добавление GIF-анимаций на панель инструментов, и теперь готовы попробовать более крупное изменение, которое доступно для тестирования как экспериментальная грядущая функция.
Наши основные цели:
-
Обновить редактор в соответствии с нашими общими изменениями, направленными на модернизацию внешнего вида и ощущения от интерфейса.
-
Улучшить опыт создания сообщений на мобильных устройствах.
Мы будем рады вашей помощи в тестировании этой функции, прежде чем она перейдет на следующую стадию внедрения.
Как попробовать
- Перейдите в раздел Администратор → Грядущие изменения по адресу
/admin/config/upcoming-changes. - Найдите пункт Редизайн редактора и включите его.
- Откройте редактор (ответ, новая тема или новое личное сообщение) и протестируйте его как на компьютере, так и на мобильном устройстве.
Вы можете отключить эту функцию в любое время в том же месте. Здесь, на Meta, вы можете присоединиться к новой группе тестировщиков composer-testers.
Нам особенно нужна обратная связь от тех, кто использует компоненты тем или плагины, кастомизирующие редактор — этот редизайн немного меняет структуру редактора, а не только его стилизацию. Подробнее об этом ниже.
Что изменилось
Макет и структура
Общее
- Заголовок теперь встроен в контент, что делает его похожим на заголовок документа (пользователи Notion найдут это знакомым).
- Панель инструментов перемещена в нижнюю часть. Это потребует небольшой адаптации мышечной памяти (меня это тоже раздражало в первые несколько дней
). - Переработаны поля ввода категории и тегов (включая иконку тега и минимальное отображение выбранного).
- Меньше границ, более просторное ощущение.
Markdown
- Заголовок, категория и теги теперь находятся в полноширинной области метаданных над редактором и панелью предпросмотра, а не ограничены левой колонкой.
Мобильные устройства
Одним из главных факторов этого проекта является попытка улучшить пользовательский опыт на мобильных устройствах. На протяжении многих лет на Meta было много обоснованных жалоб на эту тему [1] [2] [3].
Чтобы увеличить доступное пространство при создании сообщения, мы экспериментируем с расширяющимся редактором, который при фокусе сдвигается вверх, перекрывая поля редактора, и остается развернутым, пока редактор находится в фокусе. Это применимо при создании новой темы или нового личного сообщения, но не при ответе.
Это более чем удваивает доступное пространство для письма, увеличивая его с 103 пикселей до 212 пикселей (при тестировании на моем устройстве — фактические результаты могут отличаться).
Другое
- Переключатель панели инструментов удален в новом макете.
- Проведите вниз, чтобы скрыть клавиатуру и свернуть редактор обратно в обычное состояние.
- Выбранные теги видны только при открытии меню. Иконка окрашивается, чтобы указать, что выбор сделан.
Обратная связь
Это все еще сильно экспериментальная функция, и меня в основном интересует, как она работает на стандартных размерах экранов (десктоп и мобильные) в теме Foundation. Планшеты, складные телефоны, другие темы и т.д. пока не оптимизированы.
Призыв к авторам тем и плагинов 
Если вы подключаетесь к выходам плагинов редактора или стилизуете редактор, пожалуйста, протестируйте с включенным редизайном. DOM-структура изменилась, и некоторые кастомизации могут потребовать корректировки:
- Блок полей редактора теперь рендерится как полноширинный дочерний элемент контейнера редактора, а не внутри текстовой колонки редактора.
- Контент, внедряемый в выход
composer-fields, теперь появляется над заголовком (между группой категории/тегов и заголовком), на всю ширину. - Поле заголовка рендерится как отдельная строка, отделенная от кластера категории/тегов и расположенная под ними, а не над ними.
Ни один из выходов не был переименован или удален (хотя в будущем это может произойти для семантической адаптации к изменениям) — ваши коннекторы все еще будут прикрепляться. Изменилось где и насколько широко рендерится ваш контент.
Если вы заметите, что что-то сломалось в вашей теме или плагине, пожалуйста, ответьте здесь, указав компонент/плагин и приложив скриншот. Именно для этого и предназначена эта фаза тестирования.
Дизайн 
Вот некоторые конкретные компромиссы или дизайнерские решения, по которым я сам сомневаюсь, и которые могли бы использовать ваше мнение. Конечно, приветствуется и любая другая обратная связь.
A) Почему поле ввода заголовка такое чертовски большое?
Идея в том, что оно увеличено до большего размера, чем вручную добавленный H1, чтобы гарантировать, что оно всегда визуально выглядит как заголовок документа. Иногда я смотрю на него и думаю «фу», а иногда — «ну да, это работает».
Другая идея — немного уменьшить существующие заголовки, чтобы достичь того же эффекта.
B) Являются ли скрытые теги проблемой…
…достаточно большой, чтобы не стоить компромисса на мобильных устройствах (больше места для категории)?
Если да, то почему?
C) Как работает анимация расширяющегося редактора на вашем устройстве?
Она дерганая? Достаточно хорошая? Улучшение? Альтернативные идеи или настройки, чтобы сделать ее лучше?
D) Что насчет кнопки AI-предложения заголовка?
Мне самому не очень нравится, как она одиноко парит там. Как это ощущается для других (кто ею пользуется)? Очень открыт к дизайнерским идеям.
Спасибо, что помогаете нам сделать это правильно, прежде чем функция будет выпущена более широко. 
Кажется, это гораздо более современный и элегантный способ создания постов. Я тоже пробовал переносить панель инструментов вниз, и, думаю, так гораздо удобнее.
