UI/UX-fallstudie · Egeninitierat koncept
En tydligare väg genom en svår situation.
Ett webb- och konkursportalkoncept för en advokatbyrå. Designen skiljer personer som söker rådgivning från borgenärer, tidigare anställda och hyresvärdar som behöver agera i ett befintligt ärende.
- Min roll
- Webbgranskning · Användarflöden · UI · Frontend
- Leverans
- Webbplats + prototyp för konkursportal
- Projektstatus
- Eget initiativ · Ej beställt
Det här är en självständig designstudie. Byrån har varken beställt eller godkänt den. Prototypen visar ett gränssnitt och är inte byråns riktiga tjänst.
Utforska den fungerande prototypen ↗01 / Problem
En webbplats, helt olika skäl att besöka den.
Projektanteckningarna pekade ut konkursförvaltning som en central del av Uppsalabyråns arbete. Det gav ett uppgiftsorienterat designmål: hjälpa berörda personer att hitta rätt information och väg vidare. Jag hade inte interna samtalsvolymer, inkorgsdata eller belägg för att webbplatsen tappade kunder.
Underlag: dokumenterade observationer från den ursprungliga webbgranskningen i projektanteckningarna. De beskriver granskningen då, inte en ny kontroll av byråns nuvarande webbplats. Slutsatserna för designen är mina tolkningar.
Begränsad zoom
Den ursprungliga granskningen noterade user-scalable=0 i viewport-inställningen.
Designkrav: Tillåt zoom och behåll en läsbar, användbar layout på smal skärm.
Trasig interaktion
Anteckningarna beskriver fem delningskontroller under nyheter som pekade på '#'.
Designkrav: Använd fungerande handlingar med tydligt syfte och ta bort kontroller som inte gör något.
Olika uppgifter
Det offentliga materialet och prototypen skiljer mellan fordringar, anställningsfrågor och frågor om lokaler eller tillgångar.
Designkrav: Erbjud ingångar efter situation och behåll ärendets sammanhang genom flödet.
Hur kan en person som berörs av en konkurs hitta rätt väg, förstå vad som behövs och veta vad nästa steg är?
02 / Användare & krav
Utgå från det besökaren behöver göra.
Det här är preliminära användarprofiler utifrån tjänsterna och det offentliga innehållet. De är arbetshypoteser, inte personas validerade genom intervjuer. Inga användarintervjuer eller modererade användningstester finns dokumenterade för konceptet.
Borgenär
Hitta rätt ärende för en obetald faktura.
Ett identifierbart ärende, en väg för fordran och tydliga krav på underlag.
Tidigare anställd
Förstå vart en anställningsfråga hör hemma.
Begriplig vägledning och en egen ingång utan irrelevanta fält för andra typer av krav.
Hyresvärd eller köpare
Nå ansvarig för en lokal- eller tillgångsfråga.
Ärendets sammanhang och en annan väg än en allmän förfrågan om juridisk rådgivning.
Informationsarkitekturen har två ingångar: juridisk rådgivning och konkursärenden. Portalen är en frontend-demonstration. Riktig mottagning, säker filhantering, ärendedirigering och juridisk granskning är genomförandekrav, inte färdiga backend-funktioner.
03 / Användarflöden
Välj väg efter personens situation.
Prototypen har tre ingångar från portalen. Flödet för fordringar visar demokvittensen som tänkt slutpunkt. Wireframen lägger till en granskning före inskick som föreslagen förbättring, separat från befintlig UI.
Borgenär: anmäla en fordran
- Välja fordringsvägen
- Välja konkursärende
- Ange krav och underlag
- Se en demokvittens
Om bolaget saknas ska det gå att identifiera det och be om hjälp. Prototypen tar inte emot någon verklig fordran.
Tidigare anställd: hitta rätt vägledning
- Välja vägen för anställda
- Identifiera ärendet
- Läsa vad som behövs
- Använda ärendets kontaktväg
Besökaren ska inte behöva tolka juridisk behörighet. Byrån måste godkänna vägledning och mottagningsprocess.
Hyresvärd eller köpare: fråga om lokal eller tillgångar
- Välja hyresvärd / tillgångar
- Identifiera ärendet
- Beskriva frågan
- Nå relevant kontakt
Om personen inte kan identifiera ett ärende ska en tydligt förklarad allmän kontaktväg finnas kvar.
04 / Wireframes
Struktur före visuella detaljer.
Retrospektiva wireframes, ritade för den här fallstudien för att förklara prototypens hierarki. De är kommenterade strukturskisser, inte ursprungligt forskningsmaterial eller skärmar från en Figma-fil.
05 / UI-beslut
Gränssnittet och tanken bakom.
Skilj rådgivning från handläggning
Två ingångar på startsidan ger potentiella klienter och personer med ett befintligt ärende olika startpunkter.
Strukturera stegvis
Gränssnittet för fordringar grupperar ärendeval, kontaktuppgifter, krav och underlag. Målet är mindre oklarhet; slutförandegraden har inte mätts.
Behåll ärendets sammanhang
Ärendekort, stegmarkeringar och en namngiven kontakt ger sammanhang. Dirigeringen demonstreras i gränssnittet; en riktig integration behöver byggas och testas.
Visa prototypens gräns
Konceptet har en tydlig märkning och förklarar att formulären inte skickar till byrån. Juridisk text behöver fortfarande granskas; återbruk av offentlig text innebär inget juridiskt godkännande.


Riktiga skärmbilder från det fungerande konceptet. Öppna en bild för att granska den i full storlek.
06 / Utvärdering
Det som finns och det som behöver testas.
Resultatet är ett fungerande frontend-koncept. Det finns ingen kundlansering, inga användartestresultat och ingen uppmätt konverteringsökning att redovisa. Nedan är en plan för utvärdering, inte genomförda tester.
Uppgiftsbaserade användningstester
Rekrytera fem deltagare över de tre preliminära profilerna. Använd fiktiva ärenden och uppgifter. Be deltagarna välja väg, hitta ärendet och förklara nästa steg. Notera felvägar, slutförande och tvekan.
Fel och återhämtning
Testa saknat ärende, ofullständiga fält, felaktig e-post, avvisad bilaga och nätverksfel före lansering. Bevara ifyllda uppgifter och skilj ett misslyckat inskick från en kvittens.
Verksamhetens utfall
Ta fram en baslinje med byrån för rätt dirigerade förfrågningar och tid för kompletteringar. Jämför efter lansering. Färre rutinsamtal är en hypotes, inte ett resultat av konceptet.
Lärdom för designen
Den kommersiella frågan förändrar designuppgiften. En advokatbyrås webbplats kan stödja pågående arbete och samtidigt skapa förfrågningar. Här gav uppgiften en mer användbar struktur än enbart en visuell uppdatering.
Före en riktig lansering
Validera profilerna med riktiga användare och personal, låt byrån granska juridisk text, minska onödiga fält, lägg till ett granskningssteg och bygg säker mottagning och ärendedirigering. Prototypen är inte en fungerande juridisk mottagningstjänst.
En liknande utmaning på er webbplats?
Jag kan granska vägen från besökarens fråga till nästa användbara steg. Ett samtal på 20 minuter räcker för att identifiera de första prioriteringarna och diskutera omfattningen.