Workshop Webinsider 2003
Transferir como PPT, PDF2 gostaram335 visualizações
1. O documento apresenta a agenda de um workshop sobre design para web com discussões sobre criação, design, webdesign, mercado atual e futuro. 2. Serão abordados conceitos como criação versus solução, a importância do processo de design focado em resultados, e as fronteiras do design. 3. O currículo do palestrante Michel Lent será apresentado, com seus trabalhos ao longo dos anos para marcas como Banda Bel e American Express.
![Desenhar e Design design . [Ingl.] S. m. 1. Concepção de um projeto ou modelo; planejamento. 2. O produto desse planejamento. 3. Restr. Desenho industrial. 4. Restr. Desenho-de-produto. 5. Restr. Programação visual.](https://image.slidesharecdn.com/workshopsp-1216610185890600-9/85/Workshop-Webinsider-2003-46-320.jpg)
Workshop Webinsider 2003
- 1. workshops webinsider design para web michel lent schwartzman
- 2. Agenda do dia 9:00h: Início do workshop 10:40h: Coffee-break (20 min) 12:40h: Almoço 14:00h: Reinício 16:40h: Coffee-break (20 min) 19:00h: Término
- 3. Pauta do workshop 0. Apresentação de projetos 1. Criação, design, web, webdesign 1.1 Debate 2. Criação não: solução. O processo de design voltado para o resultato 3. Mercado hoje e amanhã 3.1 Debate final
- 4. apresentação de credenciais histórico profissional e apresentação de portfolio
- 5. RIO 1988 1993 puc-rio, freelance
- 6. Banda Bel | Primeiro offset | 1988
- 7. Convite para show | Banda Bel | 1989
- 8. Banda Bel | Logotipo | 1990
- 9. LP “Rei do Rio”, Banda Bel | 1991
- 10. Turnê “Rei do Rio” | Banda Bel | 1991
- 11. CD “Sambadrome” | Banda Bel | 1993
- 12. Marcas diversas | 1993
- 13. NYC 94 96 nyu/agency.com/euro.rscg
- 14. Primeiro experiência em HTML | 1994
- 15. Primeiro site profissional (prog HTML)| American Express University | Agency.com | 1995
- 16. Biquini Cavadão | MLS | 1995
- 19. Banco Itaú | Medialab | 1996
- 20. Shell do Brasil | Medialab | 1996
- 23. Site oficial do Ronaldinho | 10’Minutos | 1997
- 24. Lançamento Ronaldinho no JN | 10’MInutos | 1997
- 25. Site Institucional | Bowne | 1998
- 26. Brasil 500 | Bowne | 1999
- 27. Globo.com | Globo.com | 2000
- 28. SP 00 01 DM9DDB
- 29. Site Institucional | Itaú Seguros | 2001
- 30. Radio Triton | Triton | 2001
- 31. 15ª Semna da Criacao Publicitaria | 2001
- 32. TV Interativa Itaú | Itaú | 2001
- 33. MAR 02 10’Minutos, São Paulo
- 34. Hotsite Honda NXR | DM9 | 2003
- 35. Prêmio Empreededor do Ano | Ernst & Young | 2003
- 36. Portal Banco Real | Banco Real | 2003
- 37. Hotsite Honda FIT | DM9 | 2003
- 38. Klassicos Kaiser / Kaiser Oktoberfest | Bates | 2003
- 39. Hotsite Kaiser Bock | 2003
- 40. Portal Kaiser Music | Bates | 10’Minutos | 2003
- 41. Cliente atendidos | 10’ | 2003
- 42. Direção de Criação | Prêmios
- 43. 1 . criação, design, web, webdesign conceitos, fronteiras, modismos e práticas
- 44. verdades e mitos sobre criação
- 45. Design não é desenho Curso de Design no Brasil é chamado de Desenho Industrial (Industrial Drawing) Tradução do Design para ‘Desenho’ é uma forte contribuição para a confusão Fazer design não é desenhar
- 46. Desenhar e Design design . [Ingl.] S. m. 1. Concepção de um projeto ou modelo; planejamento. 2. O produto desse planejamento. 3. Restr. Desenho industrial. 4. Restr. Desenho-de-produto. 5. Restr. Programação visual.
- 47. Design não é Arte Universo das artes plásticas, artes gráficas e da Comunicação Visual muitas vezes se confunde Artistas plásticos frequentemente se tornam ótimos comunicadores visuais No Design há o compromisso coletivo com a solução
- 49. A diferença entre criar e criar Na separação entre a Arte e o Design encontramos a diferença entre criar para a Arte e criar para o Design O verbo está presente nos dois universos Mas com significados completamente diferentes
- 50. Criar é propor soluções A atividade do ‘criar’ no Design é a busca da solução para um problema específico O verbo ‘criar’ deve ser usado com parcimônia A livre ‘criação’ não pode ser empregada no Design sob pena de distorcer seu objetivo final
- 52. A origem do design Início indefinido Desde a primeira ilustração de uma obra destinada a um público específico Desde a fabricação de armas e apetrechos na idade média Talvez no começo da Revolução Industrial com início da produção em série Como conceito definido Em 1919 com a fundação da Bauhaus na Alemanha
- 53. Mulheres na fábrica de velas (Alemanha)
- 55. Arquitetura e Design Hoje profissões distanciadas, são como mãe e filha A própria Bauhaus é fundada por Walter Gropius, um arquiteto Na espinhal dorsal das duas atividades está a mesma estrutura de projeto, a mesma abordagem Ambas criam produtos o uso, mas em escalas diferentes
- 57. Dessau 1926, Wassily e Nina Kandinsky, Georg Muche, Paul Klee, Walter Gropius
- 58. Design é projeto Fazer Design é fazer um projeto de um produto para uso do homem Este produto ser tridimensional, bidimensional, unilateral, interativo Independente da forma ou objetivo, todo produto existente no mundo parte de um projeto de Design
- 59. Design é propor soluções Fazer um projeto de Design é propor uma solução para uma situação problemática existente no mundo Este problema pode ser de comunicação, ferramenta, transporte, social, recreativo, etc Para cada problema, há uma solução através de um processo de Design
- 60. Design está a nossa volta A melhor pergunta para se fazer a um Designer é “o que é Design?” A reação do designer deve ser: começar a apontar para tudo que está a nossa volta Tudo que está a nossa volta é fruto de um projeto de Design Tudo.
- 62. As fronteiras do design A família Arquitetura e Design vinha dando conta de todas as fronteiras A Arquitetura cuidando dos espaços físicos E o Design de Produto e a Comunicação Visual de todos os objetos a nossa volta Até o surgimento da INTERFACE
- 63. A interface: uma nova fronteira O surgimento da interface gráfica cria uma nova fronteira para o Design A interface gráfica tem suas raízes na década de 50, mas é realmente desenvolvida em meados de 1970 pelo PARC (Palo Alto Research Center) da Xerox O primeiro computador a usar uma interface gráfica é o Alto
- 64. “ Alto” da Xerox
- 65. o design de interfaces e a web
- 66. Web é a interface mais popular A Apple com o Macintosh e principalmente a Microsoft com o Windows, iniciaram o processo de popularização do computador pessoal e consequentemente da interface gráfica Entretanto, a Web é hoje o ambiente de interface gráfica mais popular do planeta
- 70. O surgimento da Web 1989, Tim-Berners-Lee do CERN, organização européia para pesquisa nuclear, inicia projeto para troca entre cientistas Em 1991, o projeto estava pronto e disponível para algumas universidades. Um pouco depois, podia ser usado via internet Em 1993, havia cerca de 50 servidores WWW no mundo inteiro Menos de 10 anos depois, a Web é usada por mais de 1 bilhão de pessoas no mundo
- 71. Fonte: Hobbes’ Internet Timeline
- 73. Muito primitiva e limitada HTML, principal linguagem de formatação da Web é muito limitada Um sistema que precisa viver de ‘gambiarras’ pra funcionar Ferramental disponível para desenho é primitivo Enfrenta sérias questões de usabilidade e acessabilidade
- 76. Em terra de ninguém A interface gráfica ainda está em terra de ninguém Não há concenso sobre por quem deve ser feita e o que é preciso se saber para fazer Há os programadores que não entendem de design Há os designers que não entedem de programação Há os que entendem de tudo um pouco, mas não o suficiente para fazer um produto ideal
- 77. a importância da interface no mundo de hoje
- 78. Gera muita demanda A explosão da Web e a necessidade da construção de sistemas e de interfaces gráficas para este ambiente tem gerado muita demanda por profissionais qualificados Numa fase de superaquecimento do mercado (bolha) essa demanda inflacionou salários Hoje com um balanço maior entre demanda e oferta, ainda oferece boa remuneração
- 79. Profissionais migrantes Sem formação específica, até bem recente essa demanda veio sendo suprida por profissionais migrantes de outras áreas Basicamente profissionais de sistemas, de Design e sem profissão definida
- 80. Profissional ‘legítimo’ aparece Primeiros cursos de formação superior ou sequencial específicos colocam no mercado as primeiras levas de profissionais ‘legítimos’ Aquele que tem ‘formação’ na área Se essa formação é adequada ou não, deve ser motivo para debate
- 81. o designer x o programador
- 82. Situação atípica Pela sua situação ‘primitiva’, a interface gráfica da Web ainda pode ser toda feita por um só profissional Quando surgiu, os sistemas eram ainda mais simples e o ferramental ainda mais inexistente Era obrigatório algum conhecimento de programação para se criar uma interface de ambiente Web
- 83. Limitada a projetos pequenos Na medida em que a tecnologia vem evoluindo, o projeto do “um homem só” se torna cada vez mais raro e cada vez mais limitado a projetos de pequeno porte Em projetos maiores e mais complexos, é necessária a formação de uma equipe multidiciplinar
- 84. A invenção do Webdesigner A falta de software apropriado também contribuiu para a confusão do designer com o programador Esse híbrido passou a ser conhecido como o ‘Webdesigner’ Na medida em que o software evolui, há menos necessidade de se conhecer os dois lados da moeda Há espaço para a especialização
- 85. O ‘front-end’ e o ‘back-end’ Na realização de projetos complexos, a tendência é que se tenha um divisor de águas entre a programação ‘front-end’ e a ‘back-end’ O profissional de interface gráfica deve ficar responsável pelo ‘front-end’ e o resto com o programador
- 86. A Web é a ponta do iceberg A Web é a principal e praticamente nossa única maneira de explorarmos a internet hoje em dia Tudo é feito através do computador e do browser Mas o verdadeiro potencial da internet não se esgota na Web Com o desenvolvimento da tecnologia e dos aparelhos, um universo inimaginável de opções estará a disposição
- 87. Debate O que é um profissional de internet? Qual a diferença entre o Webdesigner e o designer para a Web? Faculdade x formação livre hoje e no futuro A resposabilidade do designer de interfaces perante o mundo
- 88. 2. criação não: solução o processo de criação e design voltado para resultados
- 89. Definição da situação problemática Primeira prerrogativa: design de interface Quem é o cliente Qual é a sua necessidade (problema) Em que ambiente ele se encontra Qual é sua realidade social e referências O que está dando origem a sua necessidade de design Condições de viablização do projeto
- 90. Análise de situações análogas Quais são as referências que nosso cliente forneceu para o projeto Quem são os concorrentes de mercado do nosso cliente Que soluções de projeto os concorrentes de mercado oferecem Que outras soluções similares podemos levantar Documentação e análise de todo o material levantado para referência (benchmark)
- 91. Definição de objetivos A necessidade O que o cliente diz que precisa O que achamos que o cliente precisa O que o cliente realmente quer O público-alvo Com quem o cliente quer falar Com quem o cliente deve falar Com quem o cliente realmente quer falar A definição Qual objetivo o projeto procurará atingir
- 92. Planejamento e arquitetura de informação Primeira listagem de idéias (brainstorm) Estruturação das idéias em grupos de informação Definição do fluxo de informação Especificação de sistemas e componentes Estimativa do esforço em horas para desenvolvimento de cada seção do projeto Priorização de áreas essenciais e secundárias Orçamento e definição de verba para desenvolvimento
- 93. PLANILHA DE CUSTOS ARQUITETURA DE INFORMAÇÃO
- 95. Design de interface Primeira definição é a nível estrutural, sem influência do design gráfico (brand) Definição de elementos mestres Definição de telas mestres Definição da necessidade de funcionalidade de cada tela do sistema
- 96. INTERFACE FUNCIONAL EXEMPLO REAL
- 97. Protótipo e usabilidade (1) Programação simples de protótipo funcional Links que permitam a navegação Interação simples Testes de usabilidade Pouco ou muito estruturados Feitos com pessoas não envolvidas no projeto Análise e reação sobre resultados Identificação de problemas estruturais Correção de interface Novo protótipo Novo teste
- 98. Design gráfico Definição gráfica sobre interface funcional Alteração da estética, comunicação, marketing Redação de conteúdo Manutenção dos elementos funcionais Aprovação das telas estáticas Ajustes eventuais
- 100. Protótipo e usabilidade (2) Nova programação de protótipo simples Novos testes de usabilidade com os mesmos usuários da versão anterior Identificação de eventuais problemas funcionais causados pelo brand Análise e reação sobre resultados
- 101. Implementação Desenvolvimento do software de ‘front-end’ e ‘back-end’ necessário para dar suporte aos objetivos de negócio do site e funcionalidades de interface Cheque de consistência Debug priorizado conforme prazo de execução (cosmético, funcional, grave)
- 102. Ajustes Versão beta testada em ambiente controlado Site funcionando com estrutura final Abertura gradual para maior número de usuários Últimos testes e ajustes de problemas
- 103. Publicação Liberação do endereço para acesso público Comunicação gradual ao mercado sobre a publicação do novo projeto Monitoramento de acessos e funcionalidade Análise de logs para identificação de problemas de funcionalidade ou de conteúdo
- 104. 3. mercado hoje e amanhã o futuro da profissão
- 105. panorama do mercado atual
- 106. Perspectivas de mercado Começou incipiente e cresceu rápido Passou por fase de superaquecimento (bolha) seguida de depressão exagerada Passa por uma fase de consolidação e retomada de negócios Tende a ficar cada vez mais concorrido e especializado
- 107. Atenção: esse gráfico é uma completa “selvagem suposição”, principalmente no que se refere a curva de demanda do mercado. As curvas de oferta e capital são um pouco mais confiáveis, mas também não estão baseadas em números reais, tendo sido usadas apenas em caráter ilustrativo.
- 108. Áreas de atuação O design e a programação começaram sendo as únicas áreas existentes para se trabalhar com a Web Produtoras e empresas de informática eram os únicos lugares Complexificação da atividade abriu novas áreas
- 109. Concorrentes e novos concorrentes O tipo de profissional concorrente também mudou No começo, todos concorriam com todos e ninguém era originalmente do meio Amadurecimento traz hoje um profissional mais especializado, com mais formação
- 110. A nova geração A nova geração não precisa ser tão auto-didata quanto os pioneiros Já se forma em cursos, escolas técnicas e universidades É mais embasada e ao mesmo tempo vai se especializando mais nas diferentes áreas em contraste com o profissional “sabe-tudo”
- 111. Tipos de profissional / empresa Hoje é possível encontrar profissionais nas mais diferentes empresas, nas áreas de TI, design, publicidade e marketing O trabalho tem sido contratado por: O cliente diretamente Agências de comunicação
- 112. Modelos de funcionamento Profissional liberal Trabalha sozinho e/ou com parcerias para tarefas específicas Studios de design Entre 3 e 8 profissionais Maior foco no design, front end e na programação simples Produtoras de internet Entre 10 e 30 profissionais Criam sites médios do começo ao fim
- 113. Modelos de funcionamento Empresas de TI Mais de 30 profissionais Desenvolvem sistemas de TI completos, independente da sua relação com a Web Projetam interfaces como complemento de seus sistemas Agências de internet Entre 5 a 15 profissionais Foco na estratégia, criação e atendimento aos projetos Não tem equipe interna fixa, contrata de acordo com as necessidades de cada projeto
- 115. A internet além da Web A Web é a segunda forma mais popular de acessarmos a internet (a primeira é o email) Hoje, toda nossa relação com a internet se dá através de um mesmo equipamento primitivo: computador pessoal
- 117. O fim da internet e da Web Quando tivermos mais e melhores opções de acesso, a Web tende a perder sua importância ou eventualmente desaparecer Internet ainda é muito rudimentar e por isso está muito presente no nosso dia-a-dia Na medida em que funcionar bem e se incorporar no cotidiano, vamos deixar de pensar na tecnologia e passar a pensar no serviço que ela nos oferece
- 118. Ninguém se preocupa em como uma geladeira funciona. Apenas se ela está cheia ou não.
- 119. O mundo de interfaces A informática entrou para nunca mais sair das nossas vidas Todo aplicativo de informática vai sempre demandar alguma interação Toda interação sempre demandará uma interface Durante muito tempo, essa interface ainda será GRÁFICA Em um mundo de interfaces gráficas o designer é peça FUNDAMENTAL
- 121. A especialização das profissões Mais e melhores projetos virão Ferramentas mais aprimoradas Todos esses indicativos nos levam a acreditar na necessidade de profissionais menos generalistas e mais especializados, com funções mais definidas A separação entre Design e Tecnologia deve seguir o caminho da Arquitetura e da Engenharia civil
- 122. Caminhos seguros a seguir Independente do tipo de interface e do tipo de projeto de design, o processo de trabalho seguirá sendo sempre o mesmo que vimos hoje Ele se adapta a qualquer tipo de tecnologia ou ferramenta final É fundamental que se coloque a tecnologia sempre em segundo plano e que se invista todo o possível em conceito e teoria Tecnologias mudam todo mês, conceitos e teorias passam séculos se aprimorando
- 123. Debate final O ‘fim’ da Web é o fim do ‘Webdesigner’? Como se preparar para o futuro e levar o dia-a-dia? Como os profissionais ‘generalistas’ podem se especializar sem voltar para a escola? Do que abrir mão na hora da especialização se gosto de tudo? Quanto tempo isso vai levar para se tornar realidade? Quando é o ‘futuro’?
- 124. São Paulo, novembro de 2003