Продолжаем создавать «Заметки» для платформы, но параллельно развиваем и другие инструменты - в частности, добавили новые функции в редактор «Статей». Подробно расскажем о них в этом материале.

Когда пишешь статью, хочется думать о её смысле: с чего начать, какой пример привести, где стоит поспорить с привычным объяснением. Но иногда внимание забирает более прозаический вопрос: где здесь нужная кнопка? Мы обновили редактор «Думайте», чтобы такие поиски занимали меньше места в авторской работе. Заодно добавили возможности оформления текста, которых прежде не было:

• чек-листы,

• два вида разделителей

• и отдельный блок для программного кода.

Покажем изменения на компьютере и телефоне — с примерами того, как теперь можно оформить публикацию. Это пригодится и постоянным авторам, и тем, кто пока только собирается написать первую статью.

Кнопки распределили по смыслу

Раньше панель форматирования напоминала ряд знакомых значков: жирный текст, курсив, цитата, списки и другие команды стояли рядом. Со временем возможностей стало больше, а свободного места на экране — столько же. Особенно хорошо это чувствовалось на телефоне.

Теперь близкие действия собраны в небольшие выпадающие меню. Под кнопкой «Текст» находятся жирное начертание, курсив и зачёркивание. У цитат можно сразу выбрать

классический

или акцентный вариант.

В «Списках» рядом с нумерованным и маркированным появился чек-лист. Заголовки H2 и H3 и добавление ссылки остаются под рукой.

На компьютере: прежняя панель и новая группировка инструментов. В раскрытом меню сразу видно название каждого действия.

Редактор по-прежнему учитывает, что вы делаете. При выделении текста предлагает его оформление. На новом абзаце открывает набор для добавления содержимого: фото, видео, цитаты, списков и других блоков. Если нужный формат уже есть в выделенном фрагменте, подсвечивается и кнопка соответствующей группы. Так проще понять, что именно применено к тексту.

Важная мелочь: варианты цитаты больше не приходится перебирать повторными нажатиями на одну кнопку. Два оформления видны в меню — можно сразу выбрать подходящее.

На телефоне — тот же порядок, в светлом оформлении

У мобильного редактора свой характер: светлые кнопки, крупные области нажатия и панель в шапке. Мы сохранили этот подход, но привели наборы действий к той же логике, что и на компьютере. Если вы начали статью за рабочим столом, а продолжили со смартфона, заново разбираться в расположении инструментов не потребуется.

На телефоне: команды собраны в группы, активная кнопка выделена зелёным. Выпадающее окно подстраивается под содержимое и помещается в экран.

Текст пунктов сделали темнее, чтобы его было легче читать. Меню занимают столько ширины, сколько нужно их содержимому. Они не должны вынуждать вас прокручивать всю страницу вбок ради последнего пункта.

Списки, которые помогают действовать

Для последовательности шагов удобен нумерованный список. Теперь его номера выделяются белыми цифрами в зелёных квадратах.

1. Пункт номер один

2. Пункт номер два

Для перечисления равнозначных мыслей остаётся маркированный список — его точки тоже стали фирменного зелёного цвета. Оформление видно и в редакторе, и в самой статье.

• А это маркированный пункт один

• Соответственно, это второй пункт маркированного списка

А если вы составляете план, инструкцию или перечень для самопроверки, попробуйте новый чек-лист.

• Чек лист: активный пункт

• Пункт неактивный

Слева от текста находится квадрат с зелёной обводкой. Нажатие в редакторе делает пункт активным. Если текст занимает несколько строк, квадрат остаётся рядом с первой, а не оттесняет весь пункт вниз.

Например, перед публикацией можно составить себе короткий чек-лист: проверить факты, добавить источники, перечитать начало, подобрать обложку.

Три разных задачи — три вида списка: порядок шагов, свободное перечисление и пункты с отметками.

Пауза между мыслями тоже может быть выразительной

Иногда одной пустой строки мало: закончилась одна часть рассуждения и начинается другая. Для таких переходов мы добавили два варианта в меню «Разделитель».

Разделитель — спокойная серая линия на ширину текстового блока. Это разделитель:

Прерывание — три серых символа-звёздочки по центру. Это прерывание:

Второй вариант особенно уместен в эссе, воспоминании или художественном тексте, где между эпизодами нужна заметная пауза. Выбирайте по ритму своего материала, а не ради заполнения свободного места.

У кода появилось собственное место

Если вы пишете о промптинге для ИИ, программировании, разбираете запрос к базе данных или объясняете устройство сайта, обычного абзаца для примера кода бывает недостаточно. Теперь для него есть отдельный блок в меню «Прочее». Это новая функция PRO; в меню её, как и другие платные возможности, отмечает зелёная звёздочка.

В редакторе можно выбрать язык, скопировать пример или снять оформление блока. При чтении остаются название выбранного языка и кнопка копирования.

В шапке блока выбирается язык: среди доступных есть Python, JavaScript, PHP, SQL, HTML, CSS, Markdown и другие. Выбранный язык включает подсветку синтаксиса — разные части записи легче различать. Если подсветка не нужна, можно оставить обычный текст. Для самого кода используется моноширинный шрифт: символы занимают одинаковую ширину, поэтому легче видеть структуру и отступы.

Мы отдельно настроили привычные действия с клавиатуры. Enter создаёт новую строку внутри кода, Tab добавляет табуляцию, а Ctrl+A выделяет содержимое текущего блока. Кнопка «Копировать» забирает весь код в буфер обмена и подтверждает действие уведомлением.

Длинные строки переносятся по ширине блока и на компьютере, и на телефоне. Размер шрифта учитывает ваши настройки чтения.

Здесь важно и другое: опубликованный фрагмент показывается как текст, а не запускается на странице. Можно объяснять устройство программы, не превращая статью в площадку для её выполнения. Безопасность превыше всего.

Спойлер стал спокойнее и аккуратнее

Спойлер уже был доступен авторам с PRO. Он помогает спрятать подробное объяснение, ответ на задачу или сюжетную развязку до тех пор, пока читатель сам не решит открыть этот фрагмент. В этом обновлении мы привели его оформление к тому же светлому стилю, что и у блока кода: с серой шапкой, тонкой рамкой и аккуратными скруглениями.

В шапке спойлера автор задаёт название и выбирает начальное состояние: «Раскрыт» или «Свёрнут». Служебной подписи внизу больше нет.

Переключатель начального состояния теперь выглядит легче: текст и небольшой глазик, без отдельной белой плашки. Крестик оформлен так же, как у кода. Нижнюю надпись «Конец спойлера» из редактора убрали — границы блока и без неё видны. При этом возможность выбрать, увидит ли читатель спойлер раскрытым или свёрнутым при открытии статьи, сохранилась.

За оформлением всё равно остаётся мысль

Новый инструмент полезен, когда помогает точнее выразиться. Где-то мысль становится яснее после короткого списка, где-то нужны цитата, пауза или подробный пример кода. Мы постарались дать этим приёмам понятные места и сделать работу с ними удобной на разных экранах.

Если заметите баги или неудобства при работе с новыми функциями текстового редактора, обязательно сообщайте!

Спасибо всем, кто присылает идеи, примеры и помогает развивать «Думайте». Попробуйте обновлённый редактор в следующей публикации и расскажите в комментариях, что стало удобнее, а чего вам по-прежнему не хватает. Хорошие инструменты обычно дорабатываются в разговоре с теми, кто ими пользуется.