Den praktiske håndboken for webdesign arbeidsflyt
Som webdesigner som er en del av et større webutviklingslag, er det vanlig at du må sjonglere mange oppgaver samtidig.
Etter å ha laget noen første designutkast for klienten din, og nå venter på den første tilbakemeldingen, er du sannsynligvis ganske spent på hvordan arbeidet ditt vil bli oppfattet av kunden. Med så mange ting å overvåke i en streng tidsramme, er det lett å bli overveldet av prosjektets kompleksitet. Det er mange trinn involvert i å designe et nettsted eller en app. Disse trinnene varierer litt fra person til person, men den grunnleggende arbeidsflyten forblir den samme.
Med en god arbeidsflyt satt opp og med noen få verktøy og programvare, vil du enkelt holde ballen rullende og unngå lange tilbakemeldinger.
Her er en praktisk veiledning til en design arbeidsflyt som du kan bruke til å øke produktiviteten til teamet ditt.
Forberedelsesfase: Forvaltning av forventningene
Uansett om du bare opprettholder et eksisterende nettsted eller utformer et nytt nettsted fra bunnen av, må du og din klient styre hverandres forventninger.
Mens hovedansvaret er å forstå kravet til prosjektet i detalj, er klientens ansvar å forstå hvordan hvert valg som er gjort påvirker omfanget og budsjettet til prosjektet, med hjelpen.
La kunden få vite om den nødvendige teknologien, det nødvendige budsjettet og tidsrammen som kreves for å fullføre prosjektet. Å nærme prosjektet på en organisert måte, vil spare tid, innsats og budsjett.
Fase 1: Definere nettstedsmål
Dette er trolig den viktigste fasen i et hvilket som helst designprosjekt når du definerer målene, setter opp den overordnede strukturen, bestemmer innhold og tildeler roller og ulike leveranser gjennom hele prosjektet. Ved å sette opp riktig planlegging fra begynnelsen, redder du deg selv fra mye sorg senere.
Her jobber du med klienten for å etablere tidsplan, budsjett, tidslinje, tekniske behov, visuell stil og innholdsstruktur for målgruppen.
Når du håndterer forventninger og begynner med designprosjektet, vil jeg anbefale å bruke en mager og brukervennlig prosjektstyring for å holde rede på definerte mål, budsjetter, oppgaver og tidsplaner.
Trello
Trello er et velkjent og brukervennlig prosjektstyringsverktøy. Det lar deg lage forskjellige brett for ulike prosjekter. Med Trello kan du få en rask oversikt over strømens oppgaver og din backlog.
asana
asana er flott å gjøre, og oppgavesporing. Du kan til og med samarbeide med kolleger og klienter i Asana, som gjør at du kan holde prosjektet ditt gjennomsiktig og alle oppdatert.
Basecamp
Et annet godt kjent, men likevel stort prosjektstyringsverktøy er Basecamp . I likhet med verktøyene nevnt ovenfor, lar det deg og teamet holde deg oppdatert om hvert prosjekt som kan leveres, og gjør det mulig å holde styr på.
Fase 2: Utvikle nettstedet struktur og få hendene skitne
Nettstedstrukturen danner ryggraden på nettsiden. Det fungerer som en referanseguide for teamet gjennom hele prosjektets varighet. Bruk flytdiagrammer til å vise strømmen av strukturen.
Sitemap: Opprette et nettstedkart er avgjørende for å forstå innholdsorganisasjonen. Det er viktig å fortsette å oppdatere sitekartet etter hver endring. Hvis du ikke gjør det, blir det rotete.
Wireframe: Innholdet på nettstedet må løses før design og grafikk settes på plass.
Wireframes er skreddersydde av nettsiden eller mobilapplikasjonen. Wireframes brukes til å lage plassholdere for innhold, etablere prioriteringer for elementer på siden, og å dokumentere krav. Dette blir svært viktig i neste fase.
Balsamiq
Balsamiq er et grafisk wireframing-verktøy som hjelper designeren til å lage mange motiver og deretter arrangere de forhåndsbygde widgets i en dra-og-slipp-editor for teamet å se og foreslå endringer samtidig.
Moqups
Moqups er enkel å bruke, har mange dra og slipp-funksjoner og krever ikke en nettleser-plugin for å betjene. Du kan enkelt arrangere en design presentasjon for klienten din ved hjelp av dette verktøyet.
Invision
Invision lar deg laste opp arbeidsdesign og skape interaksjoner ved å bruke hotspots, akkurat som alle virkelige applikasjoner. En av sine standout-funksjoner er muligheten til å sende klikkbare design til telefonen via SMS, og understreker viktigheten av å kunne teste designene dine selv i riktig sammenheng.
Notism
Notism er et av de beste verktøyene som kreative lag bruker til å øke sin arbeidsprosess. Dette er en design og video samarbeid plattform. Det hjelper kreative fagfolk med å dele prosjektet og motta tilbakemelding via skisser og notater. Notism gjør det også mulig å lage forskjellige versjoner av en skjerm. Ved å bytte enkelt mellom forskjellige skjermer, kan du få bedre oversikt over prosjektets utvikling.
Fase 3: Design og produksjon
I denne fasen må du sørge for at designeren jobber sammen med programmereren for å sikre implementering av sammenhengende designelementer.
Etter at klienten har godkjent designforslagene, jobber designeren og grafikklaget på utseendet og følelsen av nettstedet. Komprimering, gjennomsiktighet, effektiv bruk av farge og design kombineres for å skape effektiv webgrafikk.
Produksjonsfasen er et punkt der den faktiske nettsiden er opprettet. Etter at utformingen og utformingen av nettstedet er ferdig, går området inn i den tekniske delen av arbeidet. Her vil du ta alle de enkelte grafiske elementene fra prototypen og bruke dem til å lage det faktiske, funksjonelle nettstedet.
GitHub
Koden din endres en gang, to ganger, og sannsynligvis mye mer enn det. GitHub lar deg jobbe effektivt med ulike versjoner av nettstedet ditt. Verktøyet skinner virkelig når du jobber sammen med et team av utviklere. Dette er kodesamarbeid på sitt beste.
CodePen
Denne er nydelig. Det er en online editor for alle dine HTML, CSS og JS behov. Den kombinerer lett med Github og er selvsagt samarbeidende. Tanken er å kunne teste stykker kode og finne en skikkelig løsning uten å rote opp resten av koden.
Fase 4: Testing, samle tilbakemelding og fikse feil
Ingen prosjekt er noen gang virkelig uten feil. Og selv om testing er noe som er gjort gjennom hele utviklingsprosessen, vil det alltid være feil igjen. Og vi snakker ikke bare om programvare bugs. Selv et design kan være buggy.
Så nå er det viktig å begynne å teste som gal. Tidlig feilsøking sparer mye tid og krefter. Det er avgjørende for alle som deltar i etableringen av nettstedet å være involvert i testing. Testing bør imidlertid være en smidig prosess. Når du har lansert nettstedet eller er i ferd med å lansere det, vil mange mennesker begynne å bruke det og gi tilbakemelding på nettstedet.
Og selv om du legger inn alt du kan for å teste nettstedet, vil du ha gått glipp av et par feil eller nye vil dukke opp over tid. Det er viktig at du får informasjon om feil og problemer så snart som mulig. Hvis du kan få brukerne til å rapportere disse til deg, er du gyldig.
Usersnap
(Fullstendig avsløring: Jeg jobber for Usersnap.) Vi bygget Usersnap som en visuell feilsporing og tilbakemelding verktøy som letter arbeidet med software testing. Det gjør det mulig for kunder, besøkende og kollegaer å rapportere feil, endre forespørsler eller bare tilbakemelding på nettstedet ditt. Også for manuell testing av nettsider er Usersnap en sikker innsats, siden det øker testprosessen din gjennom brukervennlige verktøy.
Så, for å oppsummere ...
Designprosjekt krever at mange mennesker jobber sammen. Konstant tilbakemelding er en av de viktigste delene av å levere et prosjekt som forespurt av klienten og innenfor de angitte tidslinjene. Med alt dette rot og det faktum at nettsteder blir mer komplekse hver dag, gjør nettverksverktøy det enkelt å fullføre arbeidet blant alle involverte og få øyeblikkelig tilbakemelding fra dem.
Integrering av disse verktøyene i en solid arbeidsflyt, hjelper deg virkelig å finne hvor du trenger å være i et allerede konkurransedyktig felt.