Tags: Desenvolvimento, Design, Produtividade, Web 
Deixe seu comentário!
Criação de um layout: Photoshop ou HTML?
Atigamente, nos layouts em que desenvolvia, eu sempre pensava no estilo da página “mentalmente” e partia direto pro HTML. Ia montando a página passo-a-passo: do cabeçalho ao rodapé.
Sempre soube que vários designers preferem abrir o Photoshop, desenvolver toda a identidade visual do site, e depois, aí sim, converter tudo pro HTML. Aliás, fiz isso pela primeira vez exatamente com o layout que está atualmente aqui no blog.
Mockup do atual layout no Photoshop
Gostei bastante do resultado final e desse método de desenvolvimento, mas há um tempinho atrás me deparei com um post do blog da 37signals: “Why we skip Photoshop?” (”Porque fugimos do Photoshop?”), que me levou a pensar mais sobre esse assunto.
Pra quem não sabe, a 37signals é uma compania que, entre outros produtos, criou o Basecamp e lançou o Ruby On Rails. Ou seja, o conhecimento deles com relação à web é gigantesco e muito válido.
O artigo em questão, cita alguns tópicos sobre o porque da 37signals não adotar o Photoshop no desenvolvimento inicial do layout. Entre os pontos citados, destaco alguns:
- Você não pode clicar em um mockup feito no Photoshop, eles não são reais. E se está na tela, deve funcionar.
- Quando você muda alguma coisa em um mockup, precisa exportar para gif/jpg/png… e enviar para o cliente. Utilizando o HTML você altera uma simples linha no CSS e pede ao cliente que atualize a página.
- Photoshop não é uma ferramenta de colaboração, isso recai no item anterior. Enquanto você precisa mudar algumas linhas de código no HTML para fazer uma simples mudança, no Photoshop você provavelmente terá que enfrentar várias ferramentas.
Na minha opinião, o ponto mais crítico citado por eles tem forte relação com a produtividade, o Photoshop não oferece uma flexibilidade na hora de alterar o “mockup” feito. E pensando bem, isso é verdade.
Nos trabalhos que desenvolvi anteriormente, usei o conceito do “refresh”: atualizo o CSS/HTML e a pessoa simplesmente recarrega a página. Funcionou muito bem.
No estágio aonde trabalho, o Photoshop no estágio inicial não funcionou como deveria. Isso me leva a pensar que cada caso é um caso, que precisa ser analisado cuidadosamente.
De qualquer maneira, é sempre necessário um estudo inicial, algo que lhe diga para qual caminho o trabalho deve seguir. Pode ser um esboço, sites de referências ou qualquer outro material extra, mas ele precisa existir.
O uso, ou não, do Photoshop precisa ser pensado: ele pode trazer uma maior produtividade. Ou não.
Romulo
Carol
Josdigital
Parece que usar o Photoshop só é útil quando você precisa apenas mostrar algo para si mesmo.
Se mais gente vai colocar a mão não funciona.
Concordo com você Raphael.
Na hora de criar todos os componentes do layout o Photoshop ajuda mais que ir direto pro HTML/CSS (na maioria dos casos), mas em projetos conjuntos isso nem sempre é a melhor opção.
Realmente seria uma melhor opção mostrar como ficaria na versão HTML/CSS. O problema maior, pelo menos nas agências digitais é o tempo que isso pode acontecer. Raramente, o projeto tem um prazo longo e a equipe de desenvolvimento tem o tempo necessário para fazer tais produções, então, sempre deixando qualquer tipo de alteração para o final do projeto.
Esse é um assunto que gera bastante controversa. Uns preferem fazer direto no HTML/CSS, outro preferem “desenhar” a página toda no Photoshop.
Um amigo está fazendo um theme para WordPress no Photoshop, e depois exportará para HTML/CSS.
Eu, geralmente, quando começo algo, já vou no HTML/CSS, mais pela praticidade para atualizar, etc, porém, me disseram que é bom usar o Photoshop para colocar a idéia inicial na tela.
Bom, vou ver se no próximo trabalho, utilizo o Photoshop para desenhar o layout, talvez eu goste.
Abraços,
Newton Calegari
Usar o Photoshop pra colocar a idéia inicial na tela funcionou muito bem pra mim, Newton!
E o processo de passar tudo pro HTML/CSS também foi bastante rápido, como já tinha tudo pronto, pensar na estrutura da página fica muito mais fácil.
E ai Alonso, olha eu aqui…
Bom, antes de mais nada, parabéns pelo blog. E agora falando a respeito do post ai, é o seguinte, eu já venho trabalhando com photoshop/fireworks para desenvolver a estruturas de sites a algum tempo, e isso sempre me ajudou a ser mais produtivo e desenvolver layouts mais “legais”.
Mas concerteza, em uso corporativo a produtividade cai bastante.
No mais, parabéns novamente pelo blog e no final das contas eu acho q não falei coisa com coisa…hehehe
Abração…
Boas férias
Eu uso o Photoshop para desenhar desde simples wireframes até ao mockup completo: é mais rápido do que fazer o xhtml/css, e você não sabe se o cliente vai querer aquela versão.
Pra quem é freelance, recursos de colaboração no software são desenecessários. E não creio que seja tão difícil fazer alguma alteração.
E posso criar várias “páginas”, armazenando em camadas e em folders.
Abraços!
Em compensação, tem profissionais que são coders. Ou seja, cobram determinado valor apenas para escrever o código de um layout que só existe no Photoshop.
Também já vi designer vendendo o design, mas sem incluir o código. Ou seja, o comprador tem a imagem mas precisa codificar - ou contratar alguém que o faça.