Sketching

1,440 views

Published on

Sobre a importância da prática de esboçar como ferramenta de definição e planejamento de projetos

Published in: Design
1 Comment
3 Likes
Statistics
Notes
No Downloads
Views
Total views
1,440
On SlideShare
0
From Embeds
0
Number of Embeds
97
Actions
Shares
0
Downloads
42
Comments
1
Likes
3
Embeds 0
No embeds

No notes for slide

Sketching

  1. 1. SketchingO ESBOÇO COMO RECURSO PARA PROJETOS DE INTERFACES
  2. 2. Adreson• Desenho Industrial, UFSM• Artes Visuais, UFRGS• Expressão Gráfica, PUC-RS (especialização)→PROCERGS, designer
  3. 3. Porque falar de esboços? Experiences in Visual thinking Robert H McKim, 1980 Sketching User Experiences Bill Buxton, 2007 Design Thinking Tim Brown, 2008
  4. 4. Porque falar de esboços?• problemas de design são cada vez mais complexos• Interfaces mais complexas• design de interface X design de interação UX• Custos x prazos (economia/agilidade)
  5. 5. Porque falar de esboços?• valorizar o ato de rabiscar sobre o papel• mostrar que esboçar é um ato criativo importante
  6. 6. Márcia Tiburi“O que é próprio ao gesto de desenhar: ogesto de pensar como ato de criar conceitopor meio de traços.”
  7. 7. pensar de maneira estratégicaDesign thinking
  8. 8. PensamentoIntrínseco a natureza humanafenômeno complexo e difícil de ser descritoObservado através de suas manifestações: gestos, voz,ou desenho (e escrita).“a mente não processa informações de modo linear esequencial” Medeiros, 2004
  9. 9. Luis Vidal N. Gomes, 2001“Quando se imagina, transmitem-se ossentimentos, e quando se desenha, asideias”
  10. 10. Fernando Chuí“O desenho é o gene do pensamento“
  11. 11. Isso aproxima à proposta de McKim, de quepensamos através de imagens visuais.Pensamento visual
  12. 12. Imagens visuaiso pensamento visual éconstituído por três tiposde imagens visuaisiterações entre ver,imaginar e desenhar
  13. 13. Imagens visuais• Quando se pensa visualmente, se vê um problema em vários ângulos, assim torna-se possível imaginar soluções alternativas e para demonstrá-las, são facilmente rabiscadas.• Dondis também relaciona o pensamento à linguagem verbal/visual, e a imaginação ao processo de geração de ideias.
  14. 14. Ideação fluidez de pensamento exige flexibilidade e rapidez na representação
  15. 15. Ideias• McKim diz que são “construtos internos da imaginação, percepção e pensamento”.• [Design] tarefa cognitiva para procurar solucionar o problema de um projeto.
  16. 16. IdeaçãoDois modos da ideação gráfica exploratória desenvolvimento evolui a partir de um imaginação e a conceito potencial memória de imagens para uma forma vagas e esquivas consolidada
  17. 17. Ideação gráfica de desenvolvimentoEsboços da lâmpada de Thomas Alva Edison, 1880.Exemplo de ideação gráfica com anotações para odesenvolvimento da ideia.
  18. 18. Função da ideação• a ideação gráfica tem objetivo principal é comunicar e revelar o valor de uma ideia• difere da comunicação gráfica por ser específica e aberta à modificações• dependem do contexto utilizado
  19. 19. Ideação• ideação gráfica utiliza-se do esboçar, delinear ideias com grafismos e anotações• prática de exercícios de repetição gráfica para melhorar flexibilidade e a fluência do pensamento
  20. 20. Esboços• Desde a idade média como recurso de projetos• Muito mais fácil e rápido esboçar (no papel) que utilizar um computador• Objetivo do esboço é mais importante que o material e a técnica utilizados• Pensar desenho como estratégia, antes de protótipos ou do layout no computador
  21. 21. EsboçosBill Buxton mostra a importância do esboço ser visto, e não apenas imaginado, paraque a interpretação deste possa gerar novas ideias (além de conhecimento).
  22. 22. Robert McKim“Desenhar, acima de tudo, estimula a ver”
  23. 23. Twitter “Some things areworth the wait .” Jack Dorsey - Esboço do Twitter em 2006.
  24. 24. twttr (07/2006).
  25. 25. Firefox“Esboços iniciais para especificar os elementos do site da campanha de cinco anos do Firefox, concebido por Sean Martell (2009) .
  26. 26. Firefox detalhe do sitecomemorativo de 5anos do navegador Firefox (2009
  27. 27. Esboço x protótipoo esboço questiona e propõe, por outro lado oprotótipo testa e resolve. esboço protótipo ideação design e usabilidade (geração de (descrição e alternativas) funcionalidades)
  28. 28. Interfaces• A interface do usuário é a parte que as pessoas podem se comunicar através dos sentidos humanos .• Interfaces tem dois componentes : Entrada e Saída
  29. 29. Interfaces• O design de interface deve fazer com que trabalhar com um computador seja agradável, produtivo e rápido.• As interfaces digitais rapidamente transformaram as formas de comunicação e de comportamento social.
  30. 30. Steve Johnson“Vivemos numa sociedade cada vezmais moldada por eventos que seproduzem no ciberespaço”
  31. 31. Interface gráfica do usuárioExemplo de etapas de um projeto de interface -iOS Human Interface Guidelines, Apple Inc. 2011
  32. 32. Interfaces• a interface não deve desviar a atenção do usuário• se há alguma complexidade, esta deve ser pertencente à tarefa e não à ferramenta
  33. 33. WriterInterface do aplicativo Writer for iPad - Information Architect (iA), Tokyo, Japão
  34. 34. Alguns esboços e wireframesExemplos
  35. 35. Intranet Rascunhos para intranet PROCERGS, 2010
  36. 36. Pró-Cultura RS
  37. 37. Pró-Cultura RS
  38. 38. Pró-Cultura RS
  39. 39. Pró-Cultura RS
  40. 40. Pró-Cultura RS
  41. 41. Pró-Cultura RS
  42. 42. Pró-Cultura RS
  43. 43. PPR PROCERGS
  44. 44. PPR
  45. 45. PPR
  46. 46. PPR
  47. 47. Da importância de esboçar comoferramenta de definição e planejamento de projetosO esboço é determinante no desenvolvimento denovos produtos, e sua prática deve ser incentivadaem todo tipo de projeto que envolva criatividade einovação.
  48. 48. Por hoje é só!Obrigado! Adreson Vilson Vita Sá adreson@gmail.com

×