Вообще много красоты повидал, пока копался в оптимизации картинок для публикации. Еще в январе рассказывал про чудесную вселенную багов и глитчей, которую я бережно складываю в папочку (https://news.1rj.ru/str/meow_design/195).
Telegram
мяу-дизайн
В 2013 году на интенсиве в Британке один преподаватель рассказывал, что он очень любит и уважает дизайн-работу, проводимую в реальном мире (вырезать фигуры из бумаги, делать объемые конструкции и т.д.), даже если они всё равно потом переходят в плоскость…
Надеюсь, не разрушил ощущение магии от ознакомпления с книгой, показав происходящие под капотом веб-версии штуки. Привет Маше, читающей канал, отличные картинки вышли и анимашки супер!
Ах да, совсем забыл рассказать про главную магию. В титрах веб-версии полноценным соавтором числится фотошоповский Content-Aware, и это не преувеличение: его вклад в книжку не меньше нашего с Машей.
Дело в том, что для печатной книжки у нас были готовы иллюстрации в портретной ориентации, а большинство экранов, за исключением смарфтонов, очень явно вытянуты по горизонтали, и непонятно, как вставлять вертикальные картинки в горизонтальный экран без чувства лажи. Если расстягивать на весь экран по ширине, то одна картинка займет четыре экрана скрола, и ощущение, будто разговариваешь с человеком с расстояния 2 сантиметра: видно все прыщи и морщины, а лица в общем не видишь. Просто впихивать картинку по высоте экрана с пустотами по бокам тоже уныло, поэтому мы приняли решение удлинить картинки по бокам. Но Маше троекратно дорисовывать уже законченные по композиции картинки было бы утомительно и долго, поэтому силы Маши были направлены на анимация, я расстягивание картинок было доверено расширяющему фотошоповском кропу с галочкой content-aware. Так и получились чудеса, отсутствующие в печатной версии книжки. Потом мы этим же способом растянули иллюстрации по вертикали, чтобы создать бесшовные переходы градиентом и обойти этот унылый формат с парадом чередующихся прямоугольников картинок и абзацев текста.
Дело в том, что для печатной книжки у нас были готовы иллюстрации в портретной ориентации, а большинство экранов, за исключением смарфтонов, очень явно вытянуты по горизонтали, и непонятно, как вставлять вертикальные картинки в горизонтальный экран без чувства лажи. Если расстягивать на весь экран по ширине, то одна картинка займет четыре экрана скрола, и ощущение, будто разговариваешь с человеком с расстояния 2 сантиметра: видно все прыщи и морщины, а лица в общем не видишь. Просто впихивать картинку по высоте экрана с пустотами по бокам тоже уныло, поэтому мы приняли решение удлинить картинки по бокам. Но Маше троекратно дорисовывать уже законченные по композиции картинки было бы утомительно и долго, поэтому силы Маши были направлены на анимация, я расстягивание картинок было доверено расширяющему фотошоповском кропу с галочкой content-aware. Так и получились чудеса, отсутствующие в печатной версии книжки. Потом мы этим же способом растянули иллюстрации по вертикали, чтобы создать бесшовные переходы градиентом и обойти этот унылый формат с парадом чередующихся прямоугольников картинок и абзацев текста.
То есть все «Стало» получены из «Было» практически без участия человека. Content-Aware топчик, слава роботам, конец кожаных ублюдков близок.
мяу-дизайн
Два скриншота из iMovie, сделанных с разницей 3 года. (Подсказка: ничего не поменялось, пункты меню по-прежнему не прочитать). Надеюсь, хотя бы в презентующейся завтра темной теме от этого избавятся.
Прогресс в новой айоси с этим меню всё же есть. Может к iOS 20 станет возможно прочитать.
Новый формат меню шеринга стал «немым», так как он не подсказывает в свернутом состоянии о то, что он там внизу вообще есть. Вот сравните два варианта: на леовй картинке внизу спрятан новый вариант меню с горизонтальными пунктами, а на правой стандартные «квардатные» пункты, которые были в прошлой версии. По какому из них понятно, что там внизу есть продолжение панели? При этом раньше, насколько я помню, меню сразу показывалась полностью, но в новой айоси появилась доволнительная верхня строка с самыми популярными вариантами, и из-за этого решили ее сделать выдвигаемой.