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