SlideShare a Scribd company logo
Kravställning i webbprojekt

    Maria Sognefors, 7minds
Kravställning i webbprojekt
Alla vill/måste jobba digitalt
Antal
företag




                                   År
Kravställning i webbprojekt
Jag vill beställa ett
     badrum!
Det fixar vi!
Billigt blir också!
Nu är det klart!
Men det var ju inte   Men det fungerar ju!
 vad jag menade!      Vi kan ju göra om, om du
                       vill, men det kostar ju.
Kravställningens faser

                                                               Detalj-
Mål/Syfte             Teknik             Design                 spec



      Funktionsspec              Wire-            Redaktörs-
                                frames              flöde




                               Förankring
Mål/Syfte/Effektkartläggning
   Ni MÅSTE veta:
     – Varför ni ska ha lösningen?
     – Vad ni vill uppnå med den?

   Alla mål måste vara mätbara

   Vem vänder ni er till
     – Vilka behov har dessa?

   Prioritera ut 2-3 viktigaste sakerna
     – Fokusera på att göra få saker bra
     – Bygg på efterhand
Funktioner styrs av behov
   Om ni ska kunna uppnå era mål/effekter
     – Vilka funktioner krävs?
     – Vilka redaktionella konsekvenser får ett visst krav?

   Låt målen styra, så att ni inte hamnar i funktionsträsket
     – Tusen önskemål på saker som
       egentligen ingen vill ha
Teknik
   Ta tidig reda på vilka krav ni har för
     –   Infrastruktur
     –   Last
     –   Säkerhet
     –   Integrationer
     –   Tekniska redaktörskrav
     –   Tillgänglighetskrav
     –   Webbläsarkrav
     –   Enheter och operativsystem

   Dessa krav påverkar normalt resten av arbetet
Responsive Design
   Samma webbplats presenteras
    på olika sätt i olika enheter.

   Alternativet är att bygga
    speciella mobila webbplatser.

   Påverkar redaktörsarbetet
    marginellt, men påverkar
    kravställningen mycket.
Wireframes
   Fokusera på användarens
    beteende innan ni tittar på
    färg och form.

   Skapa struktur, flöden,
    placering av funktioner
    med wireframes först.

   Alla sidor behöver
    wireframes, inte bara
    startsidan
Wireframes för alla enheter
Förankra med:
• Målgruppen
• Internt




           Skriv gärna
             kontrakt
Design
   Lägg färg och form på dina
    wireframes.

   Ha en mindre grupp som får
    tycka och tänka om design.

   Färg och form är generellt
    enklare att ändra, så gör ingen
    långbänk av det.

   Tänk på att ta med alla enheter!
Redaktörsflöde
   Hur ser organisation ut?
   Vad krävs att redaktören för att
    uppnå målen?
   Vilka inbyggda funktioner kan vi
    klara oss med?
   Vilka uppgifter kommer att göras
    ofta?
   Hur ska ni säkerställa kvalitet?
Stöd för att få kvalitet
   Automatiskt hantering av bilder

   Tvingande fält där det är lämpligt

   Valdering av text

   Stöd för att göra SEO-mässigt rätt

   Arv av fält

   Bra och förståeliga ledtexter

   Bra ordning på fält och flikar
Repetitiva uppgifter
   Identifiera uppgifter som kommer göras ofta av många
    olika. Ex
     –   Vi skapar mycket länkar mellan sidor.
     –   Vi vill kunna styra vilka länkar som visas på varje sida
     –   Vi vill inte ha samma namn på länken som på målsidan.
     –   Vi vill kunna styra ordningen på länkarna
EPiServer standard
En anpassning av redaktörsläget
Samma mål – olika sätt




           Med smartare verktyg sparar vi tid (pengar)!
            Vi sparar också en massa frustration och
            irritation, som är svår att mäta i pengar.
Detaljspecifikation
   Agile utveckling eller inte?

   Olika leverantörer kräver olika detaljnivå

   Vill du ha kontroll? – Var detaljerad!
     – Wireframes och design säger det mesta om besökardelen.
     – Sidtypsdefinition brukar vara bra för redaktörsläget.
Förankra med:
• Målgruppen
• Internt




           Skriv gärna
             kontrakt
Maria Sognefors


         maria@7minds.se
          www.7minds.se
        Twitter: @msognefors
Facebook: www.facebook.com/7mindsab

More Related Content

PPTX
Webbstrategidagarna offentlig sektor 2015 #webbos
PPTX
Tips för bättre agila webbprojekt
PPTX
Användarcentrerad webbanalys
PPTX
Kravställning i EPiServer 7
PPTX
Snabbt och användbart webbgränssnitt
PPTX
Låt inte kass innehåll döda er webb
PDF
Så skapar du en smart webborganisation med delat informationsansvar
PPTX
Hur kan du skapa en effektiv webbredaktion?
Webbstrategidagarna offentlig sektor 2015 #webbos
Tips för bättre agila webbprojekt
Användarcentrerad webbanalys
Kravställning i EPiServer 7
Snabbt och användbart webbgränssnitt
Låt inte kass innehåll döda er webb
Så skapar du en smart webborganisation med delat informationsansvar
Hur kan du skapa en effektiv webbredaktion?

Similar to Kravställning i webbprojekt (20)

PDF
HT17 - DA156A - Användbarhet med fokus på IT
PDF
HT16 - DA156A - Användbarhet 2
PDF
Användbarhet 1
PDF
HT23 - DA106A - Användbarhet (2)
PDF
HT19 - DA156A - Användbarhet (2)
PDF
HT18 - DA156A - Användbarhet (2)
KEY
Vad är webb
PPT
24timmarswebben Introduktion 2008 01 15
PPTX
Interaktionsdesign
KEY
Vad är webb för oss?
PDF
UX: Missar, myter & nyttiga fakta
 
PDF
Kravhantering i praktiken publikt
PDF
Usability 2010 02 25
PPT
Konceptutveckling, interaktionsdesign i digitala projekt
PDF
Inför produktion ht14
PDF
Introduktion till web-design
PPTX
Digital talk citat_designing_for_web
PDF
Ltu vinter fredrik_johansson
PDF
Kunskapsbaren 2011 Stockholm - Attraktiv användarupplevelse
PDF
Kunskapsbaren 2011 Stockholm - Attraktiv användarupplevelse
HT17 - DA156A - Användbarhet med fokus på IT
HT16 - DA156A - Användbarhet 2
Användbarhet 1
HT23 - DA106A - Användbarhet (2)
HT19 - DA156A - Användbarhet (2)
HT18 - DA156A - Användbarhet (2)
Vad är webb
24timmarswebben Introduktion 2008 01 15
Interaktionsdesign
Vad är webb för oss?
UX: Missar, myter & nyttiga fakta
 
Kravhantering i praktiken publikt
Usability 2010 02 25
Konceptutveckling, interaktionsdesign i digitala projekt
Inför produktion ht14
Introduktion till web-design
Digital talk citat_designing_for_web
Ltu vinter fredrik_johansson
Kunskapsbaren 2011 Stockholm - Attraktiv användarupplevelse
Kunskapsbaren 2011 Stockholm - Attraktiv användarupplevelse
Ad

Kravställning i webbprojekt

  • 1. Kravställning i webbprojekt Maria Sognefors, 7minds
  • 3. Alla vill/måste jobba digitalt Antal företag År
  • 5. Jag vill beställa ett badrum!
  • 6. Det fixar vi! Billigt blir också!
  • 7. Nu är det klart!
  • 8. Men det var ju inte Men det fungerar ju! vad jag menade! Vi kan ju göra om, om du vill, men det kostar ju.
  • 9. Kravställningens faser Detalj- Mål/Syfte Teknik Design spec Funktionsspec Wire- Redaktörs- frames flöde Förankring
  • 10. Mål/Syfte/Effektkartläggning  Ni MÅSTE veta: – Varför ni ska ha lösningen? – Vad ni vill uppnå med den?  Alla mål måste vara mätbara  Vem vänder ni er till – Vilka behov har dessa?  Prioritera ut 2-3 viktigaste sakerna – Fokusera på att göra få saker bra – Bygg på efterhand
  • 11. Funktioner styrs av behov  Om ni ska kunna uppnå era mål/effekter – Vilka funktioner krävs? – Vilka redaktionella konsekvenser får ett visst krav?  Låt målen styra, så att ni inte hamnar i funktionsträsket – Tusen önskemål på saker som egentligen ingen vill ha
  • 12. Teknik  Ta tidig reda på vilka krav ni har för – Infrastruktur – Last – Säkerhet – Integrationer – Tekniska redaktörskrav – Tillgänglighetskrav – Webbläsarkrav – Enheter och operativsystem  Dessa krav påverkar normalt resten av arbetet
  • 13. Responsive Design  Samma webbplats presenteras på olika sätt i olika enheter.  Alternativet är att bygga speciella mobila webbplatser.  Påverkar redaktörsarbetet marginellt, men påverkar kravställningen mycket.
  • 14. Wireframes  Fokusera på användarens beteende innan ni tittar på färg och form.  Skapa struktur, flöden, placering av funktioner med wireframes först.  Alla sidor behöver wireframes, inte bara startsidan
  • 16. Förankra med: • Målgruppen • Internt Skriv gärna kontrakt
  • 17. Design  Lägg färg och form på dina wireframes.  Ha en mindre grupp som får tycka och tänka om design.  Färg och form är generellt enklare att ändra, så gör ingen långbänk av det.  Tänk på att ta med alla enheter!
  • 18. Redaktörsflöde  Hur ser organisation ut?  Vad krävs att redaktören för att uppnå målen?  Vilka inbyggda funktioner kan vi klara oss med?  Vilka uppgifter kommer att göras ofta?  Hur ska ni säkerställa kvalitet?
  • 19. Stöd för att få kvalitet  Automatiskt hantering av bilder  Tvingande fält där det är lämpligt  Valdering av text  Stöd för att göra SEO-mässigt rätt  Arv av fält  Bra och förståeliga ledtexter  Bra ordning på fält och flikar
  • 20. Repetitiva uppgifter  Identifiera uppgifter som kommer göras ofta av många olika. Ex – Vi skapar mycket länkar mellan sidor. – Vi vill kunna styra vilka länkar som visas på varje sida – Vi vill inte ha samma namn på länken som på målsidan. – Vi vill kunna styra ordningen på länkarna
  • 22. En anpassning av redaktörsläget
  • 23. Samma mål – olika sätt Med smartare verktyg sparar vi tid (pengar)! Vi sparar också en massa frustration och irritation, som är svår att mäta i pengar.
  • 24. Detaljspecifikation  Agile utveckling eller inte?  Olika leverantörer kräver olika detaljnivå  Vill du ha kontroll? – Var detaljerad! – Wireframes och design säger det mesta om besökardelen. – Sidtypsdefinition brukar vara bra för redaktörsläget.
  • 25. Förankra med: • Målgruppen • Internt Skriv gärna kontrakt
  • 26. Maria Sognefors maria@7minds.se www.7minds.se Twitter: @msognefors Facebook: www.facebook.com/7mindsab