Predložak simbola dijagrama toka putem Sveučilišta DePaul

Stvaranje izvrsnih UX protoka

Ilustrirajte složene procese uključivanjem slučajeva, radnji i životnih ciklusa

Dijagrami toka ostaju moj omiljeni artefakt u procesu dizajniranja. Uz sve složenije aplikacije, dijagrami protoka pomažu u modeliranju fluidnih, razgovornih iskustava.

U tu svrhu odgovaraju na dva bitna pitanja:

  • Kada pokazujemo određene dijelove informacija?
  • Kako reagiramo na ponašanje korisnika?

Dijagrami tijeka prikazuju strukture koje su utemeljene na vremenu i izboru, iste elemente razgovora.

Prvo sam pisao o dijagramima protokola u komunikacijskom dizajnu, knjizi koja opisuje radne dokumente stvorene tijekom procesa dizajna i koje bi možda trebali pokupiti.

Komunikacijski dizajn: Izrada dokumentacije web stranica za dizajn i planiranje, Dan Brown

Knjiga opisuje bitne elemente dijagrama tokova i objašnjava kako poboljšati svoje vještine grafikona tijeka. Također pokazuje kako koristiti dijagrame tijeka za olakšavanje razgovora s klijentima. To je nevjerojatno djelo.

Stranice 145–145 iz poglavlja Komunikacijski dizajn o grafikonima protoka

Dijagrami toka, kao i bilo koji rezultati u dizajnu, izgovor je za razgovor sa svojim timom. Koliko god da se žalimo za sastancima i formalnim rezultatima, istina je da bi dizajn dizajna zaustavio bez (a) razgovora i (b) slika.

Ono što volim kod dijagrama točaka je da nude ogromnu fleksibilnost. Dakle, možete koristiti uobičajeni odgovor na izazove sa kojima se susrećete i njihova popratna rješenja.

U nedavnim projektima koristio sam nove tehnike koje se temelje na temelju u komunikacijskom dizajnu:

  1. Povezivanje tokova s ​​uporabnim slučajevima: Usporedba dijagrama toka s popisom korisničkih potreba.
  2. Prikaz menija i korisničkih radnji: Umetanje korisničkih izbora u dijagram.
  3. Prikaz životnih ciklusa objekata: Izričiti utjecaj izbora korisnika na virtualne objekte.

Spajanje tokova za upotrebu slučajeva

Za skoro sve moje projekte u posljednjih nekoliko godina sastavio sam popis slučajeva uporabe. U trećem sam desetljeću karijere u UX-u i vjerojatno taj termin krivo upotrebljavam. ¯ \ _ (ツ) _ / ¯

Pod uporabnim slučajem mislim na rečenicu koja opisuje jednu namjeru za barem jednu vrstu korisnika. Iznesene kao imperativne izjave, cilj je agnosticirati sustav. Na primjer, "prijava" nikada ne bi bila korisna, ali pozivanje ljudi na događaj bilo bi.

Uzorak liste slučajeva koristi za aplikaciju Događanja. Koristite slučajeve napisane imperativom raspoloženja i općenito od prve osobe, kao da je korisnik pripovjedač.

To je jednostavan alat za predstavljanje korisničkih potreba. Popis slučajeva upotrebe presudan je ulaz u dijagram tijeka: definira opseg aplikacije.

Čitav skup djeluje kao popis za provjeru protoka adresa svih korisnika. Svaki slučaj upotrebe dobiva identifikator i ja mogu napomenuti tok s ID brojevima korištenja slučaja da pokažem gdje zadovoljava potrebe svakog korisnika.

Jednostavna shema tijeka s malim zastavicama na svakom okviru koja prikazuje identificirane slučajeve uporabe.

To meni i timu omogućava vizualni način da vidimo jesmo li nešto propustili. Kroz svaku ponavljanje mogu ispitivati ​​tok sa slučajevima upotrebe postavljajući pitanja poput: "U redu, kako bi korisnici pozvali ljude na događaj?"

Uključujući izbornike

U mnogim aplikacijama korisnici se kretaju do područja aplikacije za obavljanje funkcije. Da bih pokazao da je ekran sastajalište iz kojeg se korisnici mogu obratiti različitim funkcijama, koristim ovu konvenciju:

Dijagram toka s ugrađenim stavkama izbornika.

Imajte na umu da minimiziram povezivanje linija, pokazujući na točkasti pravokutnik koji obuhvaća sve mogućnosti na izborniku.

Utjelovljujući stavku izbornika u tijeku mogu prikazati dodatne procese koji pokreću klikanje na nju. Tako zatvaram događaj, a osim što me odvede na zaslon s "pokrenutim događajem", sustav šalje obavijest ključnim dionicima.

Kada izložite stavke izbornika u toku, možete pokazati što se izbornik pokreće.

Prikazivanje životnih ciklusa objekata

Sada ćemo ući u neku duboku informacijsku arhitekturu. Spreman?

Tok koji stvaramo dizajniran je za izmjene digitalnih objekata. Digitalni su objekti virtualni prikazi stvari iz stvarnog svijeta. Digitalni objekt je diskretan i ima karakteristike kojima korisnici mogu manipulirati.

Događaj u stvarnom svijetu predstavljen je sa "događajem" u aplikaciji koju dizajnirate. Ljudi mogu RSVP za događaj. Administratori mogu uređivati ​​događaj. Događaj je instanca određenog predloška (vrsta sadržaja) koji ima svojstva (karakteristike) i metode (radnje koje možemo izvesti na objektu).

Niz stanja za događaj.

Predmeti mogu imati životni ciklus, podrazumijevan i nametnut aplikacijom. Kao dokument koji prolazi kroz nacrte i odobrenja, a zatim postaje konačan. Svaki korak u životnom ciklusu nazivamo stanjem. Postoji jasna veza između radnji koje korisnici poduzimaju i stanja objekta.

Štoviše, stanje digitalnog objekta može utjecati na korisnikovo iskustvo. Odnosno, trenutno stanje objekta utječe na to kako se objekt pojavljuje u korisničkom sučelju i što korisnici mogu s njim.

Radnje koje korisnici mogu poduzeti na događaju u svakoj fazi svog životnog ciklusa.

Recimo da se više ljudi može prijaviti na događaj. Status događaja može se promijeniti ovisno o tome koliko se ljudi prijavi ili ako se određeni ljudi prijave. Dijagramom životnog ciklusa događaja pored tijeka možemo prikazati interakciju između korisnikovih radnji i promjena digitalnog objekta.

Kako bih odražavao interakciju između korisničkog iskustva i životnog ciklusa objekta, koristio sam dvije tehnike:

Dajte životnom ciklusu stazu za plivanje

Dijagram u osnovi uključuje vremensku traku objekta, od njegovog nastanka ili postojanja do uništenja. Vremenska vrsta lebdi iza ekrana i staza grafikona. Kada korisnici poduzmu radnju koja utječe na stanje objekta, dijagram točaka usmjerava na vremensku traku, naznačujući prirodu promjene.

Dijagram toka koji prikazuje kako zasloni utječu na životni ciklus objekta, označen narančastim zastavicama.

Ugradite promjene stanja u tok

Kada postoji jedan objekt koji može unositi više promjena ovisno o radnjama, jednostavna vremenska traka može biti nedovoljna. (Ili može biti previše teško omotati glavu.) Primijetit ću zaslone s zastavom koja označava promjenu stanja. To ne otkriva ovisnosti između stanja objekta i korisničkog iskustva kao i davanje životnog ciklusa plutajućoj traci.

Narančaste zastavice koje se pojavljuju na samim ekranima prikazuju kako se stanje podatkovnog objekta mijenja na temelju interakcija korisnika.

Važnost razgovora

Svaka isporuka koju stvorim ovih dana katalizator je razgovora, a dijagrami tokova su među najkorisnijim i daju uvid u cjelokupni proces i sitne detalje. Moje klijentske zainteresirane strane toliko dugo sudjeluju u procesima, nikada ga nisu morale eksternalizirati, još manje prevesti na skup ekrana.

Dijagrami toka omogućuju nam da pratimo multivariatne probleme u modernim poslovnim procesima, vizualiziramo ovisnosti i započnemo zamišljati korisničko iskustvo. Čak i najosnovniji dijagram toka potaknut će vaš tim da razgovara i o cjelokupnom krajoliku kao i o pojedinostima svakog koraka. Pa ipak, s obzirom da je naš rad suradniji i bavimo se složenijim domenima, naše radne proizvode neprestano treba izazivati ​​i ažurirati kako bi ostali korisni.

Hvala na čitanju! Napisao sam cijelu knjigu o procesu otkrivanja dizajna. Trebali biste to provjeriti!

Primjer poglavlja možete preuzeti s knjige A Book. U knjizi se tehnike poput razgovora sa zainteresiranim stranama stavljaju u kontekst, objašnjavajući kako se sastaje cijela faza otkrivanja. Ako pokupite primjerak, svi moji snovi će se ostvariti!

Trebate pomoć pri otkrivanju vašeg digitalnog proizvoda? EightShapes može savjetovati ili pokretati projekte kako biste se upoznali sa definicijom i vizijom proizvoda. Saznajte više na eightshapes.com. Javite se!