workshop layout-pdf-141204083507-conversion-gate02
TRANSCRIPT
![Page 1: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/1.jpg)
![Page 2: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/2.jpg)
ÍTALO WAXMANDESIGNER / FRONT-ENDER
![Page 3: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/3.jpg)
“DESIGN É FUNÇÃO, NÃO FORMA.Steve Jobs
![Page 4: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/4.jpg)
WEB DESIGNER
DESIGNER GRÁFICO
ONLINE / RGB / PIXELS
OFFLINE / CMYK / CENTÍMETROS
VS
![Page 5: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/5.jpg)
O QUE É INTERNET E O QUE É WEB?
![Page 6: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/6.jpg)
FUDAMENTOSDE CRIAÇÃO PARA WEB
![Page 7: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/7.jpg)
1. DESIGN CENTRADO NO USUÁRIOAFINAL ELE QUE FARÁ USO DA EXPERIÊNCIA QUE PROJETAMOS
![Page 8: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/8.jpg)
2. CONTEÚDO SEMPRE EM DESTAQUEO DESIGN DEVE SER PENSADO PARA FACILITAR A ASSIMILAÇÃO DO CONTEÚDO
![Page 9: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/9.jpg)
3. PROJETO ACESSÍVEL POR TODOSPROJETEMOS SEMPRE PENSANDO NA PREMISSA DE UMA “WEB ACESSÍVEL”
![Page 10: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/10.jpg)
4. LAYOUTS SEMPRE RESPONSIVOSCOM O CRESCIMENTO DE GADGETS MOBILE NÃO PODEMOS ESQUECÊ-LOS
![Page 11: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/11.jpg)
5. USE AS CORES COMO FUNÇÃOAS CORES NA WEB REPRESENTAM FUNÇÕES QUE FACILITAM PARA O USER
![Page 12: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/12.jpg)
6. USE ÍCONES SEMPRE QUE POSSÍVELÍCONES NA WEB SÃO COMO SINAIS DE TRÂNSITO PARA OS MOTORISTAS
![Page 13: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/13.jpg)
7. ESCOLHA DA TIPOGRAFIA CORRETAPREFIRA AS COM MELHOR LEGIBILIDADE E DISTINÇÃO DE CARACTERES
![Page 14: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/14.jpg)
8. PEÇA OPINIÃO DE OUTRAS PESSOASNINGUÉM MELHOR PARA VALIDAR NOSSO PROJETO DO QUE OS USUÁRIOS FINAIS
![Page 15: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/15.jpg)
ETAPAS DE CRIAÇÃODE UM PROJETO PARA WEB
![Page 16: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/16.jpg)
BRIEFING DO PROJETO
PLANEJAMENTO EM EQUIPE
ARQUITETURA DE INFORMAÇÃO
LAYOUT DO PROJETO
01LEVANTAMOS DE INFORMAÇÕES, MATERIAIS E OBJETIVOS DO PROJETO
PRAZO, LIMITAÇÕES, TECNOLOGIAS UTILIZADAS E EXCELENTE COMUNICAÇÃO02
03
04
DEFINIÇÃO DO WIREFRAME, RESOLUÇÃO, GRID E FUNCIONALIDADES DO PROJETO
PROPOSTA VISUAL FUNDAMENTADA A PARTIR DE TODO O PLANEJAMENTO
![Page 17: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/17.jpg)
BRIEFANDONOSSO PROJETO
![Page 18: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/18.jpg)
OBJETIVOS DO PROJETO
PÚBLICO ALVO A SER ATINGIDO
MATERIAL DISPONÍVEL
CONCEITO PRÉ-DEFINIDO?
01O QUE BUSCA? ESTRATÉGIAS? PRAZO? CONCORRENTES? FOCO MOBILE?
QUEM ATINGIREMOS? QUAL PARCELA DO PÚBLICO? SEGMENTAÇÃO POR CLASSES?02
03
04
O QUE TEMOS DISPONÍVEL? LOGO? CAMPANHA? CONTEÚDO? ALGUMA AGÊNCIA?
EXISTE ALGUMA IDEIA? ALGUM CONCEITO? JÁ EXISTE? CONCORRENTES?
OUTRAS INFORMAÇÕESDESTAQUES? PONTOS FORTES? PONTOS FRACOS? GERENCIAMENTO? ETC…
05
![Page 19: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/19.jpg)
PLANEJAMENTOJUNTO A EQUIPE DO PROJETO
![Page 20: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/20.jpg)
TRABALHO EM EQUIPE
EXCELENTE COMUNICAÇÃO
LIMITAÇÕES DA EQUIPE
TECNOLOGIAS UTILIZADAS
01DIFICILMENTE VOCÊ SERÁ UM PROFISSIONAL “FULL STACK”
COMUNIQUE-SE BEM, EXPONHA E DEFENDA IDEIAS E OUÇA BASTANTE02
03
04
É DE SUMA IMPORTÂNCIA ESSA NOÇÃO, SERA REFLEXO DIRETO DO PROJETO
O QUE USAREMOS PARA TAL RECURSO? DENTRE AS LIMITAÇÕES QUAL A MELHOR?
PRAZO INTERNOQUANDO FINALIZAREMOS CADA ETAPA? TUDO TESTADO? FUNCIONANDO 100%?
05
![Page 21: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/21.jpg)
ARQUITETANDOINFORMAÇÕES DO PROJETO
![Page 22: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/22.jpg)
DEFINIÇÃO DA RESOLUÇÃO
DEFINIÇÃO DO GRID
VIEWPOINT PRIMÁRIO
PLANEJAMENTO DA EXPERIÊNCIA
01QUAL RESOLUÇÃO NOSSO PROJETO IRÁ UTILIZAR? 1024X768? 1280X1024?
QUANTAS COLUNAS TERÁ NOSSO GRID? UTILIZAREMOS FRAMEWORK?02
03
04
O QUE ESTARÁ PRESENTE NA NOSSA ÁREA MAIS QUENTE DO SITE?
COMO SERÁ A NAVEGAÇÃO NO NOSSO PROJETO? QUAL EXPERIÊNCIA O USER TERÁ?
DESENHO DO WIREFRAMETOMADAS AS DECISÕES NECESSÁRIAS, VAMOS AO ESBOÇO DA ESTRUTURA
05
![Page 23: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/23.jpg)
APÓS ESSAS ETAPAS#PARTIU LAYOUT
![Page 24: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/24.jpg)
ENTENDENDOA ESTRUTURA DO LAYOUT
![Page 25: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/25.jpg)
1. ESCOLHA DO SOFTWARE DE CRIAÇÃOESCOLHA AQUELE QUE VOCÊ TEM MAIS FAMILIARIDADE E TE PROPORCIONA OS RECURSOS DESEJADOS. SOFTWARE JAMAIS FARÁ O SEU TRABALHO, DESAPEGUE POIS A MENTE PENSANTE POR TRÁS DELE QUE O CONTROLA.
![Page 26: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/26.jpg)
2. RESOLUÇÃO DE CONSTRUÇÃOCOM A EVOLUÇÃO DOS MONITORES E TELAS, CADA VEZ TEMOS RESOLUÇÕES MAIORES. PESQUISAS MOSTRAM QUE MAIS DE 67% DOS USUÁRIOS ATUAIS POSSUEM RESOLUÇÃO IGUAL OU SUPERIOR A 1024x768px.
![Page 27: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/27.jpg)
2048x1536px
Ipad Mini Tela Retina
![Page 28: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/28.jpg)
1280x800px
MacBook Pro 13pol
![Page 29: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/29.jpg)
RESOLUÇÃO DE TELATAMANHO DE TELA
diferente de
![Page 30: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/30.jpg)
UTILIZEMOS COMO PADRÃO1024X768PX
![Page 31: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/31.jpg)
3. CONSTRUÇÃO COM GRIDAPÓS DEFINIRMOS A RESOLUÇÃO QUE SERÁ FOCO NO PROJETO, SELECIONAMOS O GRID COMPATÍVEL COM ESSA RESOLUÇÃO.
HTTP://TABLELESS.COM.BR/DESIGN-RESPONSIVO-NA-PRATICA-DO-RASCUNHO-AO-DIGITA/
HTTP://PT.SLIDESHARE.NET/EDUARDOBRANDAO/A-IMPORTNCIA-DO-GRID-PARA-O-DESIGN-DE-INTERFACES-WEB
![Page 32: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/32.jpg)
GRID BOOTSTRAP - 940PX 12 COLUNAS
![Page 33: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/33.jpg)
gutter - 20px
column - 60px
container - 940px
screen resolution - 1024px
![Page 34: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/34.jpg)
LOGO MENU
DESTAQUE
INFO 02INFO 01 INFO 03
RODAPÉ
![Page 35: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/35.jpg)
4. USABILIDADE DO PROJETOPENSE SIMPLES, SE PONHA NO LUGAR DO USUÁRIO E TENTE PROJETAR A EXPERIÊNCIA MAIS SIMPLES E DIRETA POSSÍVEL FAZENDO COM QUE ELE NÃO PRECISE PENSAR MUITO TORNANDO AQUELE MOMENTO AGRADÁVEL E INTUITIVO.
HTTP://VIVERDEBLOG.COM/18-PROBLEMAS-USABILIDADE/
HTTP://WWW.DEVMEDIA.COM.BR/USABILIDADE-NA-WEB/24737
HTTP://PT.SLIDESHARE.NET/MASVIANNA/DESIGN-E-USABILIDADE-NA-WEB
![Page 36: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/36.jpg)
5. BUSQUE REFERÊNCIASÉ MUITO IMPORTANTE BUSCARMOS REFERÊNCIAS, ASSIM CONSEGUIRMOS ABSORVER ESTRUTURA, DETALHES, CRIAÇÃO TRAZENDO AQUELA INSPIRAÇÃO QUE PRECISAMOS PARA INICIAR A PARTE CRIATIVA.
HTTP://WEBCREME.COM/
HTTP://WWW.BEHANCE.NET/
HTTPS://DRIBBBLE.COM/
![Page 37: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/37.jpg)
INICIANDOO PROCESSO DE CRIAÇÃO
![Page 38: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/38.jpg)
1. MENOS É MAISO DESIGN DEVE SER SIMPLES, LIMPO, DIRETO E PLANEJADO DE FORMA QUE FACILITE A ASSIMILAÇÃO E ENTENDIMENTO DO CONTEÚDO.
![Page 39: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/39.jpg)
![Page 40: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/40.jpg)
![Page 41: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/41.jpg)
2. ESCOLHA BEM AS CORESA ESCOLHA DE UMA PALHETA DE CORES CORRETA PARA O SEU PROJETO É ALGO MUITO IMPORTANTE PARA O RESULTADO FINAL. USE TAMBÉM AS CORES COMO AÇÃO E SE BASEIE INCIALMENTE NO LOGO DO PROJETO.
HTTP://WWW.COLOURLOVERS.COM/PALETTES
HTTP://DESIGN-SEEDS.COM/
HTTP://COLOR.ADOBE.COM/PT/CREATE/COLOR-WHEEL/
![Page 42: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/42.jpg)
![Page 43: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/43.jpg)
![Page 44: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/44.jpg)
3. USE A TIPOGRAFIA A SEU FAVORSE USADA DE FORMA CORRETA E FOR BEM SELECIONADA, O USO DE TIPOGRAFIAS NO PROJETO PODE TRAZER UMA PERSONALIDADE ÚNICA E GERAR UMA EXPERIÊNCIA POSITIVA.
HTTP://WWW.FONTSQUIRREL.COM/
HTTP://FONTFABRIC.COM/CATEGORY/FREE/
HTTP://WWW.DAFONT.COM/PT/
![Page 45: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/45.jpg)
![Page 46: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/46.jpg)
![Page 47: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/47.jpg)
4. ESTRUTURAÇÃO INTUITIVASEMPRE ORGANIZE O CONTEÚDO DE SEU SITE DE FORMA INTUITIVA PARA QUE O USUÁRIO TENHA A MAIOR FACILIDADE POSSÍVEL DE ENTENDÊ-LO, LOCALIZAR-SE E ATÉ MESMO COMPARTILHA-LO.
![Page 48: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/48.jpg)
![Page 49: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/49.jpg)
![Page 50: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/50.jpg)
5. ABUSE DA CRIATIVIDADERESPEITANDO AS REGRAS EXISTENTES, VOCÊ PODE FAZER TUDO AQUILO QUE IMAGINAR. QUANDO POSSÍVEL PENSE “FORA DA CAIXA” E USE ISSO EM SEU PROJETO. LEMBRE-SE DE TER CAUTELA PARA NÃO CANSAR DEMAIS O USER.
![Page 51: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/51.jpg)
![Page 52: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/52.jpg)
![Page 53: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/53.jpg)
SUPER SEGREDOSPARA MELHORAR SEU LAYOUT
![Page 54: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/54.jpg)
1. EVITE UTILIZAR IMAGENS EM EXCESSOIMAGENS EMBELEZAM BASTANTE NOSSO LAYOUT, PORÉM TEMOS QUE DOSAR A UTILIZAÇÃO DELAS PARA EVITARMOS QUE NO FINAL O CARREGAMENTO DO NOSSO SITE FIQUE MUITO LENTO. ISSO É A PIOR COISA NA WEB.
![Page 55: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/55.jpg)
2. CUIDADO COM CORES “VIBRANTES”COMO O SUPORTE DE VISUALIZAÇÃO DA WEB É O MONITOR, O MESMO EMITE LUZ E SE TIVERMOS CORES VIBRANTES DEMAIS, ISSO CANSA A VISTA USUÁRIO FAZENDO-O DESISTIR DE CONTINUAR NO SITE. OPTE PELAS TONALIDADES PASTEIS.
![Page 56: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/56.jpg)
3. ATENTE-SE AO TAMANHO DA FONTEÉ MUITO IMPORTANTE A ATENÇÃO NESSE QUESITO, A LEITURA DO CONTEÚDO DEVE SER LINEAR E NATURAL, SE UTILIZARMOS FONTES PEQUENAS DEMAIS CANSAMOS NOSSO USUÁRIO. O IDEAL É UTILIZAR ALGO EM TORNO DE 14PX A 16PX A DEPENDER DO PROJETO. PARA OS TÍTULOS USEMOS UM TAMANHO MAIOR VISANDO IDENTIFICÁ-LO.
![Page 57: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/57.jpg)
4. ORGANIZAÇÃO SEMPRECOMO TUDO NA VIDA, A ORGANIZAÇÃO DO NOSSO LAYOUT, DAS CAMADAS E DAS IMAGENS É DE FUNDAMENTAL IMPORTÂNCIA PARA QUE O PRÓXIMO PROFISSIONAL CONSIGA IDENTIFICAR FACILMENTE OS ELEMENTOS DO LAYOUT. SEMPRE PENSEMOS COMO EQUIPE.
![Page 58: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/58.jpg)
5. OBSERVE, MAS NÃO COPIEUMA COISA QUE DEVE SEMPRE TER EM MENTE É NÃO QUEBRAR OS DIREITOS AUTORAIS DE NINGUÉM. VOCÊ PODE USAR UM TRABALHO COMO INSPIRAÇÃO, INCORPORAR ALGUNS ELEMENTOS GERAIS DE UM SITE, MAS DEVE COLOCAR “UM DEDO” SEU NA CRIAÇÃO, E NÃO SIMPLESMENTE COPIA-LO.
![Page 59: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/59.jpg)
6. SEMPRE FAÇA COM AMORNÃO DEIXE QUE PENSAMENTOS COMO “OPA! SOU UM GRANDE WEBDESIGNER” OU “QUANTO EU VOU GANHAR COM ISSO?” E “O QUE EU VOU FAZER COM ISSO?” FIQUEM TE MARTELANDO. AME O SEU TRABALHO, POIS ISSO É O QUE VOCÊ GOSTA DE FAZER E O QUE TE TRAZ FELICIDADE. O RESTO É APENAS CONSEQÜÊNCIA.
![Page 60: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/60.jpg)
7. A PRÁTICA LEVA A PERFEIÇÃONÃO TENHA PRESSA EM SER O MELHOR, O TEMPO E EXPERIÊNCIA FARÃO ISSO DE FORMA NATURAL. PRATIQUE, APRENDA COM SEUS ERROS, SE PERGUNTE SEMPRE ONDE POSSO MELHORAR? E SIGA EM FRENTE, POIS O SUCESSO É RESULTADO DESSAS ATITUDES.
![Page 61: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/61.jpg)
DÚVIDAS?SEM VERGONHA POR FAVOR
![Page 62: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/62.jpg)
OBRIGADO PELA ATENÇÃO!/ITALOWAXMAN
![Page 63: Workshop layout-pdf-141204083507-conversion-gate02](https://reader031.vdocument.in/reader031/viewer/2022032223/55c8c80abb61eb31718b456e/html5/thumbnails/63.jpg)
CHEGOU A HORA!VAMOS METER A MÃO NA MASSA