Ух…
==============================
[Дизайн]
==============================
Дизайн во времени 🕰
10 лет исполняется с момента запуска App Store (10 июля 2018).
В статье проведено множество примеров приложений, которые претерпели множество изменений.
https://9to5mac.com/2018/07/10/app-store-10-years-design-evolution/

Как будут выглядеть приложения Google по новым законам Material дизайна. 👋
https://arstechnica.com/gadgets/2018/07/google-video-shows-early-app-redesigns-for-gmail-google-photos-and-more/

Гениальная статья о разграничении пространства на MacOS экранах.. Flow повсюду. 😜
https://uxdesign.cc/my-attempt-at-redesigning-the-desktop-experience-macos-case-study-99f5f2fb3b10

S7 Airlines уводит UX в будущее. ✈️
https://designpub.ru/designops-ux-стратегия-на-практике-начало-5a45fb8f699b

Почему стоит постоянно заниматься улучшением интерфейсов? 📈
https://uxdesign.cc/default-valid-vs-default-invalid-641570ae2fec

«Чего пользователи ждут от разделов настроек». 🕷🕸
UX исследование пользовательских интерфейсов.
https://baymard.com/blog/new-research-accounts-self-service

==============================
[Разбираемся с дизайн системами]
==============================

Что это такое? 🤔
https://medium.com/tradecraft-traction/eight-things-you-need-to-know-about-design-systems-bae8bd884b3b

Дизайн система GitHub.
https://medium.com/@broccolini/design-systems-at-github-c8e5378d2542

Дизайн система Atlassian.
https://www.atlassian.com/blog/inside-atlassian/designops-atlassian-design-studio

Быстрый старт к дизайн системам 🔥
https://medium.com/oscar-tech/six-lessons-learned-by-creating-a-design-system-at-a-fast-moving-start-up-30ba8458fa20



Как разрабатывать дизайн понятный детям. 🚼
https://www.nngroup.com/articles/children-ux-physical-development/

Как разрабатывать дизайн государственным сайтам (гос сайты) (official website of the United States government). 👮
Там все аспекты от дизайна до бэка
https://accessibility.digital.gov

Как разрабатывать дизайн понятный разработчикам, когда он им вообще не нужен. 🤖
https://medium.com/design-ibm/real-developers-dont-use-uis-daea7404fb4e

Алёна Кирдина приводит примеры из игровых интерфейсов, которые полезны и для обычных веб и мобильных приложений. 👾
https://evilmartians.com/chronicles/level-up-for-ux-design-lessons-from-videogames


==============================
Приложение Affinity Designer вышло для iPad. 🏞
https://affinity.serif.com/ru/designer/ipad/

Adobe готовит полный порт Photoshop для IPad. 🔥🌅
https://www.bloomberg.com/news/articles/2018-07-13/adobe-is-said-to-plan-photoshop-for-ipad-in-app-strategy-shift

Сложная и интересная статья про реструктуризацию фотографий Google Photos 😱
Как сделать красиво
https://medium.com/google-design/google-photos-45b714dfbed1

==============================
[Разработка]
==============================

В Firefox появился инструмент для проверки accessibility сайта 🛃
https://developer.mozilla.org/en-US/docs/Tools/Accessibility_inspector

==============================
[Инструменты]
==============================

Делайте превьюшки ваших мобильных приложений и сайтов на красивых мокапах бесплатно и быстро. 📱
(поддержка часиков, планшетов, ноутбуков появится чуть позже)
https://shotsnapp.com

Инструмент для красивой подачи кода 🔤
1. Вставляем код
2. Выбираем цвета
Получаем код на «красивой тарелочке с выбранной нами каемочкой»
https://carbon.now.sh


Сайт на одной странице покажет все возможные вариации сайта в разных расширениях экранов. 👈👉
https://polypane.rocks

Инструмент для генерации Visual Sitemap в считанные секунды 💫
https://visualsitemaps.com

SVGator инструмент для генерации анимированных SVG 🌹
Здесь вы найдете инструкцию по освоению этого довольно интересного инструмента
https://www.smashingmagazine.com/2018/07/animating-svg-files-svgator/

Охотимся за градиентами 🍒
Простой и понятный инструмент для подбора градиентов
https://gradienthunt.com

==============================
[Для общего кругозора]
==============================

Разбираемся с Variable Fonts вместе с Крисом Коером ✌️
https://css-tricks.com/weird-things-variable-fonts-can-do/

Проблемы синего света (почему экраны портят наш сон и зрение) 😧
https://medium.com/@caseorganic/why-blue-light-is-so-bad-the-science-and-some-solutions-d992a352464b

Сервисы, из которых будет состоять платформа TON (Telegram Open Network)

Кошелек - легкий простой в использовании кошелек, который будет встроен в мессенджер.
Облачное хранилище - похожее на распределенный Dropbox хранилище не только для файлов пользователей, но и для больших объемов данных.

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

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

Боты - виртуальные витрины для демонстрации реальных физических товаров и оформления заказов, как в интернет магазинах. Таких ботов тоже уже можно настроить для автоматизации части работы интернет-магазина et cetera.
Платформа для запуска собственного ICO - позволит создавать собственные криптовалюты внутри платформы TON.
Платформа для микроплатежей - мгновенные безопасные оффчейн переводы валюты.

DNS TON - сервис для присвоения читабельных названий аккаунтам, смарт-контрактам, сервисам и сетевым узлам. Делает сложную децентрализованную платформу user-friendly.

==============================
[Дизайн]
==============================

Как "без потерь" внедрять изменения в дизайн продукта.
Изменения никогда не даются легко. В большинстве случаев пользователи негативно относятся к редизайну интерфейса, поэтому следует тестировать ваши решения
→ https://tgraph.io/uxidesign-08-20

Страница 404 без регистрации и смс (от лучших digital-агенств).
→ https://vc.ru/44455

Космический художник.
Он рисовал пейзажи других планет и людей, гуляющих под чужими солнцами, задолго до запуска Первого спутника. Пронеся через всю жизнь любовь к астрономии, этот художник заразил своей страстью поколения инженеров, учёных и мечтателей
→ pikabu.ru/story/_6128285

Настоящее и будущее UI дизайна в концепции VR,AR,AI…
→ https://uxdesign.cc/the-present-and-future-of-ai-in-design-infographic-5ca90de10e72

А вот вы знаете, откуда берется блюр?
Научный подход к эффекту размытия.
→ https://medium.com/microsoft-design/science-in-the-system-how-blur-effects-work-8b0590996e09

==============================
[Разработка]
==============================

Разбираемся с автоматическими тестами прила на JavaScript при помощи Mocha  и Chai.
→ https://blog.usejournal.com/https-medium-com-thisisabdus-automated-testing-with-mocha-beginners-guide-for-testing-javascript-apps-45aa67dc3352

Притча о git.
Увлекательный рассказ, в котором вы разберётесь с основными концепциями и внутренним устройством git
→ https://tom.preston-werner.com/2009/05/19/the-git-parable.html

Средний цвет в JavaScript.
Статья о том, как получить средний цвет фотографии и где это можно использовать при верстке.
https://medium.com/p/3ccb4ff906d7

Почему разработчики должны уметь красиво писать.
→ https://medium.freecodecamp.org/why-developers-should-know-how-to-write-dc35aa9b71ab
→ https://uxdesign.cc/how-to-write-products-a269c775bfa5

Очень коротко и по делу об основах веб безопасности.
→ https://medium.freecodecamp.org/a-quick-introduction-to-web-security-f90beaf4dd41

==============================
[Фреймворки и библиотеки]
==============================

Небольшой JavaScript фреймворк, размером в 1 kB.
→ https://hyperapp.js.org

Еще один небольшой JavaScript фреймворк, заточенный под самое необходимое.
→ https://github.com/usehenri/henri

Подборка лучших Open Source проектов на Node.js за август.
→ https://codeburst.io/top-new-node-js-open-source-projects-this-month-august-2018-6b6f3a4c30c2

50 самых популярных JavaScript open-source проектов на GitHub за 2018.
→ https://hackernoon.com/50-popular-javascript-open-source-projects-on-github-in-2018-469c11b48b8d

==============================
[Инструменты и сервисы]
==============================

Проверка зависимостей пакетов.
Загружаем файл package.json на сайт, и проект покажет вам всё зависимости ваших пакетов и их суммарный размер.. а дальше решать уже вам
→ https://bundlephobia.com

Сервис похожий на Pastebin, только для JSON структур.
Можете поселить там ваш JSON объект и обращаться к нему, модифицировать… по средствам бесплатного внешнего API.
​​→ https://jsonbin.io

У сайта Telegra.ph есть официальный бот @telegraph.
Бот позволяет авторизироваться на сайте и в последствии дополнять и редактировать опубликованные материалы в любое удобное вам время.
→ @telegraph

Сервис по распознаванию содержимого на изображениях, по средствам AI.
Есть хорошее API.
→ https://cloudsight.ai

Коллекция JS-приложений, работающих с искусственным интеллектом.
фотографии из набросков, подписи к картинкам, симулятор эволюции, умная драм-машина, змейка с управлением головой и многое другое.
​​→ https://aijs.rocks

Сканер цен на любые товары.
Совсем недавно появилось API для сторонних разработчиков.
→ https://www.pricesearcher.com

⚠️ Найдена уязвимость в WebKit IOS и MacOS девайсов(!) не переходите по незнакомым ссылкам из сообщений.


Видео:
https://youtu.be/9FthGZ6GhfU

Как устроено:
https://gist.github.com/pwnsdx/ce64de2760996a6c432f06d612e33aea

Разбор:
https://www.bleepingcomputer.com/news/security/new-css-attack-restarts-an-iphone-or-freezes-a-mac/

Вот и сентябрь пролетел. 🍁
Самые крутые темы за сентябрь и начало октября уже здесь.
За подборку библиотек JS спасибо @itsheavy.

Формат таких огромных постов в телеграме конечно ужасен.. я обязательно что-нибудь с этим придумаю.

==============================
[ Общие темы ]
==============================

Designing for suicidal users: preventing suicide the modern way.
Каждый месяц более полумиллиона человек ищут способы самоубийства в Google.
Автоматический ответ, который должен остановить их и спасти жизни, кажется безжизненным.
→ https://uxdesign.cc/preventing-suicide-the-modern-way-86a816e2bf07

Перевод от uxidesign.
→ https://telegra.ph/uxidesign-09-26


Разные подходы к сравнительному анализу конкурентов перед началом работы над продуктом.
→ https://eleganthack.com/comparative-research-done-right/

Работа тимлидом в 2018-ом году.
В подборке по дизайну я привел статью, где говорилось о вопросах, которые лучше не стоит задавать тимлиду.
Автор этой статьи расскажет о своем опыте работы на должности тимлида в компании по разработке сайтов.
+ статья разбита на главы, каждая из которых рассказывает об одной отдельной проблеме и её решению.
→ https://medium.com/webbdev/teamlead-fbbc99a9331b

Как я открыл кофейню и почему каждому дизайнеру стоит попробовать.
→ https://medium.com/@useitwrong/как-я-открыл-кофейню-и-почему-каждому-дизайнеру-стоит-попробовать-46a34993515c

==============================
[ Дизайн ]
==============================

Основные принципы анимации в UX.
«Анимация в интерфейсе должна отражать движения, которые мы встречаем в окружающем физическом мире — трение, ускорение и так далее. Подражание поведению объектов из реального мира позволяет пользователям понять, что им ожидать от интерфейса.»
Гениальная статья.
The ultimate guide to proper use of animation in UX
→ https://uxdesign.cc/the-ultimate-guide-to-proper-use-of-animation-in-ux-10bd98614fa9
Хороший перевод от VC:
→ https://vc.ru/design/46504-osnovnye-principy-ispolzovaniya-animacii-v-ux

И сразу в Apple.
Проблемы с анимациями приложений в macOS Mojave.
Посмотрите видео — это отдельная боль.
→ https://benjaminmayo.co.uk/marzipan

Различия в разработке дизайна нативных приложений iOS и Android.
→ https://telegra.ph/uxidesign-09-06

Простые и наглядные советы по написанию хороших названий для кнопок в интерфейсе.
Let’s do this! How to write better calls to action.
→ https://medium.com/deliveroo-design/lets-do-this-how-to-write-better-calls-to-action-ea534768b599

Подходы к быстрой авторизации через QR-код или одноразовый код в китайских мобильных приложениях.
→ https://www.nngroup.com/articles/mobile-login-china/

Проблемы форм с полями, расположенными в несколько колонок.
→ https://baymard.com/blog/avoid-multi-column-forms

О том, как создавался ColorBox.
Очень мощный и нереально крутой инструмент для подбора палитры.
Сам инструмент уже можно попробовать (ссылка в разделе с инструментами).
→ https://design.lyft.com/re-approaching-color-9e604ba22c88

Apple Apple Apple.. повсюду яблоки.. WatchOS 5 — это круто, а как там дела у Google c Wear OS?
Обзор с кучей скриншотов Wear OS 3.
→ https://www.engadget.com/2018/09/28/wear-os-3-review/

Ну и о новом дизайне Chrome.
Ребята реально делают сложные вещи.
→ https://medium.com/@san_toki/unboxing-chrome-f6af7b8161a2

Серия концептов дополненной реальности на базе Apple ARKit.
Вау! Почему это так круто выглядит?!
→ https://medium.com/@nathangitter/what-i-learned-making-five-arkit-prototypes-7a30c0cd3956

FramerX вылетел из beta в release.
Блог компании с новостью.
Там очень крутое видео, после которого захочется обмазаться Framer(-ом) с головы до ног.
→ https://framer.com/blog/posts/x-release/

Zach Johnston из Dropbox собрал несколько примеров того как команда Dropbox использует FramerX.
→ https://medium.com/dropbox-design/designing-with-real-data-5b64c0876858

Еще вышло сентябрьское обновление Adobe XD.. но я даже ссылок оставлять не хочу.

Sketch 52 находятся в бете
Обещают улучшение интерфейса и тёмную тему оформления.
Самое главное — упрощение работы с изменяемыми свойствами в символах
+ был намёк на упрощение вставки реальных данных в макеты.
Jon Moore в диком восторге, описал новый подход подробнее.
→ https://medium.com/ux-power-tools/the-sketch-update-weve-all-been-waiting-for-plus-a-brand-new-ux-power-tools-72c405fd490d

Travis Folck из Walmart рассказывает о их командной Sketch-библиотеке.
→ https://medium.com/walmartlabs/helping-designers-adhere-to-a-design-system-with-sketch-a14db5215096


Ну и Principle 4.0, куда же без него =)
Principle 4.0 — новые контроллеры для видео и многое другое..
→ https://principleformac.com/posts/principle-four.html

Инструмент контроля версий ваших дизайнов — Abstract.
→ https://www.goabstract.com
Продукт очень серьезно обновился и вот теперь я рекомендую его попробовать.
+ у них очень комичное видео о продукте.)

Темы которые никогда не стоит обсуждать с тимлидом.
→ https://telegra.ph/uxidesign-09-20

==============================
[ Разработка ]
==============================

Спецификация color-adjust в предложенном CSS Color Module Level 4 позволит контролировать отображение цвета на устройстве пользователя.
→ https://css-tricks.com/the-possibilities-of-the-color-adjust-property/

fetch
Метод fetch —  это XMLHttpRequest нового поколения. Он предоставляет улучшенный интерфейс для осуществления запросов к серверу: как по части возможностей и контроля над происходящим, так и по синтаксису, так как построен на промисах.
→ https://medium.com/webbdev/fetch-3d0b811ffcb5

JavaScript ES6: слабые стороны.
→ https://medium.com/webbdev/bad-es6-a0612c9fecf0

Node.js без node_modules.
На прошлой неделе разработчики Yarn (пакетного менеджера для Javascript) анонсировали новую фичу– Plug’n’Play установку. Эта возможность позволяет запускать Node.js проекты без использования папки node_modules, в которую обычно устанавливаются зависимости проекта перед запуском. Описание фичи декларирует, что node_modules больше не понадобится — модули будут загружаться из общего кеша пакетного менеджера.
→ https://medium.com/webbdev/node-24d7d0b7d967

Кнопка или ссылка?
Используйте для кнопок — кнопки, а для ссылок — ссылки.
→ https://medium.com/webbdev/кнопка-или-ссылка-56b6a7a71675

Могут ли PWA конкурировать c нативными приложениями?
→ https://medium.com/webbdev/могут-ли-pwa-конкурировать-c-нативными-приложениями-a4297bb58c27

5 приемов работы с CSS, о которых вам следует знать.
→ https://medium.com/webbdev/5-приемов-работы-с-css-о-которых-вам-следует-знать-c904d389e393

Определение среднего цвета изображения.
→ https://medium.com/webbdev/средний-цвет-в-javascript-3ccb4ff906d7

==============================
[ Dev Sources ]
==============================

Nanobar — очень легкие progress bar на чистом JS с полной кастомизацией.
→ https://nanobar.jacoborus.codes

Большая коллекция компонентов на ReactNative.
→ https://github.com/madhavanmalolan/awesome-reactnative-ui

Onsen UI — быстрый способ для создания кроссплатформенных приложений.
→ https://onsen.io

Crypto-js — библиотека, которая позволит использовать самые различные криптостандарты в вашем js коде.
→ https://github.com/brix/crypto-js

Math.js — очень мощная библиотека инструментов вычисления для JavaScript и Node.js.
→ https://mathjs.org

Tracking.js — библиотека основанная на компьютерном зрении и алгоритмах распознавания объектов различного типа.
Можно распознавать лица на видео в реальном времени прямо в web оболочке.
→ https://trackingjs.com

js.cytoscape — библиотека для построения различных (простых и сложных) графов и схем
Схема развязки железных дорог в Токио выглядит пугающе и завораживающе одновременно.
→ https://js.cytoscape.org


==============================
[ Инструменты ]
==============================

ColorBox.io — палитра про которую я писал выше.
→ https://www.colorbox.io

Application Shortcut Mapper — visual shortcuts explorer for popular applications.
Веб-тулза, которая покажет вам все шорткаты для популярных приложений.
Продукты от Adobe, JetBrains и других любимых нами компаний уже есть.
→ https://waldobronchart.github.io/ShortcutMapper/#AdobePhotoshop

FakeClients — инструмент для набивания дизайнерской руки.
Сайт даст вам вполне реальное задание от не существующего заказчика.
→ https://fakeclients.com/

Собрал дайджест за октябрь 2018 —
https://medium.com/developers-notes/digest-4-97e4859fdd99

https://chartify.io — крутой инструмент для построения диаграмм.

​​Собрал дайджест за ноябрь 2018

Получилось много и круто!

Читается за 8 минут (по расчетам Medium)
Писалось очень долго 🙄

Если есть что написать — @devstorm
Всегда к вашим услугам 🙂

Читать на Medium

​​Шрифты Times New Roman и Arial попали под антироссийские санкции.
Чиновники больше не смогут их использовать для создания PDF/A файлов.

Подробнее

​​​​Собрал дайджест за декабрь 2018 (не совсем)

Получилось много и как всегда круто!

Решил немного изменить формат. Я еще в поисках необходимой консистенции для этого зелья. ⚗️

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

Еще появилась новая рубрика.. но об этом уже внутри 😉
Читать на Medium