Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

[cv - 2011.2] 13 - layout e proporção áurea

4,367 views

Published on

  • If you want to download or read this book, copy link or url below in the New tab ......................................................................................................................... DOWNLOAD FULL PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... Download EPUB Ebook here { http://bit.ly/2m77EgH } .........................................................................................................................
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

[cv - 2011.2] 13 - layout e proporção áurea

  1. 1. Layout e Proporção Áurea Comunicação Visual - 10.11sexta-feira, 7 de outubro de 11
  2. 2. Layout é o quê?sexta-feira, 7 de outubro de 11
  3. 3. “Layout é o arranjo dos elementos de um design em relação ao espaço que eles ocupam e em conformidade com um esquema estético geral”. (Ambrose, 2009)sexta-feira, 7 de outubro de 11
  4. 4. E isso serve para quê?sexta-feira, 7 de outubro de 11
  5. 5. “O principal objetivo do layout é apresentar os elementos visuais e textuais que precisam ser transmitidos de uma forma que o leitor os receba com o mínimo de esforço”.sexta-feira, 7 de outubro de 11
  6. 6. O Layout está relacionado com a disposição de elementos de texto e imagem em um design.sexta-feira, 7 de outubro de 11
  7. 7. A maneira como os objetos são posicionados afetará o modo como o conteúdo é examinado e recebido.sexta-feira, 7 de outubro de 11
  8. 8. O layout pode ajudar ou impedir a recepção das informações apresentadas no projeto. Layouts criativos agregam valor ao conteúdo.sexta-feira, 7 de outubro de 11
  9. 9. Estratégias organizacionaissexta-feira, 7 de outubro de 11
  10. 10. Descobrir o posicionamento das coisas e em que ordem elas devem ser organizadas exige muito esforço por parte de um designer.sexta-feira, 7 de outubro de 11
  11. 11. LOGO Experimente o luxo Palazzo Giglio sobre Texto introdutório sobre o localização ambiente do hotel. Link para o reservas contato tour virtual e descrição de comodidades. Classificar o mesmo conteúdo de diferentes maneiras pode chamar atenção para partes específicas e, portanto, afetar a ênfase das informações.sexta-feira, 7 de outubro de 11
  12. 12. sobre contato LOGO localização reservas comodidades A conveção geralmente determina que o que vem primeiro deve ter maior significado. Ajustar a ordem para criar fluxo narrativo que acentua o foco sobre o conteúdo muda a experiência do usuário.sexta-feira, 7 de outubro de 11
  13. 13. Qual o espaço de uma página ou produto de mídia digital?sexta-feira, 7 de outubro de 11
  14. 14. O espaço de tais produtos normalmente é a tela (do computador, da tevê, etc). Características como acabamento, interações possíveis no meio digital são considerações essenciais. É preciso também considerar o objetivo e o segmento de público de uma obra.sexta-feira, 7 de outubro de 11
  15. 15. Antes de sairmos colocando coisas na nossa página, digo, tela, devemos ter em mente que devemos seguir regras. Falemos um pouco sobre a proporção áurea.sexta-feira, 7 de outubro de 11
  16. 16. Seção Áureasexta-feira, 7 de outubro de 11
  17. 17. Na antiquidade, a seção áurea era vista como uma maneira de representar proporções incrivelmente belas, por isso era também conhecida como proporção divina.sexta-feira, 7 de outubro de 11
  18. 18. Dividir uma linha pelo coeficiente 8:13 significa que a relação entre o maior e o menor segmento é a mesma que entre o maior segmento e a linha toda.sexta-feira, 7 de outubro de 11
  19. 19. A relação entre a parte "a" no desenho, e a parte "b" é tal, que a proporção entre a totalidade da linha "ab" e "a", é igual a proporção "a" e "b".sexta-feira, 7 de outubro de 11
  20. 20. De posse dessa relação podemos construir um retângulo chamado de retângulo de ouro.sexta-feira, 7 de outubro de 11
  21. 21. a asexta-feira, 7 de outubro de 11
  22. 22. a a bsexta-feira, 7 de outubro de 11
  23. 23. a a b a+bsexta-feira, 7 de outubro de 11
  24. 24. a a b a+b Observe o retângulo menor criado, ele é proporcional ao retângulo maior.sexta-feira, 7 de outubro de 11
  25. 25. Se criarmos uma espiral ligando a divisão do segmento, chegamos à espiral de Fibonacci.sexta-feira, 7 de outubro de 11
  26. 26. Objetos com essas proporções são agradáveis aos olhos e ecoam no mundo.sexta-feira, 7 de outubro de 11
  27. 27. Muitas pessoas acreditam que a simetria é a fórmula da beleza. Até faz sentido, no entanto, se você pegar uma foto de uma pessoa, dividir exatamente no meio e espelhá-la não verá muita beleza.sexta-feira, 7 de outubro de 11
  28. 28. Se analisarmos o rosto humano veremos que a proporção áurea existe em diversos momentos.sexta-feira, 7 de outubro de 11
  29. 29. Exemplos na naturezasexta-feira, 7 de outubro de 11
  30. 30. ...tais pontos compõem linhas e manchas de texto. (CLM/BBDO, 2011)sexta-feira, 7 de outubro de 11
  31. 31. sexta-feira, 7 de outubro de 11
  32. 32. sexta-feira, 7 de outubro de 11
  33. 33. Exemplos na artesexta-feira, 7 de outubro de 11
  34. 34. Pantheon, Gréciasexta-feira, 7 de outubro de 11
  35. 35. sexta-feira, 7 de outubro de 11
  36. 36. Saint Jerome (Leonardo)sexta-feira, 7 de outubro de 11
  37. 37. Saint Jerome (Leonardo)sexta-feira, 7 de outubro de 11
  38. 38. Saint Jerome (Leonardo)sexta-feira, 7 de outubro de 11
  39. 39. Une baignade à Asnières (Georges- Pierre Seurat, 1884)sexta-feira, 7 de outubro de 11
  40. 40. Une baignade à Asnières (Georges- Pierre Seurat, 1884)sexta-feira, 7 de outubro de 11
  41. 41. Une baignade à Asnières (Georges- Pierre Seurat, 1884)sexta-feira, 7 de outubro de 11
  42. 42. Como isso funciona com páginas web?sexta-feira, 7 de outubro de 11
  43. 43. Suponhamos que você quer criar um página web e que quer utilizar as proporções áureas para dividir a coluna principal da coluna secundária. Você sabe que seu site deverá ter exatamente 1000 pixels de largura, então o único valor que temos é o “todo” (segmento áureo + complemento).sexta-feira, 7 de outubro de 11
  44. 44. Se você tiver o todo e quiser achar o tamanho do segmento áureo: todo x 0,618. Assim: 1000 pixels x 0,618 = 618 pixelssexta-feira, 7 de outubro de 11
  45. 45. sexta-feira, 7 de outubro de 11
  46. 46. O layout acima tem seis retângulos de ouro nele. Eles tem dimensões de 299 x 185 pixels.sexta-feira, 7 de outubro de 11
  47. 47. Observe como a grande quantidade de espaço em branco ao redor retângulos cria uma atmosfera calma e simples, em que as opções de navegação podem respirar e servir o seu propósito.sexta-feira, 7 de outubro de 11
  48. 48. Nesse outro exemplo, cada coluna corresponde a um número de Fibonacci. Foi utilizada uma largura de base de 90 pixels. Esta largura da base é então multiplicada por um número de Fibonacci para obter a largura total para uma determinada coluna.sexta-feira, 7 de outubro de 11
  49. 49. A primeira coluna tem uma largura de 180 pixels (90 x 2), a segunda coluna tem uma largura de 270 pixels (90 x 3); ea terceira coluna tem uma largura de 720 pixels (90 x 8).sexta-feira, 7 de outubro de 11
  50. 50. E acabou?sexta-feira, 7 de outubro de 11
  51. 51. Sim e não. Para relembrar tudo o que dissemos, vejamos esse vídeo:sexta-feira, 7 de outubro de 11
  52. 52. http://www.youtube.com/watch?v=58dmCj0wuKwsexta-feira, 7 de outubro de 11
  53. 53. Bibliografiasexta-feira, 7 de outubro de 11
  54. 54. Lupton, Ellen. Novos Fundamentos do Design. São Paulo: Cosac Naify, 2008. Samara, Timothy. Elementos do Design: guia do estilo gráfico. Porto Alegre: Bookman, 2010. Ambrose, G. Layout. Porto Alegre: Bookman, 2009. Smashing Magazine. Applying Mathematics To Web Design. Disponível em: http://www.smashingmagazine.com/2010/02/09/applying- mathematics-to-web-design/ LedStyle. A fórmula da beleza. Disponível em: http://www.tuxresources.org/blog/archives/468#more-468sexta-feira, 7 de outubro de 11
  55. 55. Layout e Proporção Áurea eduardonovais@virtual.ufc.brsexta-feira, 7 de outubro de 11

×