Web design com software livre
-
Upload
tony-peixe -
Category
Technology
-
view
1.084 -
download
0
Transcript of Web design com software livre
![Page 1: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/1.jpg)
![Page 2: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/2.jpg)
Vamos deixar claro...
Existe o Designer que faz Web, e esse profissional tem que aprender tudo: Tipografia, Fotografia, Semiótica, Gestalt, Matemática, Ótica, Percepção, Comportamento Humano, etc.
Senão ele não consegue fazer Web.
Alexandre Wollner
Web Design com Software Livre – Eduardo Santos
Não existe Web Designer.
![Page 3: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/3.jpg)
Tio, o que é design?
Design referese ao projeto visual e funcional de um produto, a adaptação de um produto a necessidade dos seus usuários, cativando o seu uso através da estética, aplicandose conceitos e usabilidade a sua forma.
Web Design com Software Livre – Eduardo Santos
![Page 4: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/4.jpg)
A função do Design, além da estética, é tornar um produto
funcional.
Tio, o que é design?
Web Design com Software Livre – Eduardo Santos
![Page 5: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/5.jpg)
É transformar
Informação emComunicação
![Page 6: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/6.jpg)
Etapas do Desenvolvimento
Documentação
Arquitetura de Informação
Design de Interface
Layout
Estruturação
Programação
Publicação
![Page 7: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/7.jpg)
Referência
Link para o Artigo
Conceitos de Designfunção, cores, letras e formas
Artigo que fala sobreFunção do Design
E Projeto Web
![Page 8: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/8.jpg)
“Saber como a ferramenta funciona”
é bem diferente de
“Saber o que fazer com ela”
Web Design com Software Livre – Eduardo Santos
Ferramentas Proprietáriase Clichês no Design
![Page 9: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/9.jpg)
Quer ver?
www.havenworks.com
![Page 10: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/10.jpg)
![Page 11: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/11.jpg)
Ferramentas Proprietáriase Clichês no Design
Web Design com Software Livre – Eduardo Santos
![Page 12: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/12.jpg)
"Quem tem a resposta antes da pergunta não trabalha com Design mas sim com
clichês" (Claudio Ferlauto)
Ferramentas Proprietáriase Clichês no Design
Web Design com Software Livre – Eduardo Santos
![Page 13: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/13.jpg)
Nenhum software deve ser encarado como uma solução
pronta
A definição do que é Design vai muito além do Photoshop
Ferramentas Proprietáriase Clichês no Design
Web Design com Software Livre – Eduardo Santos
![Page 14: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/14.jpg)
Processo de Migração
Web Design com Software Livre – Eduardo Santos
ConceitoAtenham-se ao
![Page 15: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/15.jpg)
...um Sistema Operacional Adquado.
O Ubuntu Studio é um empacotamento especialmente voltado para multimídia, já vindo com aplicações mais voltadas para criação e edição de áudio, vídeo e imagens.
Vem com os aplicativos gráficos The GIMP, Inkscape e Blender acompanhado de plugins como dcraw (suporte para arquivos RAW de cameras digitais) ou o wacom-tools para os usuários de tablets Wacom.
http://ubuntustudio.org
![Page 16: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/16.jpg)
...todas as aplicações necessárias disponíveis
![Page 17: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/17.jpg)
GimpEditor deImagens
InkscapeDesenhoVetorial
BlenderModelagem 3D
ExistemAlternativas!
ScribusPaginação
![Page 18: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/18.jpg)
Inkscape
![Page 19: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/19.jpg)
InkscapeSVG - Scalable Vector Graphics
• Trata-se de uma linguagem XML para descrever de forma vetorial desenhos e gráficos bidimensionais, quer de forma estática, quer dinâmica ou animada.
• Criado pela W3C (Web Standards)
• Multiplataforma
• Possível de criar Extensões ou Plugins em linguagens como Python, Ruby, etc
![Page 20: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/20.jpg)
GIMP
![Page 21: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/21.jpg)
GIMP - GNU Image Manipulation Program
• Trabalha com imagens RAW (usando o Plugin Ufraw)
• Montagem de imagens para Web com o filtro Py-Slice, com suporte a criar menus Roll-hover em Java Script
• Possui Versão Portátil• Suporte a perfis de cores ICC
![Page 22: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/22.jpg)
GIMP - GNU Image Manipulation Program
Liquid Rescale GIMP plugin
Método de redução nãouniforme busca identificar quais são as áreas importantes, e preserva o aspecto delas, ao mesmo tempo em que reduz mais drasticamente o fundo.
![Page 23: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/23.jpg)
40 Programas Gráficos Open Source
Link para o artigo
![Page 24: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/24.jpg)
Desenvolvimento:Perder Produtividade?
Acho que não!
![Page 25: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/25.jpg)
Referênciaswww.programaslivres.net
www.estudiolivre.org
www.inkscapebrasil.org
www.ogimp.com.br
www.gimp.com.br
www.blender.com.br
www.mundesign.org
www.colivre.coop.br
Web Design com Software Livre – Eduardo Santos
![Page 26: Web design com software livre](https://reader033.fdocumentos.tips/reader033/viewer/2022060117/5584e496d8b42a89408b52d6/html5/thumbnails/26.jpg)
Eduardo Santos
http://www.agni.art.br/
Agni.art
Web Design com Software Livre – Eduardo Santos