1. Este site usa cookies. Ao continuar a usar este site está a concordar com o nosso uso de cookies. Saber Mais.

Qual a vossa metodologia para design de layouts?

Discussão em 'Web Development' iniciada por shello, 4 de Julho de 2008. (Respostas: 11; Visualizações: 1195)

  1. shello

    shello Moderador
    Staff Member

    Viva Pessoal!

    Inicio esta thread com a ideia de partilharmos aqui algumas metodologias para design de layouts de websites.

    Deixo aqui a minha pegada:
    Eu costumo começar por fazer alguns rabiscos no meu quadro branco ou numa folha de papel que esteja à mão. Não costumo detalhar muito, excepto algum eventual pormenor importante. Faço também algumas anotações à volta do layout.
    Depois disto disto costumo olhar para cores, ao mesmo tempo que vou estruturando em XHTML/CSS.


    Já agora, a ideia para este tópico veio na sequência de encontrar este link: http://konigi.com/tools/graph-paper (via del.icio.us).
     
  2. DarkWolfXP

    DarkWolfXP Power Member

    Bem acho este topico uma excelente ideia!! Estarei com certeza de olho neste topico :D
    Deixo aqui o meu metodo:
    Primeiro esboço num papel a estrutura que pretendo, apos ter a estrutura feita pinto as unidades das estruturas com as cores que o site irá ter. :p
     
  3. Rach n' Roll

    Rach n' Roll Power Member

    normalmente começo pelo modelo conceptual, definir os conteúdos, e depois passar à prototipagem...costumo fazê-lo em illustrator, e depois " copy paste " para o flash (isto porque não me consigo habituar a fazer o design em flash).

    p.s. só uso o flash, porque não sei muito bem trabalhar com html/css (mas estou a aprender)...

    ah e aconselho que "percam" algum tempo com testes de utilizador. por vezes já estamos tão embrenhados no trabalho, que pormenores importantes da navegação passam-nos ao lado...
     
    Última edição: 4 de Julho de 2008
  4. greven

    greven Folding Artist

    Pego numa folha, normalmente já muito riscada e risco ainda mais. Depois de já estar tudo tão riscado que não percebo nada vou buscar uma folha limpa e como já não percebo nada do que desenhei, volto a desenhar tudo de novo. Depois vou aos meus bookmarks e vejo uns layouts para me inspirar se estiver difícil de sair alguma coisa. Por fim faço uns divs de teste e começo a mexer em CSS, a minha parte preferida. :)
     
  5. m.costa

    m.costa Power Member

    Txi, toda a gente usa folha ? :P

    Eu depois de ter uma ideia geral do que quero começo directamente em photoshop (ou illustrator antes, se for caso disso), depois de pronto faço as slices ja' a pensar na disposição/divs/layout e por fim e' so' escrever o xhtml/css e encaixar tudo direitinho

    Caso precise de uma inspiraçãozinha dou uma volta pelos apanhados da smashing magazine, normalmente basta que aquilo tem de tudo x)
     
  6. metRo_

    metRo_ Power Member

    Normalmente não tenho metodo de trabalho, e deixo o aviso que é muito mau, parece-me que este tópico é muito bom para dar ideias para melhorar metodos de trabalho... :)
     
  7. mags

    mags Power Member

    conforme o que é pedido faço uma boa olhadela pela net e vejo o que ja existe, o que se pode fazer e o que se pode melhorar...assim como estruturas e etc de outros sites.
    faço um esboço do possível layout, disposição do conteudo, defino a estrutura de conteúdos.
    o desenho é todo feito em photoshop (pois o photoshop trabalha com o bitmap, o pixel...logo consigo ver tal e qual como se fosse um site - textos, cores, tamanhos com a visualização a 100%...isto porque estranho um pouco as pessoas fazerem em ilustrator ou freehand e ser dificil pre-visualizar as fonts sem o anti-aliasing, etc...isto para html...digo eu).
    já dou alguns passos em flash e dreamweaver...mas a nivel da universidade este ano passei a desenhar layouts, para o próximo ano vem a montagem.
     
    Última edição: 5 de Julho de 2008
  8. mascker

    mascker Power Member

    Boas,

    Normalmente não sou eu quem faz o design, mas tudo começa com a definição dos conteúdos que serão colocados no site, a prioridade que cada um tem em relação ao outro, isto em formato digital normalmente no omnioutliner.

    Analiso o mercado-alvo, a partir disso começo a definir o que deverá constar na homepage e quais serão as secções principais do site.

    Defino que tipo de design será (algo com ar de profissional com cores fortes e estrutura bem definida, ou algo mais livre como o site da mozilla, etc, etc.). Mas tudo depende do mercado-alvo.

    Depois faço uns desenhos no papel da homepage e das secções principais, algumas cores, e tal. Depois de estar como quero abro o photoshop, selecciono a ferramenta do rectângulo e começo a fazer um esboço com a organização, as cores.

    Depois falo com o designer e entrego-lhe o ficheiro do photoshop.

    The end

    Saudações.
     
  9. Jammin @

    Jammin @ Power Member

    Passo directo para o photoshop e vou pensando por ai.
     
  10. Guerreiro_21

    Guerreiro_21 Power Member

    eu começo por saber o que ira conter o site
    depois faço uma pekena pesquisa pela net a ver o qque existe relacionado com o tema em questao e tiro umas ideias .

    faço uns riscos no papel para a home
    depois paço para fireworks ou photoshop e apartir da home desenho o resto do design

    e so depois flash ou dreamweaver

    abraço

    vou tar a tento ao topico :)
     
  11. kryo

    kryo Power Member

    papel > barebone em photoshop > template > codigo

    basicamente, desenho em papel a estrutura, conteudos e look geral, simplisticamente, depois avanço para o photoshop, onde marco espaçamento, determino o "onde" e o "que", sem realmente desenhar, apenas marcar a preto e branco os traços gerais, se for realmente o que eu esperava, ai sim, passo para o design, leva as cores, a formataçao, o bling bling. depois é começar a criar o codigo.
     
  12. souto

    souto To fold or to FOLD?

    Embora não seja a minha área, sempre tive uma panca por web design.
    Normalmente, desenho numa folha, para ter uma noção básica das proporções. Vou desenhando, redesenhando, redesenhando... (redesenho outra vez) e quando estiver algo que me satisfaça minimamente páro. Depois CSS + xHTML, que já começa a ser mais interessante.


    Mas do que gosto mesmo é de programar os backoffices e as funcionalidades, sem dúvida :)
    Prefiro deixar o design a sério para quem percebe da coisa. Embora não me desligue das tendências naturalmente (gosto de estar sempre em cima de tudo o que é novidade :))

    Nada como ter um PSD e o browser já com XHTML e CSS lado a lado. Dá uma sensação de accomplishment engraçada :)

    PS:
    Acho que o que me custou mais foi tentar converter um design com três colunas, tive que fazer tanto hack que até me assustava só de olhar para o CSS. Depois ia ao IE e tudo bem. Abria no firefox, tudo bem. Abria no opera... Parecia um aborto :D

    Felizmente actualmente já não é preciso praticamente nenhum desses hacks, o que facilita bastante. Hoje em dia, quando vejo que aquele design é problemático, tenho tendência a rejeitá-lo.

    Por exemplo, este layout, feito por um amigo e membro aqui do fórum, o kilOmbo, e convertido por mim e pelo Tekker, a whore aqui da TZ :D, para prototipagem:

    [​IMG]

    Foi dum projecto que propusémos à junta, entretanto não nos disseram mais nada. Devem ter morrido :D
    Mas se se quiserem assustar, façam favor
     
    Última edição: 9 de Julho de 2008

Partilhar esta Página