Forwarded from Kostya Gorsky’s Channel
Хорош ли дизайн Airbnb? Да, божественен.
Правило: без метрик никуда, но метрики важны и хороши только до тех пор, пока не затмевают сознание, чувство прекрасного и результаты других видов исследований.
Правило: без метрик никуда, но метрики важны и хороши только до тех пор, пока не затмевают сознание, чувство прекрасного и результаты других видов исследований.
С Новым годом, один подписчик!
Вот когда-нибудь через годик другие подписчики удивятся, покрутив эти сообщения на экран вверх, а там 2017.
— Ты что всё это время делал, ленивая жопа?
Вот когда-нибудь через годик другие подписчики удивятся, покрутив эти сообщения на экран вверх, а там 2017.
— Ты что всё это время делал, ленивая жопа?
Forwarded from Плавучая редакция
Свой текст
Чем больше сил вложено в работу, тем более ценной она кажется.
Это главное когнитивное искажение для автора и редактора. Даже если вы редактируете чужой текст, через какое-то время он будет казаться лучше. Но ваши правки могут быть ни при чем.
Как бороться?
— Просить кого-нибудь прочитать текст, перед тем как публиковать.
— Подождать день-два, пока эмоциональное отношение не остынет.
— Все время спрашивать себя: а нет ли тут моего искажения.
Чем больше сил вложено в работу, тем более ценной она кажется.
Это главное когнитивное искажение для автора и редактора. Даже если вы редактируете чужой текст, через какое-то время он будет казаться лучше. Но ваши правки могут быть ни при чем.
Как бороться?
— Просить кого-нибудь прочитать текст, перед тем как публиковать.
— Подождать день-два, пока эмоциональное отношение не остынет.
— Все время спрашивать себя: а нет ли тут моего искажения.
Вчера сделал иконку Телеграма для macOS на замену стандартной. Почему-то для некоторых программ дизайнеры делают иконки, вписанные в круг. Иногда это можно оправдать масштабом программы. iTunes — музыка, кино, программы, подкасты и ещё куча всего. iBooks — книги, журналы, комиксы, брошюры. Safari — окно в мир. Но если ты мессенджер, нафиг тебе иконка в круге? В случае с Телегой форма знака получилась вполне устойчивая. Меняйте стандартную в круге на мою без круга.
https://dribbble.com/shots/4405702
1. Скачайте icns по ссылке,
1. Правый клик по Telegram․app → Свойства,
2. Перетащите icns поверх иконки в свойствах,
3. Перезапустите Телегу.
https://dribbble.com/shots/4405702
1. Скачайте icns по ссылке,
1. Правый клик по Telegram․app → Свойства,
2. Перетащите icns поверх иконки в свойствах,
3. Перезапустите Телегу.
Если вы когда-нибудь встречали на сайтах красивую навигацию по каталогам, похожую на FTP, например, как The Panic File Museum или Louie Mantia's Reserve, спешу обрадовать: сделать такую же довольно просто.
1. Включите directory listing для нужного вам каталога в nginx:
http://nginxlibrary.com/enable-directory-listing/
2. Оформите листинг каталогов с помощью CSS:
https://www.linickx.com/css-styling-nginx-directory-listings
Теперь на вашем сайте можно давать ссылку на раздел Downloads, не создавая при этом специальных страниц. Просто заливайте файлы в нужный каталог, всё автоматически красиво покажется посетителю.
1. Включите directory listing для нужного вам каталога в nginx:
http://nginxlibrary.com/enable-directory-listing/
2. Оформите листинг каталогов с помощью CSS:
https://www.linickx.com/css-styling-nginx-directory-listings
Теперь на вашем сайте можно давать ссылку на раздел Downloads, не создавая при этом специальных страниц. Просто заливайте файлы в нужный каталог, всё автоматически красиво покажется посетителю.
@CitoyenMarat скинул ссылку, которой грех не поделиться. В огромной технической статье рассказывается, как устроены разные форматы изображений, способы их сжатия и оптимизации: https://images.guide
Там про JPEG, PNG, WebP, GIF, MozJPEG и ещё кучу всего малоизвестного. Про то, как готовить картинки для веба и как они обрабатываются браузерами. Приводятся полезные инструменты и техники. Я, как большой любитель оптимизации, хочу рассказать о своём флоу и трёх инструментах.
ImageOptim
https://imageoptim.com
Известное многим приложение и API для оптимизации картинок без потери качества. У меня выбраны там все возможные способы, а скорость выставлена на «безумную». Я могу потерпеть долгую процедуру, лишь бы результат был безупречным. Скармливаю ImageOptim обычно PNG, JPEG и GIF, пропуская через несколько циклов (зачастую повторные оптимизации тоже удаются), — любую растровую графику, которая будет использоваться внутри приложений или на сайтах.
SVGOMG
https://jakearchibald.github.io/svgomg
Веб-интерфейс для утилиты SVGO, через который готовлю к использованию вектор. Грубо говоря, из файла вырезаются лишние метаданные, а также уменьшается точность координат (округляются знаки после запятой). Можно смело включать там все параметры, кроме “Sort attrs”. Его советую переключать и смотреть, экономит он или, наоборот, прибавляет вес файлу. Также будьте осторожны с ползунком про степень оптимизации: призумьте превью и двигайте ползунок влево, а когда увидите визуальные искажения кривых, верните на 1 шаг правее — это нужный вам уровень. Почему-то недавно там сломалась опция “Remove xmlns”, теперь она делает картинку белой на превью. Но из SVG-файла можно безболезненно убрать эту штуку руками, на изображение она никак не влияет. SVGOMG не доводит SVG до идеала, после оптимизации я открываю файл в текстовом редакторе и вручную сокращаю #ff0000 → #f00, убираю переносы строк, теги g, defs и прочее лишнее типа fill-rule="evenodd" (формат SVG легко читается).
ShrinkIt
https://download.panic.com/shrinkit
В статье не упоминается утилита, с помощью которой можно оптимизировать PDF, ведь его мы тоже используем как самостоятельный формат и даже в Xcode как графику для iOS-приложений. Это простое окошко, куда перетаскиваешь файл, и он перезаписывается уже оптимизированным.
Может показаться, что все эти кропотливые процедуры ради экономии жалких килобайтов — одержимость, и что они не нужны. Но это не так, ведь это забота о ваших пользователях:
1. Вы экономите людям трафик,
2. Приложения скачиваются быстрее,
3. Сайты рендерется мгновенно.
Там про JPEG, PNG, WebP, GIF, MozJPEG и ещё кучу всего малоизвестного. Про то, как готовить картинки для веба и как они обрабатываются браузерами. Приводятся полезные инструменты и техники. Я, как большой любитель оптимизации, хочу рассказать о своём флоу и трёх инструментах.
ImageOptim
https://imageoptim.com
Известное многим приложение и API для оптимизации картинок без потери качества. У меня выбраны там все возможные способы, а скорость выставлена на «безумную». Я могу потерпеть долгую процедуру, лишь бы результат был безупречным. Скармливаю ImageOptim обычно PNG, JPEG и GIF, пропуская через несколько циклов (зачастую повторные оптимизации тоже удаются), — любую растровую графику, которая будет использоваться внутри приложений или на сайтах.
SVGOMG
https://jakearchibald.github.io/svgomg
Веб-интерфейс для утилиты SVGO, через который готовлю к использованию вектор. Грубо говоря, из файла вырезаются лишние метаданные, а также уменьшается точность координат (округляются знаки после запятой). Можно смело включать там все параметры, кроме “Sort attrs”. Его советую переключать и смотреть, экономит он или, наоборот, прибавляет вес файлу. Также будьте осторожны с ползунком про степень оптимизации: призумьте превью и двигайте ползунок влево, а когда увидите визуальные искажения кривых, верните на 1 шаг правее — это нужный вам уровень. Почему-то недавно там сломалась опция “Remove xmlns”, теперь она делает картинку белой на превью. Но из SVG-файла можно безболезненно убрать эту штуку руками, на изображение она никак не влияет. SVGOMG не доводит SVG до идеала, после оптимизации я открываю файл в текстовом редакторе и вручную сокращаю #ff0000 → #f00, убираю переносы строк, теги g, defs и прочее лишнее типа fill-rule="evenodd" (формат SVG легко читается).
ShrinkIt
https://download.panic.com/shrinkit
В статье не упоминается утилита, с помощью которой можно оптимизировать PDF, ведь его мы тоже используем как самостоятельный формат и даже в Xcode как графику для iOS-приложений. Это простое окошко, куда перетаскиваешь файл, и он перезаписывается уже оптимизированным.
Может показаться, что все эти кропотливые процедуры ради экономии жалких килобайтов — одержимость, и что они не нужны. Но это не так, ведь это забота о ваших пользователях:
1. Вы экономите людям трафик,
2. Приложения скачиваются быстрее,
3. Сайты рендерется мгновенно.
Есть такое соревнование программистов, когда нужно в минимальный объём данных упаковать некое аудиовизуальное представление. Это называется demoscene, у неё бывают разные «весовые категории»: 4 КБ, 64 КБ, несколько мегабайтов и т. д. Бывают разные дисциплины: клип, компьютерная игра, музыкальная композиция, технология и пр.
Я наблюдаю за демосценой с начала двухтысячных. Самые крупные демопати, типа Assembly, ежегодно собирают несколько тысяч участников и зрителей со всего мира.
Сами работы — это нечто среднее между программированием и перформансом. Представьте, что существует компьютерная игра-шутер, напичканная графическими технологиями, с несколькими уровнями и выбором оружия, которая занимает всего 64 килобайта. Это kkrieger, сделанная немецкой командой Farbrausch (работает только на Windows). Зацените их психоделический клип debris, упакованный в 177 КБ.
Чтобы добиться такого результата, используются процедурно сгенерированные текстуры и сцены, системы частиц, синтезированная процессором музыка, невероятная компрессия кода и ещё какая-то программистская магия.
Каждая составляющая такого продукта — отдельное маленькое произведение искусства. Взять хотя бы музыку. Композиторы сочиняют её, используя особенности синтезирования разных старых процессоров, а чтобы сохранить стиль, эмулируют их. Попробуйте послушать мой любимый трек Flower Power:
1. Установите MilkyTracker:
https://github.com/milkytracker/MilkyTracker/releases
2. Скачайте и запустите трек:
https://tlgur.com/d/X4z0pYpG
3. Нажмите Enter и насладитесь маленьким чудом, на которое способен ваш компьютер.
Если интересно, тут можно найти кучу инфы и скачать демки:
http://www.demoscene.info
https://www.reddit.com/r/demoscene
http://www.pouet.net
Или можно посмотреть всё на Ютюбе по запросу demoscene, вот целый плейлист, например:
https://www.youtube.com/watch?v=zxpwiMD1Bb8&list=PL9HVvEQXdWVb_Nakad9URLWoP6sngpWj1&index=3
Я наблюдаю за демосценой с начала двухтысячных. Самые крупные демопати, типа Assembly, ежегодно собирают несколько тысяч участников и зрителей со всего мира.
Сами работы — это нечто среднее между программированием и перформансом. Представьте, что существует компьютерная игра-шутер, напичканная графическими технологиями, с несколькими уровнями и выбором оружия, которая занимает всего 64 килобайта. Это kkrieger, сделанная немецкой командой Farbrausch (работает только на Windows). Зацените их психоделический клип debris, упакованный в 177 КБ.
Чтобы добиться такого результата, используются процедурно сгенерированные текстуры и сцены, системы частиц, синтезированная процессором музыка, невероятная компрессия кода и ещё какая-то программистская магия.
Каждая составляющая такого продукта — отдельное маленькое произведение искусства. Взять хотя бы музыку. Композиторы сочиняют её, используя особенности синтезирования разных старых процессоров, а чтобы сохранить стиль, эмулируют их. Попробуйте послушать мой любимый трек Flower Power:
1. Установите MilkyTracker:
https://github.com/milkytracker/MilkyTracker/releases
2. Скачайте и запустите трек:
https://tlgur.com/d/X4z0pYpG
3. Нажмите Enter и насладитесь маленьким чудом, на которое способен ваш компьютер.
Если интересно, тут можно найти кучу инфы и скачать демки:
http://www.demoscene.info
https://www.reddit.com/r/demoscene
http://www.pouet.net
Или можно посмотреть всё на Ютюбе по запросу demoscene, вот целый плейлист, например:
https://www.youtube.com/watch?v=zxpwiMD1Bb8&list=PL9HVvEQXdWVb_Nakad9URLWoP6sngpWj1&index=3
