Details of the vector version after tracing / Детали векторной версии после трейсинга
  
Illustration
After I receive the illustration from the artist, I make compositional corrections and work on the background for lettering in Photoshop. To make the result clear I put the most successful sketch on the illustration and, as with stencil, I give it space, so that there is no mess (for more look below). After that the illustration is sent for scanning and vector tracing in Adobe Illustrator. It’s important to adjust the parameters of the tracing correctly in the illustrator to make the picture look good in all dimensions and, at the same time, doesn’t lose its details. 

После получения иллюстрации от художника, я занимаюсь композиционными правками и работаю с фоном для своей надписи в Фотошопе. Для этого на иллюстрацию я накладываю наиболее удачных набросок и, как по трафарету, даю ему пространство, чтобы не было каши (подробнее ниже). После этого иллюстрация отправляется на сканирование и векторную трассировку в Adobe Illustrator. Важно правильно настроить параметры трейсинга в иллюстраторе, чтобы рисунок выглядел хорошо в любых размерах и, в то же время, не потерял своих деталей. 



   
As usual work requires compliance with certain frameworks — whether it is commercial or not. Sometimes these limitations are associated with specific features of each project and with a bounded number of tools in the designer’s arsenal. When the work consists of several elements, the main condition for high-quality result is the unity of all components. In this case, the illustration and inscription clash was solved using the software brushes, a harmonious background was created, the composition of the illustration was aligned. 

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



Searching of colour // Поиск цвета

    
Traditionally I work with brushpen and then make Photoshop processing. It’s very important to prepare a sketch for the vector: those designers who have little experience with illustrator give bad result because of middling draft. In vector I try to use few reference points to make the lettering even. Horizontal and vertical curves help me a lot. After the work on the inscription and illustration is over, I send my work for reconciliation, after that to motion designer for the last step.

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

   
   
Chosen brush sketch / Выбранный набросок кистью
   
   
Motion design 
My pipeline is quite simple: at first I try to find a context in which the animation may be. For example, if a client builds houses, we may animate the elements like bricks that texture the final drawing. There are many similar examples, depending on client tasks. As the social network is almost entirely a software product, I suggested the animation that shows on through the program code, or glitch-effect, which for some reason is still popular. But the team wasn’t OK with it, so we decided to use the watercolor stains technique. We’ve already applied it in the project with stickers for the "! NoKids" store. However, I wanted to add a highlight, — and Zinger's dome was lit up as in reality. 

Мой процесс довольно прост: сначала я пытаюсь найти тематический контекст, в рамках которого можно анимировать материал. Например, если клиент строит дома, можно анимировать элементы подобно кирпичикам, которые выстраиваются в конечный рисунок. Можно привести множество подобных примеров в зависимости от рода деятельности клиента и задачи.  В связи с этим, я предложил команде анимацию проявления с помощью программного кода, так как социальная сеть является почти целиком программным продуктом, или глитч-эффекта, который по какой-то причине еще популярен. Но эти варианты не устроили ребят, и мы решили использовать прием проявления «акварельными разводами», как мы сделали в проекте со стикерами для магазина «!NoKids». Однако добавить изюминку хотелось: купол Зингера засветился как в реальности.


Sometimes the plot of animation is directly connected with the image component of the company for which it is created. So as here: from the whole flow of ideas, it’s necessary to filter out even interesting variants, if its ambiguity does not benefit the client. Such a glitch can be associated with bugs and social network disruptions, so we decided to look for other techniques.

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



Layer's pannel of the animation / Панель слоёв анимации

Lettering animation shouldn’t be too complicated. A feature of a good one is its invisibility, so moving the lettering intricately doesn’t make any sense. There is some action on a screen: everything is spinning, flying off from each other, the elements are transformed one from another during fly — nothing is clear, but looks very beautiful. This is a cool animation. It was important for me to make viewers focus not on any particular letter, but on the whole word. The action should be swift, catchy and compositionally correct. The team sought to create a harmonious image by its own means, and animation supplemented it with motion and revived the laconically constructed elements.

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



Zinger's Illustration - Tsochev / Lettering and art direction - Bauer / Motion Design - Lakfar

​​​​​​​​​​​​​​THANKS FOR WATCHING
Спасибо за просмотр

You may also like

Back to Top