Metodologia antiga de desenvolvimento ?

[Rodolfo TI 6]

Bom dia meus caros tudo certo ?

 

Estou um pouco em dúvida, sei um pouco de php, um pouco de java, um pouco de html, de tudo um pouquinho como todo iniciante, domino a ferramenta photoshop, e gostaria de saber se a utilização dessa ferramenta para criação de layouts hoje é considerada uma metodologia interessante

 

Porque dessa pergunta?

 

Primeiro: aplicativos móveis, design responsivo

Segundo: Largura de Banda em Conexões 3g , baixa velocidade logo, um site com muitas imagens demora a carregar.

 

Tenho facilidade em desenhar o layout no photoshop mas uma grande dificuldade em passar este do photoshop para o html com css ... Isso me desanima as vezes.

 

Quero atuar com alguns freelancers pra complementar a renda, mas me preocupo em oferecer um serviço de qualidade, qual seria uma boa metodologia a seguir ?

[bruno_mosciatti 22]

Olha, o Photoshop é a principal ferramenta para se montar um layout. Também é interessante o auxílio de um wireframe previamente, junto a um brainstorm do projeto, ok?

 

Posso te ajudar a passar para HTML/CSS sem problemas! Me procure.

[Rodolfo TI 6]

Olha, o Photoshop é a principal ferramenta para se montar um layout. Também é interessante o auxílio de um wireframe previamente, junto a um brainstorm do projeto, ok?

 

Posso te ajudar a passar para HTML/CSS sem problemas! Me procure.

 

Entendi, você utiliza photoshop ? Usa aquela ferramenta fatia pra exportar o site ? ou salva imagem por imagem ? separando as camadas e tal ?

[bruno_mosciatti 22]

Entendi, você utiliza photoshop ? Usa aquela ferramenta fatia pra exportar o site ? ou salva imagem por imagem ? separando as camadas e tal ?

 

Sim.

Eu salvo imagem por imagem, utilizando o Crop do Photoshop.

[Rodolfo TI 6]

Sim.

Eu salvo imagem por imagem, utilizando o Crop do Photoshop.

 

Aos poucos desabilita a camada e vai posicionando com css ? Correto ?

Uso z-index para as camadas e tal.

 

E os forms, como tem trabalhado ? Desenha no ps e tal ? Como colocar a caixa de texto ?

[bruno_mosciatti 22]

Cara, calma lá. Você não quer que eu (ou alguém do fórum) explique passo a passo como replicar um site, não é mesmo? Você disse que está à procura de um freela para fazer isso, me coloquei à disposição.

 

Não tem essa de desabilitar camada e usar z-index.. Ao meu ver, não trabalha-se com diversas camadas no CSS, apenas em certo casos e aí sim utilizamos o z-index e position relative.

 

A caixa de texto (input) se for normal, você não se preocupa.. Faz ela no HTML. Agora se tiver algum detalhe como um bg diferente e etc, você pode exportar a imagem do input e definir como bg dele depois.. Cantos arredondados também fazemos por css.

[Rodolfo TI 6]

 

Quero atuar com alguns freelancers pra complementar a renda, mas me preocupo em oferecer um serviço de qualidade, qual seria uma boa metodologia a seguir ?

 

Quero atuar com alguns freelancer, me referia a alguns trampos como freelancer, digo, eu irei fazer os freelancers, os jobs.

Desculpe se me expressei mal.

 

 

Não tem essa de desabilitar camada e usar z-index.. Ao meu ver, não trabalha-se com diversas camadas no CSS, apenas em certo casos e aí sim utilizamos o z-index e position relative.

 

A caixa de texto (input) se for normal, você não se preocupa.. Faz ela no HTML. Agora se tiver algum detalhe como um bg diferente e etc, você pode exportar a imagem do input e definir como bg dele depois.. Cantos arredondados também fazemos por css.

 

Entendi, sempre fico um pouco em dúvida na relação entre camadas do photoshop e camadas dentros das divs.

 

Enfim esse não é o intuito do tópico em outras oportunidades falando sobre o desenvolvimento em si trataremos esse assunto, obrigado pelas respostas.

[tzp 24]

Eu salvo imagem por imagem, utilizando o Crop do Photoshop.

isso que ter muito tempo livre. vc ta bem nao usa imagens pra inputs so se fizer questao de ter borda redonda.

 

primeiro de tudo vc cria um wireframe, isso serve pra planeja o site onde vai fica cada coisas nele o tamanho e etc, existe varias ferramentas pra isso,muitas delas suporta coloca uns efeitos, por exemplo mostra no proprio wireframe oque acontece quando click em um link ou menu, no meu caso eu imprimo uns papeis com bolinhas e faço a mao mesmo,

 

existe varias discussoesse se deve usa o photoshop pra criar o layout do site e depois passar pro html, por causa do design responsive o tela do photoshop nao muda de tamanho, por isso em alguns casos as pessoas faz todo layout no proprio navegador.

 

mas no mundo real a maioria do sites que um freelancer faz nao tem muito conteudo pq normalmente os clientes nao sao muito grandes entao um layout 960px e ja serve pra um pc e tablet so tem que muda um pouco as coisas pra funcionar em um celular.

 

no photoshop pode usar sim o fatiar(slice) em imagem, mas muita coisa vc pode fazer em css tipo como botoes, vc criar um layout as paginas do site e etc, depois vc cria um documento novo e coloca o icons pra criar um sprite ia cria mais um onde vai fica o UI template que vai conter vai os forms menu botao avisos e etc ta bem onde vai desenhar como vai se quando tiver o mouse em cima deles como fica ativado, vc pode salva eles como imagem pra cria um fallback pra navegadores antigas e criar o resto com css3.

 

existe 2 plugins que transforma as coisas feitas no photosho em codigo de css3 um e pago o outro gratis.

 

desculpa o erros de ortografia eque ja estava quase de saida quando vi o topico e tive que fazer rapido , espero ter ajudado e se tiver alguma duvida so pergunta

[Rodolfo TI 6]

isso que ter muito tempo livre. vc ta bem nao usa imagens pra inputs so se fizer questao de ter borda redonda.

 

primeiro de tudo vc cria um wireframe, isso serve pra planeja o site onde vai fica cada coisas nele o tamanho e etc, existe varias ferramentas pra isso,muitas delas suporta coloca uns efeitos, por exemplo mostra no proprio wireframe oque acontece quando click em um link ou menu, no meu caso eu imprimo uns papeis com bolinhas e faço a mao mesmo,

 

existe varias discussoesse se deve usa o photoshop pra criar o layout do site e depois passar pro html, por causa do design responsive o tela do photoshop nao muda de tamanho, por isso em alguns casos as pessoas faz todo layout no proprio navegador.

 

mas no mundo real a maioria do sites que um freelancer faz nao tem muito conteudo pq normalmente os clientes nao sao muito grandes entao um layout 960px e ja serve pra um pc e tablet so tem que muda um pouco as coisas pra funcionar em um celular.

 

no photoshop pode usar sim o fatiar(slice) em imagem, mas muita coisa vc pode fazer em css tipo como botoes, vc criar um layout as paginas do site e etc, depois vc cria um documento novo e coloca o icons pra criar um sprite ia cria mais um onde vai fica o UI template que vai conter vai os forms menu botao avisos e etc ta bem onde vai desenhar como vai se quando tiver o mouse em cima deles como fica ativado, vc pode salva eles como imagem pra cria um fallback pra navegadores antigas e criar o resto com css3.

 

existe 2 plugins que transforma as coisas feitas no photosho em codigo de css3 um e pago o outro gratis.

 

desculpa o erros de ortografia eque ja estava quase de saida quando vi o topico e tive que fazer rapido , espero ter ajudado e se tiver alguma duvida so pergunta

 

 

Muito bom, então a idéia é começar como freelancer mesmo mas ir crescendo, começar de baixo é interessante, acho que posso somar muito aprendizado com isso. E aos pouscos poder atingir clientes maiores, lógico começar com calma, sem pressa.

 

Vou conferir esses plugins, realmente nao conhecia , já usou pra um site todo ?

 

Alguns defendem a idéia de que hoje o site deve ser todo em css / html , sem levar em consideração dinamisco em animações, falo com o foco de imagem, em não usá-las, Você comentou um pouco, acha que para começar deveria seguir essa metodologia, se é que posso chama-la assim ?

 

@offtopic: esquenta com os erros não, entendemos código mal comentado quem dira uma letrinha ou outra que faltou, Hhahahaaha ;x

[tzp 24]

Alguns defendem a idéia de que hoje o site deve ser todo em css / html , sem levar em consideração dinamisco em animações, falo com o foco de imagem, em não usá-las, Você comentou um pouco, acha que para começar deveria seguir essa metodologia, se é que posso chama-la assim ?

 

seria bem dificil um site 100% em html e css mas entendo oque quis dizer, acho que depende do bom senso da pessoas que ta fazendo o site, exemplo vc cria um botao que tem um gradiente e uma sombra vc pode facilmente criar isso em css3 nao precisaria de uma imagem dele, agora imagem que vc queira coloca uma imagem de um iphone no seu site vc a te poderia fazer um iphone em css3 mas imagina quanto codigo de css3 e html tem nele entao pra deixa o codigo mais bonita e mais facil a manutençao as vezes e melhor usar imagens.

 

na parte animaçoes se vc lembra bem da era dourada do flash na web, um site em flash o importante nao era o conteudo e sim o efeito que tinha nele com o html5 as pessoas começo a da importancia pro conteudo. agora tem muito menos efeitos por serem mais dificil de fazer e por tem menos efeitos oque tem agora sao mais farolizados, antigamente todo site em flash tinha efeitos entao mesmo que seu site tivesse algum efeito nao era la grande coisa pq todos tinha.

 

tem 2 efeitos muitos legais em html5 o parallax eo 3d

 

 

 

Vou conferir esses plugins, realmente nao conhecia , já usou pra um site todo ?

 

ja testei o 2 acho meio ruim fica gerando o codigo e depois ter que copiar e colocar no meu codigo de css como ja decorei bem como faz bordas sombra e etc no css3 nao uso com muita frequencia , mas pra quem ta começando e maior mao na roda.

 

vou tenta explica como eu faço pra passar o layout do photoshop pro html, primeiro eu uso 2 monitor em um deixo meu edito de texto(uso o sublime text 2) em outro o photoshop,e importante deixa as camadas no photoshop arrumadas dentro do pastas entao por exemplo um head de um site tenho a pasta no photoshop head no photoshop dentro delas tenho uma camada com o fundo outro com o logo e menu,ai quando vc começa fazendo o html do site como ja vai ta arrumando as coisas no photoshop vc ja vai saber a quantidade certa de coisas que vai ter que criar em html, ai depois de ter o html pronto vc passa pro css vc pode usar para ajuda no codigo less ou sass, como isso vai pode criar variaveis entre outras coisas, tem outras coisas que ta bem pode se util como o bootstrap eo foundation pra criar o grid do site e ja vem com varias coisas pronto com e botoes coisas em javascript como light box menu accordion etc.

[Rodolfo TI 6]

, tem outras coisas que ta bem pode se util como o bootstrap eo foundation pra criar o grid do site e ja vem com varias coisas pronto com e botoes coisas em javascript como light box menu accordion etc.

Meu caro, tu explica muito bem, parabéns e muito obrigado!

 

Não vi em momento algum você falar sobre tabelas, grid sim, tabelas não.

 

Vi conceitos de tableless é altamente usual hoje? Ainda não pude conferir todos o links mas o farei.

 

Grande abraço!