Подписка на блог

В Телеграме помимо ссылок на заметки делюсь околодизайнерскими наблюдениями.

В Твиттере помимо ссылок на заметки пишу всякую чушь.

В Тумблере и Же-же есть автоматические трансляции. Если не работает, напишите мне: ilyabirman@ilyabirman.ru.

По РСС и Джейсон-фиду трансляции для автоматических читалок

Эпл

 1 комментарий    303   25 сентября   видео   Эпл

Что посмотреть с ВВДЦ 2016—2018

Я собирался опубликовать заметку о ВВДЦ—2016 два года назад, но забыл. Я собирался опубликовать заметку о ВВДЦ—2017 год назад, но поленился. А теперь уже прошло ВВДЦ—2018, так что опубликую всё вместе. Если вам влом читать длинную заметку, то посмотрите хотя бы доклад 803 с ВВДЦ-2018, про анимации на десятом Айфоне.

Начнём с того, что ВВДЦ — недельная эпловская конференция, а не только доклад о новых продуктах, с которого она начинается. Кроме этого главного доклада (Keynote) там проходят ещё десятки других докладов о технологиях, дизайне, маркетинге и чёрт знает чём ещё. Поэтому после завершения недели ВВДЦ имеет смысл поставить приложение ВВДЦ из Апстора и посмотреть видосы всего, что покажется интересным.

Обязательная программа

На любой ВВДЦ я обязательно сначала смотрю вот эти доклады, которые проходят каждый год. Здесь ссылки ведут на 2018:

101. Keynote. Это то, что смотрят все. Тим Кук, анонсы для журналистов, все дела.

102. Platforms State of the Union. Это такой продвинутый кейноут. Тут рассказывают о том, какие новые фичи для разработчиков появились на всех платформах и как прикрутить к своим приложениям те новые штуки, о которых рассказали в главном докладе. В некоторых старых ВВДЦ это ещё называлось Platforms Kickoff.

209. What’s New in Cocoa for macOS. Раньше это просто называлось What’s New in Cocoa. Детально про всё новое в Макосе. В прошлом году из этого я узнал, что в Хай-Сьерре дали пользователю перетаскивать несистемные элементы правой стороны меню. В этом году было интересно про новый тёмный режим, который появится в Мохаве.

202. What’s New in Cocoa Touch. В этом году важно про Siri shortcuts. А вообще это про всё новое в Ай-ОСе.

Если вы разрабатываете для часов или ТВ, имеет смысл так же смотреть сессии What’s New про эти платформы.

ВВДЦ—2016

Самое интересное для меня:

403. Swift API Design Guidelines. The Grand Renaming. Это самая клёвая сессия, про дизайн АПИ:

712. Working with Wide Color. Посмотрел, чтобы быть лучше готовым к светлому будущему, когда основы перевернутся и в вебе тоже. Сколько же всего приходится взорвать в системе, чтобы поддержать другую цветовую модель!

701. Introducing Apple File System. A snapshot of the next generation in storage. Давно жду новую файловую систему, поэтому было интересно. Снэпшоты кайф, должны сильно улучшить тайм-машину, а ещё, вероятно, сделают возможным лёгкую реализацию многопользовательскости на айпадах.

Ещё разное:
208. What’s New in watchOS 3. Много интересного про дизайн и для дизайнеров. Порадовала идея вместо прогрессбара («делаем...») показывать галочку («задание принято!»), чтобы дать человеку спокойно опустить руку. Я потом про это рассказывал в каких-то своих докладах про обратную связь.

217. Introducing SiriKit. Hey Siri, say hello to apps. Было интересно, как оно спроектировано. Плата за простоту подключения — негибкость. Ни к Ангстрему, ни к Правилам русского языка, например, не прикрутить.

705. How iOS Security Really Works. Интересно для общего развития. Чувак порадовал: «Злоумышленники устанавливают на ваши телефоны кейлоггеры, шпионские программы, неотключаемую рекламу. Откуда мы это знаем? Мы это видим на других платформах».

ВВДЦ—2017

Самый запомнившийся доклад:

803. Designing Sound. Очень клёво! Чувак играет на живых инструментах рингтоны Айфона. Самый любимый момент — про звук уведомлений на часах:

Остальное:
823. Designing Glyphs.

802. Essential Design Principles. Ну прям почти по темам моей интерфейсной книги, начиная с человечности. Потом говорит о взгляде новичка, обратной связи, visibility (у нас более глубокая тема «Информативность»), consistency (у нас есть темы «Последовательное волшебство» и «Привычка»), теория близости и группировка (у нас это одна тема). Порядок, в котором он говорит о принципах, довольно случайный, а примеры — суперабстрактные. Лучше приходите на мой курс или подписывайтесь на книгу!

503. Introducing HEIF and HEVC. Подробно про новые форматы видео и картинок: почему они лучше, как система их поддерживает, как обеспечивается совместимость. Интересно для общего развития.

301. Introducing the New App Store. Подробно про большой редизайн Апстора.

715. What’s New in Apple File System. Как эплы незаметно и без проблем заменили файловую систему миллионов дивайсов.

815. How to Pick a Custom Font.

ВВДЦ—2018

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

703. Introducing Create ML. Как можно использовать машинное обучение в ваших программах. Рекомендую дизайнерам смотреть, чтобы понимать, что, оказывается, уже можно довольно легко делать, вовсе не будучи Гуглем или Яндексом (классифицировать фоточки и текст, например).

Самое классное про дизайн:
803. Designing Fluid Interfaces. Докладывает чувак, который дизайнил анимации для 10-го айфона. Разбирает по косточкам, показывает в слоумо. Когда я купил десятку, я сам очень долго пытался разобраться в том, что там происходит, а тут супернаглядно. Просто кадр:

801. The Qualities of Great Design. Интересно про самое понятие «качество» и про то, почему мы ценим качественное. А отдельно интересна сама форма доклада: девушка назадавала вопросов коллегам, ставит аудиофрагменты их ответов и комментирует. Зачем-то поставила два пробела между словами:

210. Introducing Dark Mode. Всё про новый тёмный режим: как подбираются цвета, как рисуются темы, как адаптируются иконки. Тёмный режим — это не просто инверсия светлого, там вообще всё по-другому.

218. Advanced Dark Mode. Более задротская версия предудыщего доклада.

Остальное:
239. Designing Web Content for watchOS. Вотч-ОС 5 научится показывать веб-странички на часах. Короткое видео о том, как к этому подготовиться.

804. The Life of a Button. Довольно занудный доклад про то, о чём нужно думать, когда дизайнишь кнопку. Но правда в том, что обо всём этом действительно нужно подумать.

811. Presenting Design Work.

233. Adding Delight to your iOS App. Не рекомендую. Добавил в список, потому что вас, как меня, могло подкупить название. Я ожидал, что там будет что-нибудь про клёвые анимации или звуки. А там про какие-то фичи типа использования внешнего экрана по Эйрплею. Лучше смотреть 803, короче.

713. Introducing Natural Language Framework. Можно научить программу понимать разное про текст: тему, настроение, упомянутые объекты и всё такое.

См. также заметку о докладе с ВВДЦ-2015 о новых системных шрифтах.

Бен Томпсон про Эпл и Амазон

Хорошо:

I mean it when I say these companies are the complete opposite: Apple sells products it makes; Amazon sells products made by anyone and everyone. Apple brags about focus; Amazon calls itself «The Everything Store». Apple is a product company that struggles at services; Amazon is a services company that struggles at product. Apple has the highest margins and profits in the world; Amazon brags that other’s margin is their opportunity, and until recently, barely registered any profits at all. And, underlying all of this, Apple is an extreme example of a functional organization, and Amazon an extreme example of a divisional one.

 1 комментарий    1039   2018   цитаты   Эпл
 нет комментариев    2615   2018   видео   Эпл

Телеграм за неделю 11—15 сентября 2017

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

Понедельник, 11 сентября

Илья Страйков показывает невероятно красивую неведомую панель управления:

Смотрите, мы опубликовали карты Московского марафона и других забегов серии:
http://bureau.ru/projects/moscow-marathon/

Обязательно идите смотреть в ведро (кажется, одно из самых длинных на сайте). Начало всегда смотрится особенно страшно:
http://bureau.ru/projects/moscow-marathon/recycled/

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

А в реальности всё изменилось, и сейчас уже выглядит так:

Вторник, 12 сентября

Номер дома можно написать вот так:

Читатель Антон Репушко: «Привет. По поводу номеров домов: так уже делают где-то в России. Не знаю, что за город на фото» —

Ну, не совсем так, конечно. Но тоже можно.

В сегодняшнем совете про транспортные схемы расказываю штуку про планирование маршрутов:
http://bureau.ru/bb/soviet/20170912/

При этом забыл рассказать Александру, что у него прикольное обозначение парков:

Новости веб-дизайна. Эпл осознал, что прокрутка круче карусели, и выпустил нормальную главную страницу:
https://apple.com/

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

Но вот во всяких таких штуках я не был уверен до презентации:

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

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

О, спасибо всем, кто прислал картинку. Я вот эту имел в виду:

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

Надеюсь, к Ай-ОСу 12 сделают редизайн статус-ушей такой, чтобы смотрелись получше.

Ещё картинка:

Я уверен, что первое ощущение у большинства, что справа лучше (у меня первое ощущение такое же, конечно). Но это не лучше, это лишь привычнее. Помедитируйте над этими картинками, если сомневаетесь. И будьте смелее :-) Если внедряете чё-то новое, внедряйте нагло.

Бонус: видимо, на Айфоне 10 нельзя включить отображение батарейки в процентах. Отлично! А что с остальными индикаторами? Я пока не знаю, но геолокацию, например, можно показывать вместо сигнала, когда она используется. Блокировку поворота можно и не показывать. Блутус должен быть просто всегда включён, и нефиг это показывать.

А вот другая картинка, которая кажется ещё более странной:

Это кадр из видоса Эпла, где они объясняют, как горизонтальным приложениями себя вести (тут речь о полях слева и справа, чтобы текст не подлез под выкус). Тоже сначала кажется, что пипец. Самое некрасивое тут — это как верхняя полоска отрезается скруглениями. Хочется её сделать побольше в высоту, и тогда вроде будет окей.

Но попробуйте смотреть на эту картинку чуть иначе. Это не экран такой вот странной формы. Представьте, что айфон — это просто дырка, и вы в неё видите реальность. То есть картинка уходит дальше за края, но вы просто видите вот такой её кусок. Тогда сразу становится нормально.

Уверен, после пары дней с Айфоном 10 человек просто перестанет замечать эти скругления и выкус, а будет воспринимать картинку целиком, вместе с «невидимыми» частями.

Читатель Иван Акулов: «А это в новых айфонах ты видел, кстати?».

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

Воскресенье, 17 сентября

Студия Лебедева издала книгу Пола Рэнда «Искусство дизайнера» (я не читал):
https://www.artlebedev.ru/izdal/iskusstvo-dizaynera/

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

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

Читателю этот излом в абзаце на правой странице в теории должен говорить «это продолжение текста из левой страницы». На практике же он говорит «у верстальщика руки из жопы».

В Студии Лебедева верстальщики в сто раз круче, чем я, разумеется, и об их профессионализме вообще речь не идёт. Но просто следование этой нелепой традиции приводит к фиговому результату.

Как быть? Есть два железобетонных варианта.

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

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

Но второй вариант выглядит не очень красиво, потому что, ну, нафига нам эти выкусы у прямоугольников, если и так видно, что это абзац?

А первый вариант может не подходить, если мы почему-то не хотим использовать швейцарский абзац (ну, мало ли) :-)

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

Выглядит так:

(У нас как раз тот случай, когда швейцарский абзац мы не хотим использовать просто потому что не хотим — такую мы выбрали эстетику для серии учебников.)

Текст справа продолжает текст слева, ну и ладно. Угол выкусывать не надо, потому что и так видно, что это другой кусок текста, чем тот, что слева.

После заголовка абзацу тоже не нужен выкус, только после абзаца (p):

[В развороте Рэнда] если первую строчку правой страницы сдвинуть левее, станет лучше со всех точек зрения. Нужно просто решиться отказаться от фиговой недодуманной традиции в пользу нормальной.

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

Теперь я понял, что я бы хотел, чтобы архив телеграма оставался у меня в блоге. Хорошо бы, чтобы в каждый воскресный вечер выходила заметка. Ну или раз в две недели, если неделя выдалась не очень активная. Собирать такую заметку регулярно мне некогда. Если вы вдруг готовы вечером воскресенья приносить мне заметку, чтобы я просто опубликовал, напишите, пожалуйста. Я вам расскажу, как всё делать. И да, я бы опубликовал задним числом более ранние недели тоже.

Что почитать на выходных — 155

Вот:

  1. Тарифы без сносок для Модульбанка. Люда Сарычева навела порядок.
  2. Leaked recording: Inside Apple’s global war on leakers. Непонятно, откуда материал для статьи.
  3. WWDC 2017 — Some Thoughts. Стивен Синофский комментирует ВВДЦ.
  4. Выигрывает всегда казино. Никита Прокопов о дизайне Букинг.кома.
  5. Выключка по знаку. Игорь Штанг.

Хотите стать спонсором рубрики? Пишите: ilyabirman@ilyabirman.ru

 16   2017   дизайн   типографика   чтиво   Эпл

Как сделать окно браузера нужного размера?

Когда я написал про окно Бирмана, у меня спросили, как я делаю окно браузера ровно 1024 в ширину. Разумеется, встроенными средствами компьютера. Я просто захожу в меню скриптов и нажимаю там нужный пункт:

Как сделать окно браузера нужного размера?

Но откуда у меня взялось это меню вместе с пунктами? Я просто написал скрипты. Запускаете редактор скриптов:

Как сделать окно браузера нужного размера?

Пишете в нём что-нибудь в таком духе:

tell application "System Events"
	set frontMostApp to (name of first process where frontmost is true)
end tell

tell application frontMostApp
	set allWindows to (every window where visible is true)	
	set frontWindow to item 1 of allWindows
	tell frontWindow
		set bounds to {0, 21, 1024, 1557}
	end tell
end tell

И сохраняете. Теперь при запуске этого скрипта активное окно будет становиться нужного размера. Но это скорее всего будет Файндер, ведь вы из него запустили скрипт. Поэтому идёте в настройку редактора скриптов и включаете там меню скриптов снизу:

Как сделать окно браузера нужного размера?

Заходите в это меню, жмёте Open Scripts Folder → Open User Scripts Folder. Перемещаете свой файл скрипта в эту папку — и всё, этот скрипт показывается в меню.

Таким образом можно делать любые скрипты для любых приложений, например у меня несколько полезных для Айтюнса написано:

Как сделать окно браузера нужного размера?

Пользуйтесь компьютером для автоматизации всего. Его специально для этого придумали. Я это ещё писал тысячу лет назад, когда можно было только дебильным Эплскриптом пользоваться, а сейчас там уже Джаваскрипт работает.

Фил Шиллер и Крег Федериги снова в гостях у Джона Грубера

Это становится традицией:

При обновлении на Ай-ОС 10.3 произошло невероятное: сотни миллионов устройств во всём мире перешли на новую файловую систему АПФС, и пользователи даже не заметили этого. Это как если бы в вашем доме заменили фундамент, пока вы играли в дженгу. Крег рассказывает, что апдейты 10.1 и 10.2 на самом деле тоже конвертировали систему в АПФС, проверяли, что всё на месте, и присылали в Эпл отчёт, прошла ли конвертация гладко, но оставляли старую систему (чтобы понять, как это вообще возможно, нужно знать немного об устройстве АПФС).

А ещё Джон рассказал, что когда начали показывать Аймак-про, ему пришла СМС от Билла Эванса (из пиар-службы Эпла): «Это не Мак про, если что».

 4   2017   видео   Эпл
Ранее Ctrl + ↓