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

Что вообще происходит

У дизайнера есть несколько разных способов передать иконки разработчику:

• отдельными файлами или спрайтом в png,
• отдельными файлами или спрайтом в svg,
• иконочным шрифтом.

На формат распространения накладываются и другие ограничения:

• платформа: веб, десктоп, мобильные
• цветность: монохромные, двухцветные, полноцветные
• dpi экранов
  и прочее

Разработчики фронтенда просят все время какие-то шрифты, svg-файлы или спрайты. Иногда фронтенд говорит совсем непонятные слова: закоммить в гит, пойду соберу пакет в нпм, давай настроим в сиай. Расскажу как все это сделать, никого не замучив. Понадобится фигма.

Рассказ может быть полезен разработчикам фронтенда и дизайнерам интерфейсов. В меньшей степени он будет полезен бекендным разработчикам интерфейсов (классический ASP.NET MVC или что-то подобное): схема будет та же, но не будет готовых файлов конфигураций и скриптов. Если кто-то расскажет как прикрутить к этому NuGet, напишите, я добавлю.

Зачем это делать, есть же фонтелло

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

Дизайнер может случайно сломать шрифт. Если забыть и не экспортировать иконку, которую уже давал, то следующая версия шрифта будет без него и в неизвестном месте сломается интерфейс. Ситуацию усугубляет факт, что дизайнеров у каждого продукта несколько, а общий набор иконок пополняют 5-6 человек.

Хорошее решение — простое, в нем минимум ручных действий.

Нескольким дизайнерам работать непросто. Если несколько дизайнеров поддерживают один шрифт, то возникает много вопросов синхронизации: где хранить исходники, файлы svg и файлы шрифта, кто собирает и кому передает, как не забыть иконку.

Хорошее решение позволяет добавлять иконки скольким угодно дизайнерам так, что они не испортят чужую работу.

Cложно интегрировать в общий процесс сборки продукта. Отдельно стоящий сервис тяжело встроить в общий процесс разработки и сборки, а у кого-то есть еще и процесс CI. Придется вручную собирать сервисом файл, куда-то его загружать и как-то версионировать.

Хорошее решение встраивается в процесс разработки.

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

Хорошее решение работает внутри компании.

Формируется не всё, что надо. Некоторые сервисы выдают шрифт, а иконки кодируют номерами символов. К сожалению, на эти номера полагаться нельзя. Если убрать иконку или поменять порядок, то в следующий раз сервис может выдать совсем другие коды и все иконки непредсказуемо поменяются.

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

Хорошее решение дает разработчикам все что нужно. Иконка кодируется понятным названием, коды символов и размер подставляются автоматически.

Новое в этой версии  

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

Сегодня — вариант для фигмы. Еще в нем появились svg-файлы и svg-спрайт. Иконки svg-спрайта поддерживают двухцветность и перекрашивание средствами css.

Куда смотреть

Я сделал:

• github.com/mikeozornin/some-icons — тестовый репозиторий
• figma.com/file/UaWytmrubMDjIpJnlMn03x/Some-icons-pack — тестовый фигма-файл

Чтобы сборка завелась, нужно подготовить токен доступа к фигме, ищите в профиле вот такое:

После этого действуйте по инструкции в Readme.md

Сборщик обращается к фигме, через веб-апи экспортирует svg-файлы, запускает сборку шрифта и svg-спрайта.

Я не очень пойму, что ещё комментировать, мне кажется, там все понятно и очевидно, поэтому вставляю только результат:

КДПВ

Было:

Стало:

Разные особенности

Как работает двухцветность спрайтовых иконок

Для двухцветности иконок в svg-спрайте и возможности перекрашивания их через css используется своеобразных хак.

<svg fill="#000" width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<path d="M8.62155 1.21658C8.45088 1.08099 8.2349 1 8 1C7.44771 1 7 1.44772 7 2C7 2.55228 7.44771 3 8 3C4.1554 3 3.80482 5.42796 3.08886 10.3863C3.05992 10.5868 3.03039 10.7913 3 11C2.51458 11 2.02917 11.3534 1.54375 12.0603C1.4751 12.1603 1.43835 12.2787 1.43835 12.4C1.43835 12.7314 1.707 13 2.0384 13L6.58534 13C6.53007 13.1564 6.5 13.3247 6.5 13.5C6.5 14.3284 7.17157 15 8 15C8.82843 15 9.5 14.3284 9.5 13.5C9.5 13.3247 9.46992 13.1564 9.41465 13L13.9616 13C14.0829 13 14.2013 12.9633 14.3013 12.8946C14.5745 12.707 14.6439 12.3335 14.4562 12.0603C13.9708 11.3534 13.4854 11 13 11C12.9668 10.775 12.9346 10.5547 12.9031 10.3391C12.7783 9.48499 12.6644 8.70518 12.5409 7.99982C12.5273 7.99994 12.5137 8 12.5 8C11.9617 8 11.4454 7.90547 10.9669 7.7321C11.0539 8.18151 11.1391 8.69127 11.2279 9.26906C11.2687 9.53513 11.3106 9.81613 11.3674 10.204C11.3589 10.146 11.4807 10.9794 11.5161 11.219L11.5575 11.5H4.44301L4.48435 11.2161C4.50903 11.0466 4.57528 10.5882 4.6098 10.3494L4.63087 10.2036C4.68629 9.8214 4.72807 9.5381 4.7686 9.27157C5.39203 5.17234 5.83807 4.5 8 4.5C8.03774 4.5 8.07495 4.50021 8.11166 4.50065C8.03858 4.17884 8 3.84392 8 3.5C8 3.33101 8.00932 3.1642 8.02746 3.00004C8.09885 2.35473 8.30674 1.75013 8.62155 1.21658Z"/>
<circle cx="12.5" cy="3.5" r="2.5" fill="currentColor"/>
</svg>

Это — код двухцветной иконки. Обратите внимание, что fill у svg стоит #000, а у части иконки, которую нужно красить отдельно, стоит fill=«currentColor».
Для перекрашивания применяется правило:

svg {
    fill: #8F99AA; /* Цвет основной части*/
    color: #E80E0E; /* Цвет дополнительной части*/ 
}

В результате этого правила у svg появляются два свойства: fill и color. Fill перекрашивает всю иконку, а color ни на что не влияет. У вложенной фигуры срабатывает свой fill, но он берет цвет из специальной переменной currentColor, которая залинкована на атрибут color у svg. В итоге атрибут color у svg не влияет на базовую контур, а используется только чтобы прокинуть внутрь дополнительный цвет.

Такая особенность нужна только для спрайта. Если вставить иконку прямо в DOM, то можно будет использовать любые нормальные способы (например, css-классы).

Зачем нужны CODEPOINTS

Ручное прописывание codepoints для символов нужно, чтобы при переборке шрифта не поехали коды символов. Если вы не собираетесь использовать TTF-шрифт, забейте и не используйте. Если вам нужен TTF-шрифт со стабильными кодами символами, придется выдавать их вручную.

Как лучше версионировать

У нас (вообще это не обязательно) пакеты версионируются по семверу (semver.org). Версии нумеруются в формате Major.Minor.Patch (например, 3.2.1: 3 — major, 2 — minor, 1 — patch).

• Major-версия обновляется при ломающих изменениях
  Ломающие изменения говорят о том, что нельзя просто обновить иконку, нужно скорее всего будет менять код в продукте. Ломающие изменения описаны в changelog. Самый частый случай: переименования иконок, при обновлении пакета нужно заменить в продукте старое имя на новое.
• Minor-версия обновляется при новых фичах: появление новой иконки, нового формата css и прочее.
  Обновляться на новую версию можно безопасно, ничего сломаться не должно.
• Patch-версия инкрементируется при багфиксах, исправлениях иконок и прочих мелких изменениях.
  Обновляться на новую версию можно безопасно, ничего сломаться не должно.

Если есть вопросы, пишите в комментарии или на почту mike.ozornin@gmail.com

Мне поднадоело, что в ноутбуке всего 256 гигайбайт. Жить можно, но не очень комфортно. Я заменил себе диск на 1 ТБ, накидаю ссылок, вдруг кто тоже захочет. В мире полно гайдов, мой пост — не гайд, а просто набор ссылок.

Если в ноутбуке маловато места, то вот какие есть варианты:

• (Самый эппловый) Купить новый ноутбук.
• Апгрейд в авторизованном центре на эпловый ССД. Освежающе дорого.
• Сторонний ССД, совместимый по разъему. Их два: OWC Aura и Transcend. OWC быстрый, транценд — медленный. ~230 долларов за 1 ТБ
• Любой SATA/NVME (зависит от года макбука) ССД-диск через адаптер. ~145 долларов за 1 ТБ.

Что понадобится

1. ССД-диск
Нужен ССД-диск sata или nvme, зависит от модели и года ноутбука, погуглите. По-моему, для late 2013+ можно nvme. Смотрите на скорость (неплохо бы иметь 1500+ на запись и чтение), на ресурс (TBW, неплохо бы хотя бы 600 объемов диска) и на производителя. ( ! ) Не покупайте ссд-диск (как и флешки и сд-карты) на алиэкспрессе. Будет дороже и хуже.

Самые быстрые и надежные ССД — Самсунги, например, 970 Про. Однако я как белка-истеричка начитался отзывов, что они греются и решил не рисковать в ноутбук, но в ютубе полно роликов, где меняют на самсунг, скорее всего все ок.

Я взял себе WD с понятным и запоминаемым названием WDS100T2B0C (m2, nvme, 2280): ozon.ru/context/detail/id/173251567

2. Адаптер-переходник с ССД-диска на разъем макбучного ССД
Опять же зависит от года модели и типа диска, искать по словам «sintech macbook 20XX ssd adapter». Пишут, что короткие адаптеры-переходники поглючивают на гибернации, но новые лишены этой проблемы. Новый — длинный с подложкой.

Я покупал на сайте производителя для 2013-2015 годов:
eshop.sintech.cn/index.php?main_page=product_info&cPath=130_132&products_id=1229

3. Отвертки и прочая мелочь
Нужны будут инструменты для разбора и замены, как минимум две отвертки, называются T5 Torx Screwdriver и 5-Point Pentalobe Screwdriver.

У меня xiaomi: market.yandex.ru
Вот эти должны быть совсем хорошим вариантом: ifixit.com/Store/Tools/Mako-Driver-Kit—64-Precision-Bits/IF145-299
Какой-то бюджетный ноунейм за 270 ₽: citilink.ru/catalog/power_tools_and_garden_equipments/tools_sets/1159351/

Гайды по замене

Замена за 10 минут. Есть две тонкости: обновите перед заменой макось, чтобы появилась поддержки nvme и не забудьте отрубить аккумулятор перед заменой ССД.

В виде статьи: ifixit.com/Guide/MacBook+Pro+15-Inch+Retina+Display+Mid+2015+SSD+Replacement/48251
В виде видео: youtube.com/watch?v=NU6yatTvyyk

Очень подробный гайд про все-все-все вопросы, жаль нашел после установки: forums.macrumors.com/threads/upgrading-2013-2014-macbook-pro-ssd-to-m-2-nvme.2034976

Вместо итогов

Вроде все ок: работает, из сна выходит, адаптер ничего не притормаживает, обещанные 1800 за запись и чтение есть (filevault включен, ссд свободен на 70%).

У нас была задача, которую мне казалось, невозможно нормально решить в фигме. Оказалось, что решение простое, вдруг кому пригодится, я ещё вчера не знал

Ситуация

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

Задача была обновить иконки, не потеряв оверрайды в макетах.

Допустим, иконки выглядит вот так (слева — старая, справа — новая):

Нужно обновить все иконки сразу
Перерисовывать иконки по одной прямо в компонентах — не вариант: в макеты пролезут недоделанные варианты. Хочется сначала нарисовать их, сравнить со старыми, проверить и отладить, а потом уже обновить все иконки сразу.

Не получится сделать новые компоненты
Не получится скопировать все иконки, перерисовать их, и сделать новые компоненты. Сделать новые не проблема, а вот заменить старые на новые не выйдет. Даже если их заменить (через Select All with Same Instance), то все инстансы компонентов потеряют оверрайды цвета. При замене компонента на другой из всех оверрайдов фигма сохраняет только текст, все остальное сбрасывается. Можно воспользоваться плагинами Reattach Instance или Master, но все равно это достаточно муторно.

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

Для замены контура иконки не помогает ни union (добавить новый контур, сделать union со старым, удалить старый), ни flatten (добавить новый контур, сделать ему flatten со старым). Все способы добавления нового контура не работают, нужно использовать именно старый.

Решение

На помощь приходят Vector Networks. У фигмы в одном контуре могут быть сложные конструкции, которые называются Vector Networks. Можно воспользоваться ими, покажу на картинках.

Шаг 1: Скопировать старый контур. Нужно зайти в режим редактирования контура (Enter ):

Выделить все точки (⌘ + A ) и скопировать их (⌘ + C ):

Шаг 2: Добавить новый контур к старому. Нужно зайти в режим редактирования контура в компоненте (Enter):

Выделить все точки (⌘ + A ) и скопировать их (⌘ + C ):

Сдвинуть выделенные точки контура куда-нибудь подальше:

Добавить точки из буфера обмена (⌘ + V ). Обратите внимание, что новый контур добавился и не сломал оверрайды (два кольца одинакового цвета):

Шаг 3: Удалить старый контур. Выделить ненужные точки:

И удалить их (⌫ ):

Вуаля.

На всякий случай скринкаст:

«Критика — это комплимент» написал в 2011 году Илья Бирман. С тех пор я замечаю, что люди вокруг меня неправильно пониманию этот принцип. Расскажу, как это бывает, и как воспринимаю его я.

Я не уточнял, что вкладывал в заголовок Илья Бирман, поэтому правильно или неправильно — это моё восприятие.

Как относиться к принципу: неправильно

Как неправильно: критикуя кого-то, я делаю ему комплимент.

Такое понимание приводит к нескольким логичным выводам:

• Если критика благо, нужно приносить этого блага как можно больше.
• Если все относятся к критике как к комплименту, критиковать можно все вокруг, не заботясь о разрешении и не заморачиваясь о форме.
• Если критика дается всегда и всем, то сигналом все в порядке служит само отсутствие критики.

Стоит ли говорить, что людей, которые себя так ведут, почти никто не любит. Я долгое время вел себя на 50% от этого, и даже 50% люди вокруг с трудом терпели.

Как относиться к принципу: правильно

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

Такое понимание приводит к нескольким логичным выводам:

• Восприятие критики как комплимента — это собственное решение того, кого критикуют. Конструкция «ты должен относиться к критике как к комплименту» неправильная, никто никому ничего не должен.
• Если известно, что человек придерживается принципа «Критика — это комплимент», то критиковать можно смелее. Если не известно, то лучше подстелить себе соломки и критиковать более аккуратно (см. ссылки на полях)
• Не нужно критиковать всех вокруг по любому поводу.
• Раз критикуется не всегда и не всё, то отсутствие критики ни о чем не говорит. Отсутствие критики не может служить положительным подкреплением ни в каком виде.

Здесь мы подходим к тому, ради чего я все это затевал.

Критика это полезно, но ещё полезней — хвалить людей

Хвалить людей

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

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

Я долго учился хвалить людей, и прошел 1-2% нужного пути. Вот какие принципы по которым я хвалю и говорю хорошее:

1. Хвалить. Важно не забывать хвалить, особенно вначале, когда это еще не вошло в привычку. Чтобы не забыть я завел себе задачу в тудушке «Сказать спасибо». Кроме спасиб после напоминания тудушки, я пытаюсь подумать про каждую большую совместно сделанную задачу и найти моменты, за которые можно сказать спасибо и похвалить.

2. Хвалить только за дело. Мне кажется важно, чтобы похвала была не вообще, а за дело.

Я никогда не хвалю просто так, абстрактно. Я не говорю огромное спасибо за то, что и так ожидаю от человека. Позже, когда человек сделает что-то крутое, мне будет сложнее подчеркнуть его заслуги.

Если непонятно за что хвалить, а хочется, всегда можно похвалить не вообще, а за что-то:

• Спасибо, что ты откликнулся!
• Спасибо, что ты сделал это сегодня!
• Спасибо, что сделал, ты меня очень выручил!

Мне самому сложно понять, когда я делаю двухминутную задачу, которую и так должен сделать, а люди пишут «огромное спасибо». WAT?! Подтверждения, что я сделал то, что нужно, было бы достаточно.

Впрочем, это относится и к критике. Критиковать человека просто так — табу. «Вася, почему ты не уважаешь коллег?!» → «Вася, сегодня ты опоздал на встречу, где тебя ждало 5 человек. Меня огорчает, когда я вынужден ждать кого-то и впустую тратить свое время. Пожалуйста, следи за своими встречами и не опаздывай. Если тебе нужна помощь с календарем, давай я помогу».

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

— Ваня, я бы хотел поговорить с тобой о задаче …
— Что было хорошо: …
— Что было плохо: …

4. Публичная похвала работает круче, чем личная. Если уместно похвалить публично, то лучше делать это публично. Мне кажется, такая похвала сильнее, чем сказанная лично.

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

5. Не надо искать повода. Бывает так: команда молодцы, с ней комфортно, делают работу хорошо и они всегда помогают. Но как-то писать об этом кажется странно. Предлагаю забить на эту странность и похвалить. Когда я пишу:
У меня есть проблема, что я никогда не забываю покритиковать, но редко кого-то хвалю. Я стараюсь не забывать, вот сегодня вспомнил про вас. Вспомнил я внезапно, но все сказанное правда и говорю я это совершенно искренне.
…
Ещё никто не ответил «Миша, ты не охренел ли?». Не было даже тех, кто попытался пошутить «Скажи, что андроид круче айос, если тебя держат в заложниках».

Вместо вывода

Хвалите людей вокруг

А ещё прочитайте пост Ники Троицкой про то, как хвалить людей и котиков: Вы получаете то, что продолжительно поощряете

Мне недавно один раз позвонили мошенники «из Сбербанка» и я задумался о способе борьбы с ними

Проблема

У клиентов Сбербанка есть частая проблема. Им звонят мошенники и пытаются средствами социальной инженерии украсть деньги: или узнать пароли, или уговорить совершить перевод.

Почему это происходит именно со Сбербанком (мои предположения):

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

Как пытаются решить проблему сейчас

Люди и банк пытаются решить проблему с разных сторон. Пользователи — учатся отличать мошенников от банка (благо это несложно: если звонят — в 99% это мошенники), а банк борется с номерами и пытается их блокировать.

Высказываются и совсем экстремальные способы, например, перевести всех на чат и рассказывать всем, что банк вообще не звонит. Мне кажется, это будет работать не очень хорошо. В этом способе не решается главная проблема: как донести всем 100% клиентов, что банк не звонит? Как их к этому приучить? Как сделать реакцию «позвонили — мошенники» уверенной?

Банк может обучать своих клиентов (и делает это), но обучение затратно для клиентов по ментальным усилиям, часто они хотят просто пользоваться банком, а не обучаться ещё и тут. И опять же, пожилых часто обучать сложнее, чем молодых (простите за такой вот эйджизм). Особенно легко проверить, когда по телефону обращаются по имени-отчеству.

Мое решение

Сбербанк может встроить в своё мобильное приложение определитель мошеннических номеров и будет подставлять их на экран звонка через Caller ID. Caller ID — специальное API, через которое можно определять номер телефона, добавляя к нему какую-то внешнюю информацию.

Многие приложения и сервисы так уже делают:

• Яндекс: определяет входящие номера, показывает название ресторана, кафе или магазина, отдельно помечает соцопросы и мошеннические звонки.
• Хантфлоу: при звонке кандидата рекрутеру определяется номер телефона и рекрутеру напоминают кто звонит и по какой вакансии.
• AmoCRM: при входящем звонке номер проверяется по CRM-базе и менеджеру по продажам показываются данные о контакте.

Выглядеть это будет примерно так:

Работоспособность решения

Почему это вряд ли будет работать у Яндекса, 2Гиса или Касперского так хорошо, как Сбербанк.

Желание и цель: Решение такой задачи на очень высоком уровне не в интересах Яндекса, 2Гиса или Касперского. У них просто нет необходимости убиваться и очень легко остановиться на уровне «удовлетворительно».

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

Ресурсы: У Сбербанка так или иначе собирается база номеров: их ИБ-подразделение разбирает инциденты. Сбербанк может собирать номера из обращений и по отзывам в соцсетях. Да и просто о фактах мошенничества и номерах телефонах клиенты сообщают именно Сберу, а не Яндексу.

В интересах Сбербанка иметь максимально полную базу мошеннических номеров. Откуда Яндекс возьмет такую же полную базу номеров — непонятно.

Доступность для целевой аудитории: Своё приложение Сбербанк может и будет продвигать активней, чем приложение Яндекса (приложение Яндекса очевидно не будет вообще). Яндекс же тоже не станет убиваться и стараться для Сбера.

У Сбера есть канал распространения, выход на клиентов, он даже знает, кому можно советовать приложение в первую очередь, — тем кто предположительно находится в зоне риска.

Выгода: Яндексу решение этой конкретной задачи непонятно зачем.

Сбербанк же, решая задачу, защищает деньги клиентов (и свои) и экономит на разборе инцидентов, снижая их количество. Сбербанк делает жизнь клиентов лучше → клиенты любят банк → банк экономит на маркетинге.

Преимущество решения

В отличие от простого обучения «Как определить мошенников» эта схема может сработать даже с теми, кто в зоне риска.

Я уверен, что многие молодые люди установят и настроят приложение на телефонах своих родителей, дедушек и бабушек, — затрат не требует, а дополнительный уровень защиты есть. Одно дело учить «не отвечай никому, кто звонит из банка», другое дело на телефоне перед звонком показывается

«❌ ❌ ❌ Возможно, мошенники ❌ ❌ ❌».

Замечания параноика. Лучше сделать определитель и встроенным в мобильный сбербанк онлайн (чтобы не ставить отдельное приложение, тем у кого уже есть мобильный банк), и отдельным приложением (те, кто не хочет ставить сбербанк-онлайн смогут установить себе только определитель).

Вместо вывода

С моей точки зрения, это не очень сложно для мощной команды Сбера. Но если я хорошо гуглил, этого нет.

Я не очень верю, что Сбер не рассматривал такой способ, видимо отказался. Почему? Что я не учел? Где схема ломается?

Рассказываю ещё об одном рабочем принципе, который мне казался очевидным, но нет.

Все программы и сервисы хотят загадить ваши сообщения и письма, с этим приходится бороться. О чем я говорю:

Скайп для бизнеса:

Зум:

Телеграмное превью:

Автоматические реферальные приглашения:

С ними есть несколько проблем:

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

Я отметил полезную площадь зумовского письма:

Как правильно:

Нужно оставить только самое главное, обычно это ссылка

Переделываю график по голосованию

Максим Кац выложил выложил вчера сводный график по голосованиям:
twitter.com/max_katz/status/1280143683434811395
У меня сразу сработала профдеформация и желание его переделать.

Теория

Есть такой тип визуализации «Регулярные карты», они сохраняют узнаваемость карты и дают при этом возможность визуализировать данные в удобном формате.

Примеры:

Иммиграция в США, pmcruz.com/dendrochronology/, фантастически красивая, посмотрите

Наступление весны в США, washingtonpost.com/graphics/2018/national/early-spring/

Ожирение в разных штатах, flowingdata.com/2016/09/26/the-spread-of-obesity

Доминирующие партии в разных штатах, graphics.wsj.com/elections/2016/field-guide-red-blue-america/

Районы Лондона, informationisbeautifulawards.com/showcase/842-london-squared-map-making-the-city-easier-to-read, оригинальная ссылка сломалась, держите эту

Результаты выборов в США, нашел у Кирилла Беляева

Картинку Максима Каца нужно переделать в карту, так станет понятно, где больше фальсификаций, а где меньше, да и просто будет проще найти свой регион.

Редизайн

Самый сложный момент — составить узнаваемую регулярную карту, для США такого полно, для России я не встречал. Оказалось уже были попытки сделать, я воспользовался готовой картой Ивана Дианова (medium.com/kompany/the-step-by-step-story-of-making-a-tile-grid-map-of-russia-92190d14e41e)

Посмотрите процесс в посте, там был много попыток нарисовать хорошую регулярную карту.

Upd. Женя Софронов принес ссылку на конкурс регулярных карт для России, на котором как раз победила карта Ивана Дианова. Посмотрите, там много интересного: telegra.ph/Uchastniki-i-ih-raboty-12-03.

Итог:

Собрал в фигме, чтобы вы могли себе скопировать: figma.com/file/eflJ42NaaPY8kcyc7ZetKJ/russia-regular-vote-map

Теперь легче и интереснее рассматривать и проще сделать какие выводы. Сделать выводы предлагаю самостоятельно.

Пытаюсь объяснить, почему можно и нужно писать числа прописью.

В русском языке все числа можно записывать прописью (буквами), некоторые числа можно записывать и цифрами. К сожалению, я замечаю вокруг повальное увлечение писать числа только цифрами, даже в тех случаях, когда цифрами писать не надо или нельзя. Из-за того, что люди ошибаются и записывают числа неправильно, мне бывает сложно понимать записанное.

TL;DR; Числа, записанные цифрами, всегда читаются как «один», «одна», «одно», «два», «три». Не используйте такую запись ни для чего другого.

Количественные числительные

Количественные числительные — сколько? скольких? скольким?

В именительное падеже их можно писать цифрами:

А вот в других падежах писать цифрами нельзя:

Существительные, похожие на числительные

В русском языке есть существительные, похожие на числительные. Их писать цифрами тоже нельзя:

Что за «два-ка», «три-ка», «три-ица», «десять-ка» и «десять-очка»?

Порядковые числительные

Порядковые числительные «первый», «второй» наращиваются так: 1-й, 2-й.
Как правильно, почитайте у Ильи Бирмана.

Специальное комбо для тех, у кого кровоточат глаза от неправильных наращений:

С 3-ёх летним опытом

Почему ещё можно и нужно писать числа прописью

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

В каком абзаце вы быстрее заметили число?

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

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

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

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

Запомнить

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

Ночная история про профессиональный заскок, сафари и Тинькофф.

Изначально это был твиттер-тред, но для истории я перенес его в блог.

Вижу, что на странице Тинькофф какой-то конский пробел между Tinkoff и Black, очевидно так не должно быть. (только в сафари, в других браузерах все ок).

Смотрю в код, там неразрывный пробел, меняю на обычный — все становится отлично.

Ну, понятно, дело в символе неразрывного пробела, который как-то не так сделали в шрифте. Добавляю для проверки второй раз Black через неразрывный пробел, но нет — все нормально.

Интересно…

Пытаюсь понять, в чем разница, вижу, что ff — одна из стандартных лигатур, может быть дело именно в лигатуре? Пробую остальные — бинго, это они.

Для окончательной проверки отключаю лигатуры заклинанием:

font-variant-ligatures: none;

 
Все пробелы выравниваются.

Почему так не знаю (скорее всего баг в сафари), но любопытство удовлетворил. Дизайнеры Тинькофф, вы, видимо, в хроме сидите?

Частенько я получаю письма, для ответа на которые нужно что-то вспоминать, искать, смотреть в прошлых письмах, чатах или вики. Отвечать на них не хочется, всегда невольно тяну до последнего.

Рассказываю о принципе, помогающем написать письмо, на которое легко и приятно отвечать.

Принцип звучит так:

В письме уже есть всё нужное

В любом письме всегда должно быть всё, что может понадобиться адресату: ссылки, документы, напоминания, история вопроса. Представьте, что у него перед глазами есть только письмо, нет архива переписки, истории чата, доступа в вики, ноушену или гугл-доксу. Будет ли ему удобно ответить на вопрос или принять решение? Сможет он вообще ответить на письмо?

Приведу несколько примеров из жизни. Я убрал из них реальные имена (кроме своего), задачи, комментарии и ссылки.

Напомнить о долге

Моя реакция была примерно такая: ну офигеть, «говорят», кто говорит? Какие долги, где вообще что искать? Ок, пойду спрошу Лену, она отправит к Васе, Вася — к Насте, Настя к Леше. Если потрачу целый день, то узнаю.

Внес исправления, нужно попросить посмотреть снова

Да, не хватало только ссылки, все остальное в сообщении было ок. Напоминать замечания в письме было не обязательно, они все были комментариями к документу.

Создать встречу

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

Сообщить об том, что изменения в макеты внесены

Добавить кого-то в переписку

Самые эпичные примеры обычно именно с добавлением в переписку. Человека добавляются в тред из 20 писем, он видит эту огромную переписку, непонятно, что читать, а что нет, непонятно, что спрашивают, непонятно когда. В итоге он просто хочет под одеялко.

Вместо заключения

Да, писать так муторно.
Да, писать так долго.
Да, если адресату нужно что-то от меня, он все это найдет сам.

На самом деле, писать так в ваших же интересах: сделайте адресату удобно и он быстро ответит на ваше письмо. Другие письма проигнорирует, потому что они плохие, а на ваше ответит первым, потому что легко.

Ссылки по теме

• Совет Василия Половнёва bureau.ru/soviet/20190307
• Книга «Новые правила деловой переписки», Максим Ильяхов, Людмила Сарычева
• Константин Коломеец про помощь в принятии решений: Интранет и скорость принятия решений
• Женя Арутюнов про принцип «Всегда с мобилы»