Hvordan går du fram i starten på ditt design?

[Boblesaft]

Hei!

Hvordan idemyldrer man hvordan layout skal være? Jeg har skisset ned og tegnet layout på et ark, og ideén virker god der og da, og så går jeg over i photoshop og prøver å lage et litt mer "shiny draft". Etter dette prøver jeg å skrive hele layouten i html og css, og så fyller jeg inn med grafikk fra photoshop.

Hele denne prosessen synes jeg er tungvind og kreativitet og motivasjon dør ut før jeg er kommet halvveis. Hadde vært fint å høre hvordan andre går frem når dere starter på et nytt webdesign.

Det skal sies at jeg har minimal erfaring med webdesign, og har såvidt html og css-kunnskaper, men nok til å kladde ned noen divser til et helt ordinært layout

- boblesaft

 

[Tonny Kluften]

Hopper over photoshopdelen, hvis du har designet i hodet trengs vel ikke et mer shiny draft?

 

[Ole Avranden]

Jeg begynner alltid i verdens mest usexy skisseverktøy: Excel.

I Excel får jeg styr på alle elementer som skal være med; innhold, SEO, struktur osv
Så fyrer jeg opp Photoshop og lager designet der, før jeg knoter i vei med DreamWeaver og får på plass html, css og så videre...

 

[TorsteinO]

jeg gjør det i bunn og grunn ganske likt som boblesaft, bortsett fra at motivasjonen ikke dør ut halvveis...

Adventures of Stevie V - Dirty Cash (Money Talks) - Official Video - YouTube

 

[spikre]

Jeg vet som regel hvordan jeg vil ha det. Jeg begynner med å definere alle elementene (maaaange divs), skrive dummy tekst og legge inn dummy bilder. Når jeg har fått med de største elementene begynner jeg med css.

Tips: Bruk et rammeverk i bunnen. Det er ganske vanlig å dele siden opp i 12 kolonner. Så kan du f.eks. gi hovedinneholdet 9 av kolonnene, og menyen 3. Det gjør det også mye lettere å skape egne sider for mindre skjermer (mobiler/nettbrett).

 

[adeneo]

Det kommer nok litt an på hva man skal gjøre.

Skal man lage noe for Wordpress, så starter man gjerne med Wordpress osv.

For egne sider som skal lages fra scratch, så begynner det gjerne med en idé om hvordan ting bør se ut, og utifra den idéen så kommer man gjerne på tekniske løsninger og hvordan nettsiden generelt bør fungere, og ikke minst hvilket behov den skal dekke, og derfra finner man ut hvilken webserver og databaser som passer best, det er for eksempel bortkastet med RDBMS hvis man ikke har behov for det, og Redis og MemCached er helt topp, men er bare egnet til enkelte ting.
Så er det noen dager for å sette opp det rette rammeverket, MVC eller lignende hvis det trengs, wrappere for databaser osv.

Når det er klart, begynner gjerne jeg med en tom hvit side, og gjør som spikre, hiver på med div'er, gjerne i farger som rød, grønn, blå osv for å lett skille de og få de responsive dersom det er målet, deretter alle de mindre elementene, og så CSS, og ettersom jeg forsøker å aldri bruke bilder til å style elementer, blir ikke resultatet alltid slik idéen var til å begynne med, og idéen endrer seg ofte etterhvert som man holder på, men det blir nå som regel en nettside av det uansett.

Nå skal det sies at jeg ikke er noen webdisigner, og åpnet photoshop sist en gang på nittitallet (mest fordi jeg foretrekker Corel) !

 

[soulmate]

Vet at mange bruker skisser og tegninger for å starte, men for min del fungerer ikke det. Jeg begynner på et design og deretter kommer ideene. Bruker også Dribbble - Popular for inspirasjon. Noe som alltid fungerer.

 

[PIP]

Som Adeneo så begynner jeg gjerne med Wordpress, da det er det jeg bruker som publiseringsverktøy. Deretter gjør jeg meg noen tanker om hvordan innholdet skal presenteres og hvilken funksjonalitet siden skal ha. Så designer jeg en skisse i PS, for så å finne et eksisterende theme som er nært opptil det jeg ønsker. Ser ingen grunn til å finne opp kruttet på nytt. Deretter tilpasser jeg themet så det er så nært opptil mitt design som mulig. Justerer litt her og der til jeg får fem min visjon.

 

[neptunio]

Hei.

Personlig starter jeg som regel med et framework, slik som Twitter Bootstrap eller Zurb Foundation. Det var nok mer vanlig før å starte med Photoshop, da mange grafiske elementer og effekter slik som gradients ikke var mulig å fremvise av nettleseren. Da var det normalt å bruke bitmap bilder.

Det er helt greit å bruke papir til å tegne skisser og gjøre seg en ide av designet, samtidig som det hjelper deg å huske neste morgen nøyaktig hva du hadde i tankene. Papir er også fint når du skal tegne et bilde av "the workflow", særlig om du jobber i team med en utvikler.

En god framework gjør rapid prototiping easy peasy. Jeg anbefaler at du lærer deg SASS ( Sass: Sass Basics ) eller Less (i tillegg til CSS). Det gir deg en rekke fordeler: variables, mixins, nesting osv..

Min 'development setup' ser slik ut nå:

- Sublime Text 2 som teksteditor
- Koala for compiling av Sass/Less
- Color Palette Generator - Colllor for farger og palettes

______________
Itbyen.no - Ledige stillinger innen IT.

 

[selbekk]

Mange flotte måter å være kreative på!

Personlig så tenker jeg over ting i denne rekkefølgen:
- hvem lager jeg siden for (hvem står bak) og hvordan profilerer de seg? (så får jeg stilen i hodet)
- hvem lager jeg siden for (publikumsmessig)? (så jeg vet hvordan jeg burde tune themet)
- hva slags funksjon skal siden fylle? (så jeg vet hva slags funksjonalitet jeg skal utvikle, og hvordan designen kan påvirke denne)?

Jeg er ganske flink med penn og papir i løpet av denne prosessen. når jeg har kommet frem til hovedpunktene, flyr jeg som regel igjennom 4-6 skisser med helt forskjellig utgangspunkt.

Når jeg har kommet frem til noe jeg liker formmessig, begynner jeg å titte litt rundt på lignende sider. Får jeg noen inspirasjon derifra prøver jeg å ta dette med i skissene.

Til slutt begynner jeg med en fresh mappestruktur (slik som denne)
- og begynner å kode. Designet tar mer form og farge etterhvert som jeg fortsetter denne prosessen.

Og før jeg kommer for langt husker jeg på å briefe hvem enn kunden er for å passe på at de er med på laget