Как рассчитать время прочтения статьи

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

Время на чтение статьи рассчитываем так:
Средняя скорость чтения взрослого человека — 1500 знаков в минуту. Если взять количество знаков в статье и поделить на 1500, получим количество минут. Каждая картинка прибавляет к общему времени +0,2 минуты. Округляем до большего целого числа уже после 0,3 включительно. Запас взят, чтобы не сильно обманывать ожидания людей, что читают медленнее среднего.

Например у нас есть статья на 4315 знаков с двумя картинками.

4315/1500 =2,87
2,87+0,2×2 картинки = 3,27

Округляем до 3 минут чтения.

Если бы знаков было 4 350, то мы бы получили 4 минуты чтения, округлив 3,3 до 4.

HOW TO WORK BETTER (как работать лучше/продуктивнее)

HOW TO WORK BETTER (как работать лучше/продуктивнее)

HOW TO WORK BETTER (как работать лучше/продуктивнее) – произведение художников Peter Fischli и David Weiss. Список из 10 простых пунктов распространяется не только на продуктивность в работе, но и на восприятие повседневной жизни.

1 Делай только одно дело одновременно / сосредоточься на одной задаче
2 Осознавай проблему
3 Учись слушать
4 Учись задавать вопросы
5 Отличай важное от неважного
6 Принимай изменчивость как неизбежность 🙂
7 Признавай/допускай ошибки
8 Говори проще
9 Будь спокойным/ой
10 Улыбайся

Художники заимствовали эти мысли со знака на доске объявлений на керамической фабрике в Тайланде почти 30 лет назад. С тех пор список появлялся на разных носителях от почтовой открытки до книжной обложки. Работа получила широкую известность в 1991, после появления в виде мурала на торце офисного здания в Цюрихе. Для повторения стиля оригинальной надписи художники изготавливали трафареты с фотографии каждый раз, когда список воспроизводился.

Спустя 25 лет простые пункты, созданные для мотивации рабочих на далекой фабрике, стали настольным руководством для художников, кураторов, дизайнеров и студий.

И даже сейчас, местами наивный, список HOW TO WORK BETTER предлагает нам остановиться и подумать о том, как и почему мы делаем то, что делаем 🙂

Чтобы обратиться к какому-либо узлу, его сначала надо найти

Для этого есть разные методы, но в современном прототипировании чаще всего применяются два метода:

let el = document.querySelector(selector)
и
let elems = document.querySelectorAll(selector)

Оба метода получают на вход CSS-селектор элемента. Например:

let el = document.querySelector(".someClass b");

Отличие их в том, что querySelector вернёт один узел, который попался первым, а querySelectorAll вернёт список всех узлов на странице, соответствующих селектору.

Список узлов очень похож на массив, но не является массивом. Например, у него, как и у массивов, есть метод forEach, при помощи которого можно перебрать один элемент за другим. Но у него нет метода map, который позволяет преобразовать один массив в другой, применив к каждому элементу функцию-колбэк.

Если же вам всё-таки нужен метод map, то вы можете преобразовать список узлов в массив при помощи конструкции [...nodeList]:

let arr = document.querySelecroAll("a");
[...arr].map(el => el.innerText);

Подробнее в видео: https://youtu.be/KIBv7QMToP4
И в примере с кодом: https://codepen.io/detepr/pres/mQqKZO

Стакан UX-писателя всегда наполовину полон.

Не «Информация исчезнет через 5 дней», а «Информация будет доступна ещё 5 дней».

Не «Договор расторгнут», а «Нужен новый договор».

Не «Заплатите, иначе услуга будет приостановлена», а «Чтобы продолжать пользоваться, заплатите до 7 марта».

Не «Услуга доступна не чаще 2 раз в год», а «Можно пользоваться 2 раза в год».

В мире и так много негатива и коронавируса, зачем ещё в приложениях нагнетать?

Не забывать напоминать

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

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

Чтобы вас не динамили — надо напоминать, надо делать себя приоритетными.
К счастью, сейчас полно стандартных инструментов, которые позволяют напоминать. Что я использую:

👉 Отправка почты по расписанию. Если кто-то мне что-то должен в определённый день, то я заранее отправляю отложенное письмо, которое придёт адресату за день до срока долга и напомнит. Примерно так: "Напоминаю, завтра жду от вас ...". Отложенная отправка есть и в Gmail, и в Яндекс почте и наверное, много где.

👉 Если долгов много — ставлю мероприятия в Гугл. Календарь, подключаю туда "должника" и в настройки ставлю: уведомить на почту за 1 день" (или несколько интервалов).

👉 Пару раз использовал отложенные сообщения в Телеграм (их недавняя опция) — тот же смысл, что и с почтой, но более личный.

👉 Можно задействовать Trello, подключая "должника" как исполнителя на задачи со сроком — этот путь чуть сложнее, так как требует вовлечения должника в Trello.

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

Аврора Харли написала о непредсказуемой работе крестиков, закрывающих окна с формами.

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

Чтобы продукт вёл себя предсказуемо:

1. Запрашивайте подтверждение перед деструктивным действием, когда могут пропасть пользовательские данные. Например, если пользователь закрывает фильтр, не применив его, отобразите диалоговое окно: «Вы хотели бы применить фильтр перед возвращением в список товаров? Да / Нет».

2. Замените крестик на текстовую кнопку, которая чётко даст понять, что произойдёт: отмена или закрытие.

3. По умолчанию проектируйте так, чтобы пользователь не терял данные, нажимая на крестик. Например, в окне с формой нового письма в Gmail это действие приводит к сохранению черновика письма и закрытию окна.

https://ux.pub/otmenit-ili-zakryt-dizayn-neodnoznachnyh-deystviy/