Enhet 7 / 11

Kunstig intelligens i prototyping og høydefinisjonsdesign

Gevinster:

  • Evne til å produsere raske prototypeskjeletter, prøveinnhold og mikrointeraksjonsideer med kunstig intelligens
  • Evne til å produsere realistisk plassholdertekst og data for prototypen og teste designet i reell bruk
  • Evne til å opprettholde konsistens og komponentlogikk når du flytter AI-utdata til designverktøy (Figma etc.)

En prototype er en klikkbar, navigerbar imitasjon av et design; Det er en simulering som brukeren kan oppleve som i det virkelige produktet. High-fidelity-design er på sin side design som har kommet nærmere sluttproduktet med farge, typografi, ekte innhold og mikrointeraksjoner. Målet på dette stadiet er å gjøre ideen testbar "som om den var ekte." AI er sterk her på tre måter: å produsere skjeletter og variasjoner raskt, gi realistisk plassholderinnhold og data, og foreslå mikrointeraksjonsideer. Men å opprettholde konsistens og komponentlogikk når du flytter utdataene inn i designverktøyet – det vil si å tilpasse systemet inn i systemet uten å rote det til – er en menneskelig jobb.

Formålet med prototypen: å teste det riktige spørsmålet billig

Prototyping har ett formål: å teste en antagelse billig, uten å skrive kode. "Forstår brukeren denne flyten?", "Gjør dette oppsettet raskere oppgaven hans?" Derfor trenger ikke prototypen være like perfekt som det virkelige produktet; det må bare være ekte nok til på en overbevisende måte å fremstille spørsmålet som skal testes.

Kunstig intelligens fremskynder denne troverdigheten. Men det er en fare: høy oppløsning føles "ferdig". Når interessenter ser en polert prototype, kan de forveksle det med den endelige avgjørelsen; Det er imidlertid fortsatt en hypotese. Si alltid tydelig hva prototypen tester og hva som fortsatt er åpent.

Forsiktig: Polert prototype overdriver modenhet. Hvis du ikke rammer det inn som "dette er et testverktøy, ikke det endelige designet; vi tester dette spørsmålet" når du viser det til interessenten, vil feil forventninger skapes.

Realistisk innhold: redde prototypen fra løgnen

Den største løgnen til en prototype er perfekte plassholdere som "Lorem ipsum" og "First Name Last Name". I den virkelige verden er navn lange, lister noen ganger tomme, tall er noen ganger negative, noen ganger er datoer utdaterte. Når prototypen er fylt med ideelt innhold, skjuler den reelle problemer.

Det er her AI er verdifullt: den produserer realistisk plassholderinnhold og data av forskjellig lengde, forskjellige tilstander. Du kan bringe prototypen nærmere reell bruk med forespørsler som "Gi meg 20 realistiske produktnavn, noen av dem veldig lange", "Skriv 5 forskjellige tomme case-scenarier", "Produser eksempelkontodata inkludert negativ saldo". Dermed tester testen virkeligheten, ikke idealet.

Innholdstype

falsk (villedende)

Realistisk (med kunstig intelligens)

Navn

"Navn Etternavn"

Eksempler med korte, lange, enkeltnavn, spesialtegn

Liste

alltid full

Blanke varianter med 1 element og 100 elementer

Nummer

alltid positiv

Null, negative, veldig store verdier

tekst

ideell lengde

Overfylt tittel, veldig kort beskrivelse

dato

i dag

Fortid, fremtid, "akkurat nå", "for 3 år siden"

Mikrointeraksjoner: små, men avgjørende

Mikrointeraksjoner er små, enkeltstående øyeblikk av interaksjon, som tilbakemelding når du trykker på en knapp, et felt som blir grønt når det er fylt, en lasteanimasjon osv. Disse skaper brukerens følelse av at "systemet hørte meg". AI er en god idédugnadspartner for å generere ideer om mikrointeraksjon (når, hvilken tilbakemelding, hvilken tilstandsendring). Men hver mikro-interaksjon må veies i form av ytelse, tilgjengelighet og distraksjon; fancy, men unødvendig animasjon bremser opplevelsen.

tre minisaker

Tilfelle 1 — Ordren kollapser med ekte data. Et team fylte prototypen med 30 realistiske (noen veldig lange) produktnavn generert av AI. To kortoppsett rant over; Problemet ble fanget opp og løst før testing. Leksjon: realistisk innhold avdekker skjulte feil tidlig.

Tilfelle 2 - Polert prototype skapte falske forventninger. En designer utarbeidet en høyoppløselig prototype for "kun flyttesting", men viste den til interessenter uten innramming. Interessenten sa "flott, la oss publisere det"; mens tilgjengelighet og innhold ennå ikke eksisterte. Leksjon: oppgi tydelig hva prototypen tester.

Tilfelle 3 — Komponentkonsistensen er brutt. Skjermskissen fra AI-en inneholdt en annen knappestil enn knappen i designsystemet. Når du porterte dette til Figma, glemte designeren å koble det til systemkomponenten; Det er to forskjellige knapper på produktet. Leksjon: Når du flytter utdata inn i verktøyet, er det et must å koble det til eksisterende komponenter.

Kopiérbare spørsmål

Generer realistisk plassholderinnhold for denne skjermen:- 20 <<elementtype>> navn: noen for korte, noen for lange, ett med et spesialtegn.- 4 tomme kasus-scenarier.- 3 ekstreme dataeksempler (null, negativ, overdimensjonert).Formål: å teste prototypen med ekte, ikke ideell, bruk.Kontekst: <<skjerm/produkt>>

Foreslå prototypeskjelett for denne flyten (skjermliste + hovedelementer i hver skjerm): Oppgave: "<<oppgave>>". Spørsmålet jeg vil teste er: "<<hypotese>>". Foreslå akkurat nok skjermer til å teste dette spørsmålet; ikke legg til flere.

Foreslå 4 mikrointeraksjonsideer for denne interaksjonen (knappetrykk, feltverifisering, lasting, suksess). For hver: trigger, tilbakemelding, forslag til varighet og tilgjengelighetsnotat (bevegelsesfølsomhet, skjermleserkunngjøring). Kontekst: <<interaksjon>>

Sjekk denne skjermskissen for kompatibilitet med designsystemet mitt: må knappen, typografien, avstanden og fargen samsvare med mine eksisterende komponentregler ("<<sammendrag>>"). List opp hvert element som er inkompatibelt og hvilken systemkomponent det skal kobles til. Utkast: <<tekst>>

Svak forespørsel / Sterk forespørsel

Svak: "Gi eksempelinnhold for denne prototypen."

Resultatet: ideell lengde, ensartet, falskt innhold som skjuler reelle problemer.

Sterkt: "Generer 20 produktnavn; noen for lange, ett med spesialtegn; legg til 4 tomme tilfeller og 3 eksempler på kantdata; mål å teste prototypen med reell bruk."

Resultatet: Innhold som virkelig presser oppsettet, åpner feil tidlig.

Forskjellen: en sterk melding krever variasjon + kantkasse + formål.

Vanlige feil

  • Testing med ideelt innhold. Gode ​​plassholdere skjuler virkelige problemer.
  • Tar feil av den polerte prototypen som den endelige avgjørelsen. Hvis innramming ikke gjøres, oppstår falske forventninger.
  • Legger til unødvendig skjerm. Prototypen skal være tilstrekkelig til å teste hypotesen; for mye er bortkastet tid.
  • Bryter komponentlogikk. Å glemme å koble til systemkomponenter når de transporteres til kjøretøyet vil føre til inkonsekvens.
  • Fancy, men unødvendig mikrointeraksjon. Legger til animasjon uten å vurdere ytelse og tilgjengelighet.

Oppsummert

Prototyping er en måte å billig teste en hypotese uten å skrive kode; Den høye oppløsningen gjør det troverdig, men det skaper også en illusjon av "ferdig". AI driver dette stadiet med raskt skjelett, realistisk plassholderinnhold og ideer om mikrointeraksjon. Dens mest verdifulle bidrag er de mangfoldige og ekstreme dataene som lar deg teste prototypen med ekte, ikke ideell, kontekst. Det er menneskets ansvar å tydelig ramme hva prototypen tester, opprettholde komponent- og stilkonsistens når du flytter utdataene inn i designverktøyet.

Søknadsoppgave

  1. Skriv en enkelt hypotesesetning som du vil teste for en flyt.
  2. Med den andre ledeteksten, lag et prototypeskjelett som er tilstrekkelig til å teste denne hypotesen.
  3. Med den første ledeteksten, lag realistisk plassholderinnhold med kant-case og fyll ut prototypen.
  4. Med den tredje ledeteksten, generer 2-3 mikrointeraksjonsideer og evaluer tilgjengelighetsnotatene.
  5. Med den fjerde ledeteksten, kontroller og korriger utkastet for konsistens i designsystemet.

sjekkliste

  • [ ] Jeg skrev tydelig hypotesen som prototypen tester.
  • [ ] Jeg testet med realistisk og kantsaksinnhold.
  • [ ] Jeg utformet prototypen som et "testverktøy" for interessenten.
  • [ ] Jeg beholdt antallet skjermer nok til å teste hypotesen.
  • [ ] Jeg veide mikrointeraksjoner opp mot tilgjengelighet og ytelse.
  • [ ] Jeg opprettholdt konsistens ved å binde utdataene til systemkomponenter.