TNMK30 - Elektronisk publicering, HT2021

Inlämningsuppgift - Design av ett gränssnitt

Uppgiften ska utföras i projektgrupperna.

Skapa layout

Ni ska själva skissa en layout för er projektwebbsida. Använd de designverktyg och designansatser som presenterats på föreläsningarna, samt de lärdomar ni gjort utifrån analysen. Ni ska presentera er layout i tre steg: Moodboard, Wireframe, Mockup.

  1. Moodboard - tänk känsla. Använd Photoshop/Illustrator för att sätta samma ett kollage som förmedlar den känsla ni vill ha (mood board).
  2. Wireframe - tänk funktion. Använd papper och penna/Illustrator för att bygga upp funktionaliteten och navigationen i er webbsida (wireframe).
  3. Mockup - tänk utseende. Skapa en "låtsaswebbsida" som innehåller alla element från moodboard och wireframe men utan att egentligen vara en fungerande webbsida för att testa era designidéer (mockup).

Presentera och opponera

Ni ska sedan presentera ert designförslag samt opponera (dvs komma med både positiv och negativ kritik) på ett annat designförslag vid ett seminarietillfälle. Då det är så kort om tid i årets schema, så får opponentgruppen lyssna extra noga och planera samt genomföra sin opposition på plats vid seminariet.

Att tänka på när ni lyssnar på presentationen inför er opposition

Tänk på att det som respondentgruppen visar är skisser, så anpassa er opposition utifrån det.

  1. Syfte med gränssnittet (för vad används webbplatsen och framgår det tydligt eller inte).
  2. Avsedd användargrupp (eller grupper om flera) (barn, allmänhet, anställda).
  3. Upplevelse (hur det är att hitta information, förstå den, och att göra det man vill? Är det tydligt, rörigt, lätt, svårt, roligt eller tråkigt?)
  4. Organisation (hur är sidan organiserad, placering av text, bilder, navigation, etc.).
  5. Uppmärksamhet (vad attraherar din uppmärksamhet när du är på sidan? Direkt när du kommer dit? Efter en stund?).
  6. Text (mängd text, fontstorlek, typsnitt, färg, kontrast etc.)
  7. Grafik (hur används grafik på sidan - exempelvis av estetiska skäl, för att illustrera sådant som nämns i text etc.)
  8. Interaktion (hur är det att navigera och “använda sig” av det som finns på sidan?

Schema och gruppindelning