Enhed 7 / 11

Kunstig intelligens i prototyping og High Definition Design

Gevinster:

  • Evne til at producere hurtige prototypeskeletter, prøveindhold og mikrointeraktionsideer med kunstig intelligens
  • Evne til at producere realistisk pladsholdertekst og data til prototypen og teste designet i virkelig brug
  • Evne til at opretholde konsistens og komponentlogik, når AI-output flyttes til designværktøj (figma osv.)

En prototype er en klikbar, navigerbar efterligning af et design; Det er en simulering, som brugeren kan opleve som i det rigtige produkt. High-fidelity-design er på den anden side design, der er kommet tættere på det endelige produkt med farve, typografi, reelt indhold og mikro-interaktioner. Målet på dette stadium er at gøre ideen testbar "som om den var ægte." AI er stærk her på tre måder: at producere skeletter og variationer hurtigt, levere realistisk pladsholderindhold og data og foreslå mikrointeraktionsideer. Men at opretholde konsistens og komponentlogik, når outputtet flyttes ind i designværktøjet – det vil sige at passe systemet ind i systemet uden at rode det – er et menneskeligt arbejde.

Formål med prototypen: at teste det rigtige spørgsmål billigt

Prototyping har ét formål: at teste en antagelse billigt uden at skrive kode. "Forstår brugeren dette flow?", "Fremskynder dette layout hans opgave?" Derfor behøver prototypen ikke at være så perfekt som det rigtige produkt; det skal bare være reelt nok til på en overbevisende måde at skildre det spørgsmål, der skal testes.

Kunstig intelligens fremskynder denne troværdighed. Men der er en fare: høj opløsning føles "færdig". Når interessenter ser en poleret prototype, kan de forveksle det med den endelige beslutning; Det er dog stadig en hypotese. Sig altid klart, hvad prototypen tester, og hvad der stadig er åbent.

Forsigtig: Poleret prototype overdriver modenhed. Hvis du ikke fremstiller det som "dette er et testværktøj, ikke det endelige design; vi tester dette spørgsmål", når du viser det til interessenten, vil den forkerte forventning blive skabt.

Realistisk indhold: redde prototypen fra løgnen

Den største løgn i en prototype er perfekte pladsholdere som "Lorem ipsum" og "First Name Last Name". I den virkelige verden er navne lange, lister er nogle gange tomme, tal er nogle gange negative, datoer er nogle gange forældede. Når prototypen er fyldt med ideelt indhold, skjuler den reelle problemer.

Det er her AI er værdifuld: den producerer realistisk pladsholderindhold og data af forskellig længde, forskellige tilstande. Du kan bringe prototypen tættere på reel brug med anmodninger som "Giv mig 20 realistiske produktnavne, nogle af dem meget lange", "Skriv 5 forskellige tomme case-scenarier", "Producer prøvekontodata inklusive negativ saldo". Dermed tester testen virkeligheden, ikke idealet.

Indholdstype

falsk (vildledende)

Realistisk (med kunstig intelligens)

Navn

"Navn Efternavn"

Eksempler med korte, lange, enkelte navne, specialtegn

Liste

altid fuld

Blanke, 1-element, 100-element variationer

Nummer

altid positiv

Nul, negative, meget store værdier

tekst

ideel længde

Overfyldt titel, meget kort beskrivelse

dato

i dag

Fortid, fremtid, "lige nu", "for 3 år siden"

Mikrointeraktioner: små, men afgørende

Mikrointeraktioner er små enkeltstående interaktionsmomenter, såsom feedback, når du trykker på en knap, et felt, der bliver grønt, når det er udfyldt, en indlæsningsanimation osv. Disse skaber brugerens følelse af, at "systemet hørte mig". AI er en god brainstorming-partner til at generere ideer til mikrointeraktion (hvornår, hvilken feedback, hvilken tilstandsændring). Men enhver mikro-interaktion skal vejes i forhold til ydeevne, tilgængelighed og distraktion; fancy, men unødvendig animation bremser oplevelsen.

tre minisager

Case 1 — Ordre kollapser med rigtige data. Et team fyldte prototypen med 30 realistiske (nogle meget lange) produktnavne genereret af AI. To kortlayouts løb over; Problemet blev fanget og rettet før test. Lektion: Realistisk indhold afslører skjulte fejl tidligt.

Case 2 — Poleret prototype skabte falske forventninger. En designer forberedte en højopløsningsprototype til "kun flowtest", men viste den til interessenter uden rammer. Interessenten sagde "godt, lad os offentliggøre det"; hvorimod tilgængelighed og indhold endnu ikke eksisterede. Lektion: angiv tydeligt, hvad prototypen tester.

Tilfælde 3 — Komponentkonsistensen er brudt. Skærmskitsen fra AI’en indeholdt en anden knapstil end knappen i designsystemet. Da designeren porterede dette til Figma, glemte designeren at linke det til systemkomponenten; Der er to forskellige knapper på produktet. Lektion: Når du flytter output ind i værktøjet, er det et must at forbinde det til eksisterende komponenter.

Kopiérbare prompter

Generer realistisk pladsholderindhold til denne skærm:- 20 <<elementtype>> navne: nogle for korte, nogle for lange, et med et særligt tegn.- 4 tomme kasusscenarier.- 3 ekstreme dataeksempler (nul, negativ, overstørrelse).Formål: at teste prototypen med reel, ikke ideel, brug.Kontekst: <<skærm/produkt>>

Foreslå prototypeskelet til dette flow (skærmliste + hovedelementer i hver skærm):Opgave: "<<opgave>>". Spørgsmålet jeg vil teste er: "<<hypotese>>". Foreslå lige nok skærme til at teste dette spørgsmål; tilføj ikke mere.

Foreslå 4 ideer til mikrointeraktion til denne interaktion (knaptryk, feltbekræftelse, indlæsning, succes). For hver: trigger, feedback, forslag til varighed og tilgængelighedsnotat (bevægelsesfølsomhed, skærmlæsermeddelelse). Kontekst: <<interaktion>>

Tjek denne skærmskitse for kompatibilitet med mit designsystem: skal knappen, typografien, afstanden og farven overholde mine eksisterende komponentregler ("<<resumé>>"). Liste hvert element, der er inkompatibelt, og hvilken systemkomponent den skal tilsluttes. Udkast: <<tekst>>

Svag prompt / Stærk prompt

Svag: "Giv eksempelindhold til denne prototype."

Resultatet: ideel længde, ensartet, falsk indhold, der skjuler reelle problemer.

Stærk: "Generer 20 produktnavne; nogle for lange, et med en speciel karakter; tilføj 4 tomme sager og 3 kantdataeksempler; sigt efter at teste prototypen med reel brug."

Resultatet: Indhold, der virkelig presser layoutet, åbner fejl tidligt.

Forskellen: en stærk prompt kræver variation + kantkasse + formål.

Almindelige fejl

  • Test med ideelt indhold. Gode ​​pladsholdere skjuler virkelige problemer.
  • At tage fejl af den polerede prototype som den endelige beslutning. Hvis indramningen ikke udføres, opstår der falske forventninger.
  • Tilføjelse af unødvendig skærm. Prototypen skulle være tilstrækkelig til at teste hypotesen; for meget er spild af tid.
  • At bryde komponentlogik. Hvis du glemmer at forbinde systemkomponenter, når du transporterer dem til køretøjet, vil det give inkonsekvens.
  • Fancy men unødvendig mikro-interaktion. Tilføjelse af animation uden at overveje ydeevne og tilgængelighed.

Sammenfattende

Prototyping er en måde at billigt teste en hypotese uden at skrive kode; Den høje opløsning gør det troværdigt, men det skaber også en illusion af "færdig". AI driver denne fase med hurtigt skelet, realistisk pladsholderindhold og ideer til mikrointeraktion. Dets mest værdifulde bidrag er de forskelligartede og ekstreme data, der giver dig mulighed for at teste prototypen med reel, ikke ideel, kontekst. Det er det menneskelige ansvar klart at ramme, hvad prototypen tester, at opretholde komponent- og stilkonsistens, når outputtet flyttes ind i designværktøjet.

Ansøgningsopgave

  1. Skriv en enkelt hypotesesætning, som du vil teste for et flow.
  2. Med den anden prompt skal du oprette et prototypeskelet, der er tilstrækkeligt til at teste denne hypotese.
  3. Med den første prompt skal du oprette realistisk, kant-case pladsholderindhold og udfylde prototypen.
  4. Med den tredje prompt skal du generere 2-3 mikrointeraktionsideer og evaluere tilgængelighedsnoterne.
  5. Med den fjerde prompt skal du kontrollere og korrigere udkastet for designsystemkonsistens.

tjekliste

  • [ ] Jeg skrev klart hypotesen om, at prototypen tester.
  • [ ] Jeg testede med realistisk og kant case-indhold.
  • [ ] Jeg indrammede prototypen som et "testværktøj" for interessenten.
  • [ ] Jeg beholdt antallet af skærme nok til at teste hypotesen.
  • [ ] Jeg vejede mikro-interaktioner mod tilgængelighed og ydeevne.
  • [ ] Jeg opretholdt konsistens ved at binde output til systemkomponenter.