Please enable JavaScript.
Coggle requires JavaScript to display documents.
DESIGN MOTION PROCESS Inspiração é para amadores, para o resto de nós é…
DESIGN MOTION PROCESS
Inspiração é para amadores, para o resto de nós é trabalho
01
CONCEPT
Buscar soluções para
resolver o problema do cliente
1
Client Briefing
( Color pallete, fun, clean, unique, clever transitions, serious, etc...)
2
Mindmap
( Palavras que comunicam a idéia)
3
Moodboard
( referências que cabem em 3 opções: client safe, wild card, literal between client safe and wild card)
ART DIRECTION
Create a Style:
vision of artist, interpret an idea, unique, what is the feeling? Find out
AT LEAST 5 THINGS
that define the design.... ex... clean vector shapes, gradient in the frame, detail line work, color w black stroke.... or... collage motion, solids animated, characters exagerated legs and shoes...
https://vimeo.com/192725431
https://vimeo.com/251396049
https://vimeo.com/253006957
https://vimeo.com/343302262
https://vimeo.com/165916444
https://vimeo.com/235589363
https://vimeo.com/279125031
https://vimeo.com/343302262
https://vimeo.com/303586146
https://vimeo.com/316538985
https://vimeo.com/132099841
https://vimeo.com/128982633
https://vimeo.com/436377207
https://vimeo.com/184007774
https://vimeo.com/260493809
GOOD EXPLAINER VIDEOS
Simple, Clean, Effetive
:simple line art and flat color forms
Stylized Complexity
: the color palette is simple and notice how red is used
Negative Spaces
: as a device to focus and guide the viewer’s eye
Colorful, Playful, Fun
: Dark and light values of colors create variety
Wonderful Textures
:collage of real textured elements and textured color fields.
Unique Characters: character design is very unique
STYLES
Live Action + Effects
Illustration
2d flat
typography inspired
3d photo real
3d stylized
TV Network / Branding
Future Inspired
Textural
Mood
Handmade
Light Installations
Oddball / Weird
Advertising Photography
Lifestyle Photography
Architecture Photography
Termos do Broadcast Desing
Play On (Pingel, Bump out): Esse aparece na volta dos comerciais comerciais.
Ident (Station ID): Uma pequena animação que termina com o nome / logotipo de um canal. A MTV tem bastante desses.
Mortise: Ela é basicamente um quadro que você faz para colocar o vídeo dentro, em vez de ter que reproduzi-lo em tela cheia
Transition (Swipe): Como o próprio nome sugere, são transição entre alguns segmentos do programa.
Bug (“Mosca” aqui no Brasil): É a logo do canal ou do programa em algum dos cantos da tela.
Promo (Promotion): Uma animação que anuncia um próximo programa.
Opening Title (Open, Leader, Intro, Intro sequence): A abertura do programa. Pode ter de três a trinta segundos, vai depender do caso.
Snipe São aquelas animações de cinco a dez segundos que aparecem na parte de baixo da tela, durante uma programação mesmo, para promover algum outro programa que está para começar ou estrear.
Bumper (Next, Promo): É aquela transição de um programa para o comercial
Lower Third Super (lower third, super strap, strap, banner): São aquelas animações que aparecem do lado inferior esquerdo da tela, para informar o nome de algo, local ou situação.
02
STORYTELLING
Construir um discurso convincente
Dispositivos retóricos
Uma ferramenta usada no decorrer da retórica, que emprega estrutura de frase, sons e imagens específicas para obter a resposta desejada
https://www.virtualsalt.com/rhetoric3.htm
Allusion
is a short, informal reference to a famous person or event... if you do this i will start world war III
Amplificatio
n allows you to call attention to, emphasize, and expand a word or idea to make sure the reader realizes its importance or centrality in the discussion.
Anaphorais
the repetition of the same word or words at the beginning of successive phrases, clauses, or sentences... To think on death it is a misery,/ To think on life it is a vanity
Climax
(gradatio) consists of arranging words, clauses, or sentences in the order of increasing importance, weight, or emphasis.
Metaphor
compares two different things by speaking of one in terms of the other. podendo usar metafora visual, tesoura com dentes por ex.
Personification
metaphorically represents an animal or inanimate object as having human attributes
Pleonasm
: using more words than required to express an idea... We heard it with our own ears.
Analogy
compares two things, which are alike in several respects, for the purpose of explaining or clarifying some unfamiliar or difficult idea or object by showing how the idea or object is similar to some familiar one.
Hypophora
é o truque de fazer uma pergunta e, em seguida, fornecer a resposta imediatamente. Você sabe por que o hypophora é útil? É útil porque estimula o interesse do ouvinte e cria um ponto de transição claro no discurso.
4
Storyboard
:
Construir narrativa pensando no mindmap, nos dispositivos retóricos, pensar no motion em termos de budget e data de entrega, quais transitions usar, as fáceis ou mais complexas, match cut ou morphings... vai ter follow character...
03
SKETCHING
5
Photoshop
:
uso de masks, clipping mask, swatch color, texture, brushes, opacity e modes. Trabalhar com grupos no photoshop divididos em mood, color, sketching...
1 - buscar o equilibrio: usar
formas
para balanço do design.
2 cores: apos balanco das formas, introduzir as cores,
color blocking
, usando a paleta de cor feita, encontrar o value correto... o melhor contraste
3 finalizar: detalhes do design, pensando nas referências do moodboard, usar
clipping mask para sombras e texturas
...
Pensar em Conceitos de design:
Value
: trabalhar
contrastes
de HUE, lighter or darker,color palletes
limited color pallets
(triadic, analogous, complementary, split complementary)
Form play:
simetria
,
straigh lines
(action, motion, diretional),
curves
(organic, soft, pretty),
regra dos terços
Perspectiva:
linear
c/ vanishing point ( vanishing point embaixo = you re look down, se tiver em cima you re look up) ,
2 points perspective
,
isometria
( usar isometric grid),
color perspective
(quentes = perto, fria = longe),
POV,
Bird view
(visto de angulo por cima),
Worm view
( visto de angulo de baixo),
flat,
fish eye
,
mixed perspective
Color & Lightning
: energy or harmony; flat or power
Stylized proportions
: abstrair, exagerar formas, criar um estilo... depois se cliente pedir, transcodificar seu estilo para estilo que cliente pede
Transições:
https://vimeo.com/217895419
https://vimeo.com/293770811
https://vimeo.com/238424745
https://vimeo.com/140661173
https://vimeo.com/295376956
https://vimeo.com/289399785
hard cut
https://vimeo.com/143595622
match cut
https://vimeo.com/237951242
element from scene
https://vimeo.com/275431627
morphing
https://vimeo.com/191998961
mix all
https://vimeo.com/152215017
https://vimeo.com/143595622
building a character :
comunicate
a vocal message or a feeling. Whos the audience? Whats the mood?
explain sth, reingorce and idea, show action
? sometimes limit the use of character
camera
:
tracking
, pan or
tilt,
zoom shots, reveal
pacing
(ritmo)
textures
textures moves with shapes
? or
pattern move with shapes
? or...
Brushes:
Dry (nupastel) drawing ( rough pastel, happy hb) painting ( gouache magic, smooth drag, slider texture, oil bristle tilt) fx (add noise)
04 TYPOGRAPHIC
Helvetica
= typeface |
regular
= font
1º buscar
hierarquia
, o que é mais importante,
usar um typeface
...
3º
Mesurar espaços e criar variaçõe
s, usar grids ou anti grid (david carson se for criar estilo), kerning só para headlines, Caps é mais difícil ler, italic tb impede a leitura.
2º criar
contrastes
entre typefaces e fonts, (
usar bold e thin, bold só headlines
) e tb criar contrastes de tamanho (
dobrar 2x,4x, 8x
)
SANS SERIF
: Akzidenz Grotesk, Avenir, Avant Garde, Din Mittelschrift, Franklin Gothic, Frutiger, Futura, Gilsans, Gothan, Helvetica, Lettergothic, Meta, OCRB, Trade Gothic, Univers
SERIF
: Bakersville, Bauer Bodoni, Bembo, Bookman, Caslon, Century, Clarendon, Courier, Garamond, Memphis, Mrs Eaves, Rockwell, Sabon, Times new Roman, Trajan.
ART
: Sofiaround, Brooklin Coffee, Cubano, Zephyr, Stump, Amelia, Falco, Fontaine, Grounday, Heather, Helena, Lev serif, Optotypo, Parliament, Woodland.
05 COLOR
The value of value:
contraste P/B... se não tem contraste então a escolha de cores não foi boa.
Não use branco puro ou preto puro,
Tint
mistura com branco,
shade
mistura com preto,
tone
mistura com cinza
Esquemas de cores
: ao escolher sua paleta de cores, procure mais de um tom da mesma cor (
saturação e brilho
) para depois analisar o value no design.
Complementar:
cor oposta
Split
: 1 base e 2 cores opostas
Análoga
: cores proximas
Monocromatico
: mesma cor mais claro e mais escuro