Suunnittelu ei ole vain pikseleitä ja kuvioita. Se on myös vauhtia ja tunteita. Jotkut tuotteet tuntuvat elokuvallisilta, koska ne ohjaavat meitä läpi epävarmuuden, helpotuksen, luottamuksen ja tyyneyden ilman, että ne houkuttelevat meitä. Se on Emotion in Flow. Toiset alittavat omia hetkiään vitsillä väärässä paikassa, yllättävällä ponnahdusikkunalla tai hyppäämällä siirtymällä. Se on tunne konfliktissa. Nämä eivät ole vain UX-ideoita. Voit nähdä niitä kaikkialla viihteessä. Ja selkein tapa tuntea ero on verrata sitä, kuinka anime käsittelee tunnemuutoksia Marvel- ja DC-elokuvat kompastumiseen. Käytämme kahta konkreettista esimerkkiä, toista Dan da Danista (animesarja Netflixissä) ja toista James Gunnin Superman-elokuvasta, määritelläksemme nämä kaksi käsitettä ja muuntaa ne sitten käytännöllisiksi tuotesuunnittelumalleiksi, joita voit soveltaa heti. Huomautus: Keskitymme digitaalisiin tuotteisiin, mukaan lukien sovellukset, SaaS ja verkko. Emotion In Flow (Anime: Dan da Dan) Dan da Danissa sävyalue on villiä, kauhua, komediaa, hellyyttä, mutta silti se virtaa. Esimerkki: Yhdessä kaaressa päähenkilöt ovat oudolla, komedialla, johon liittyy yhden päähenkilön "kultaiset sukuelimet" (kyllä, todella), ja toisessa vedetään sydäntäsärkevään tarinaan äidistä, jonka lapsi kidnapataan. Paperilla sen vaihdon pitäisi olla autokolari. Näytöllä se on johdonmukaista ja emotionaalisesti luettavaa. Miksi tämä toimii näytöllä?
Panosten jatkuvuus. Jopa gag osuu, hahmojen tavoitteet ja vaara pysyvät ennallaan. Huumori vapauttaa jännityksen miniresoluution jälkeen; se ei kiellä uhkaa. Selkeät mielialan vihjeet. Musiikki, kehystys, tahdistus ja hahmoreaktiot luovat seuraavan tunteen. Olet valmis vuoroon, joten ajat sillä mieluummin kuin joutuisit vetäytymään. Yksi tunne-ankkuri. Suhteet pysyvät Pohjantähdenä, joten kohtauksen sydän ei eksy sävyn liikkuessa.
Miten tämä käännetään UX:ksi? Hyvät tuotteet tekevät samoin: valmistautuvat, siirryt, ratkaisevat, jotta käyttäjät pysyvät uppoutuneina tunnesävyn muuttuessa.
Emotion In Conflict (Marvel/DC: James Gunn’s Superman) Lois & Clark käyvät sydämellistä, intiimiä keskustelua, hidasta, inhimillistä hetkeä, samalla kun taustalla soi juokseva gag (hirviö tunkeutuu jättimäisellä pesäpallomailalla). Gag varastaa tarkennuksen heti, kun kohtaus pyytää sinua tuntemaan jotain todellista. Tuloksena on tonaalinen yhteentörmäys, joka puhkaisee tunteen sen sijaan, että se vapauttaisi sen. Miksi tämä epäonnistuu näytöllä?
Lisääntynyt kognitiivinen kuormitus. Se, mitä täällä tapahtuu, liittyy suoraan kognitiivisen kuormituksen teoriaan. Kun kohtaus (tai käyttöliittymä) pyytää käyttäjiä käsittelemään kahta kilpailevaa tunnesignaalia kerralla, se tuo mukanaan ylimääräistä kognitiivista kuormitusta, henkistä vaivaa, jolla ei ole mitään tekemistä itse tehtävän tai hetken kanssa. Sen sijaan, että keskittyisi tunteisiin, huomio jakautuu signaalien kesken, jotka eivät ratkaise toisiaan. Tuotteissa näin tapahtuu, kun huumori, promootiot tai odottamattomat käyttöliittymämuutokset tunkeutuvat suuriin hetkiin: käyttäjien on pakko tulkita sävyä ja tarkoitusperiä samalla kun he yrittävät toimia, mikä hidastaa ymmärtämistä ja lisää stressiä. Kilpailevia lyöntejä samaan aikaan.Vitsi menee päällekkäin vakavan lyönnin huipentuksella; yleisö kiinnittää enemmän huomiota vaihteeseen kuin tunteeseen. Ei sävyjen vaihtoa. Ei ole mitään siirtymää, joka saa aikaan läheisyyden ennen huumorin saapumista, joten hetki tuntuu ennemminkin aliarvioitulta kuin ratkaistulta.
Miten tämä käännetään UX:ksi? Tuotteissa tämä on konfetti ennen vahvistusta -ongelma, röyhkeä virhe rahavirrassa tai promo-modaali, joka ilmestyy kriittisen tehtävän keskelle. Tämä lisää myös kognitiivista kuormitusta: käyttäjien on käsiteltävä huumoria yrittäessään korjata ongelmaa, mikä hidastaa heitä ja lisää stressiä.
Nopeat määritelmät Emotion in FlowEmotional-vuorot tuntuvat ansaituilta, lennätetyiltä ja ajoitetuilta, joten ne ratkaisevat aiemmat lyönnit. Immersion holds.Emotion in ConflictSärkyvä kytkin (tai kova leikkaus), joka puhkaisee elävän tunnerytmin. Upotus taukoja.
Nyt kun olemme nimenneet sen: kuinka tämä liittyy UX:hen? Kuinka tunteet muokkaavat tuotteen muistettavuutta Ihmiset eivät muista kokemuksen keskiarvoa; he muistavat huiput ja lopun. Jos virtauksen huippu on turhautumista tai loppu on sotkuinen, se jää kiinni. Suunnittele siis tunnekäyrä tarkoituksella. Tunteet elävät kolmessa kerroksessa (Don Normanin Emotional Designista), ja tuotteesi on asetettava ne riviin:
Viskeraaliset (suoli): Ensivaikutelman signaalit: visuaalista, liikettä, haptiikkaa, ääntä. Esimerkkejä: Tasainen luurankolataaja rauhoittaa enemmän kuin tärinäspinner; lempeä menestyskello/haptinen napautus antaa voiton laskeutua huutamatta; johdonmukainen helpotus/suunta kertoo silmälle, mikä muuttui. Käyttäytyminen (tekeminen): Voinko suorittaa tehtäväni sujuvasti? Kitka tarkoittaa tässä stressiä.Esimerkkejä: Kolme selkeää maksuvaihetta, joissa edistyminen on ennakoitavissa; virhetilat, jotka selittävät mitä tapahtui ja kuinka palautua; sisäinen validointi lomakkeen lopun räjähdysten sijaan. Heijastava (tarkoittaa): Tarina, jonka kerron itselleni jälkeen: "Oliko se sen arvoista? Luotanko tähän?"Esimerkkejä: Siisti pääteruutu ("Valmis. Saat X perjantaina.") sulkee; pieni yhteenveto ("Säästät 18 € tänä vuonna") luo ylpeyttä ilman ilotulitteita.
Mikrovuorovaikutukset ovat emotionaalista liimaa. Jokaisella on liipaisin (napautan Pay), säännöt (mitä järjestelmä tekee), palaute (edistyminen ja selkeä tulos) ja silmukat tai tilat (mitä tapahtuu, jos käyttäjä yrittää uudelleen). Tee nämä oikein, ja siirtymäsi yhdistävät tunteet. Käsittele ne väärin, ja ne katkaisevat virran.
Emotionaalinen beat sheet kartoittaa selkeästi Normanin kokemuskerroksista:
Epävarmuus elää viskeraalisissa ja varhaisissa käyttäytymiskerroksissa, joissa käyttäjät luottavat sensorisiin vihjeisiin (liike, selkeys, palaute) ymmärtääkseen, mitä tapahtuu. Selkeys on tiukasti käyttäytymiskerroksessa, hetkessä, jolloin järjestelmän tarkoitus ja käyttäjän seuraava toiminta lukittuvat paikoilleen. Ennakointi on sekoitus käyttäytymistä (käyttäjä tekee jotain tarkoituksella) ja reflektoivaa (käyttäjä ennustaa jo lopputulosta ja kuvittelee mitä seuraavaksi). Saavutus on heijastava huippu, jossa käyttäjä arvioi menestystä, luottamusta ja sitä, tuntuiko kokemus oikealta. Rauhallinen/sulkeminen on ensisijaisesti heijastava, ja se auttaa käyttäjiä ymmärtämään vuorovaikutuksen merkityksen ja päättämään, onko tuote luotettava ja palaamisen arvoinen.
Oikeissa tuotteissa tämä järjestys ei katoa, kun asiat menevät pieleen. Virheet, latenssi ja huonontuneet tilat eivät ole poikkeuksia tunnekaaresta – ne ovat osa sitä. Kerronnallisen linssin läpi katsottuna nämä hetket ovat esteitä sankarin matkalla. Hyvin suunniteltu toipumistila tunnustaa takaiskun, selventää tapahtunutta ja ohjaa seuraavaa askelta ilman uutta tunnekohinaa. Kun epäonnistumista käsitellään lyöntinä repeämän sijaan, tunnevirtaus voidaan säilyttää myös stressissä. UX-esimerkkejä: Emotion In Flow vs. Emotion In Conflict Emotion In Flow Kassa tehty oikein (Stripe/Apple Pay -tyyli): lyhyet askeleet, selkeä edistyminen ja selkeä onnistumistila (valintamerkki valinnaisella pehmeällä haptiikalla). Huippu (menestys) laskeutuu, ja loppu sulkee (kuitti tai seuraava askel).
Noutotila (kyytisovellukset, esim. Uber, Free Now tai Bolt): progressiiviset päivitykset säilyttävät suunnan ja vähentävät ahdistusta ("kuljettaja saapuu", "2 minuutin päässä", "saapunut"). Epävarmuus muuttuu selkeydeksi, ja lempeä liike valmistelee jokaista siirtymää.
Tunteet ristiriidassa Huomaa: Emme nimeä tässä tiettyjä tuotteita – kunnioitamme niiden takana olevaa työtä. Sen sijaan näytämme kuvioita, jotka aiheuttavat emotionaalisia konflikteja, ja tarkalleen, kuinka ne korjataan.
Vitsit vakavina hetkinä. Röyhkeät kopiointi-error -tilat rahan/terveyden/turvallisuuden kannalta. Käyttäjät ovat stressaantuneita; huumori lisää ärsytystä. Juhla ennen päätöstä. Konfetti, ilotulitus tai kovat äänet ennen vahvistusta. Juhla keskeyttää huipentuman. Kovan tilan hyppyjä. Yllätysmodaalit/promot kesken tehtävän, koko näytön valtaukset ilman valmistautumista. Tuntuu äkilliseltä leikkaukselta tunnelyönnin aikana.
Mitä voit tehdä tunteiden varmistamiseksi Flowissa Tässä on käsitesivu, jossa on täydellinen malli, jonka voit kopioida:
Emotionaalinen beat sheet malli.
1. Kirjoita ensin Emotional Beat Sheet Kartoita jokaisen ydinvirran (aloitus, maksu, toipuminen) kohdalla tunteet vaiheittain: epävarmuus → selkeys → ennakointi → saavutus → rauhallinen. Liitä kopio, liike ja mikrovuorovaikutus jokaiseen tahtiin. (Kuka kantaa tunteen missä?) 2. Kohdista sävy tehtäväriskin kanssa Luo sävymatriisi (riskitaso × tila). Ole riskialttiissa virheissä rauhallinen, yksinkertainen ja ratkaisukeskeinen. Säästä leikkisyyttä vähäriskisiin yhteyksiin. Mallin katkelmat:
Suuren riskin virhe: "Emme voineet vahvistaa henkilöllisyyttäsi. Yritä uudelleen tai ota yhteyttä tukeen." Pieniriskinen tyhjä tila: "Ei täällä vielä mitään. Haluatko aloittaa näytteestä?"
Tässä monet kypsät tuotteet ajautuvat hiljaa emotionaaliseen konfliktiin. Ajan myötä tiimit lisäävät iloa tottumuksesta eikä tarkoituksesta. Hyödyllinen itsetarkistus on kysyä: Jos poistaisimme kaikki leikkisät tai juhlalliset elementit tästä vaiheesta, tuntuisiko virtaus silti inhimilliseltä – vaine elementit peittävät kitkaa? Hyvä tunnesuunnittelu selventää kokemusta; upea tunnesuunnittelu ei tarvitse koristelua hämmennyksen kompensoimiseksi. 3. Suunnitteluhuippu ja loppu tarkoitukseen Suunnittele yksi selkeä huippu (menestyksen hetki) ja yksi puhdas pää (vahvistus ja mitä tapahtuu seuraavaksi). Mittaa muistamista ja tyytyväisyyttä molemmissa kohdissa. 4. Käytä mikrovuorovaikutuksia siltoina, ei valokeihoina
Valmistaudu: Pienet, johdonmukaiset liikevinkit ennen suurta tilanmuutosta. Vahvista: Menestys rauhoittuu hieman hitaammin ja valinnaisella kevyellä haptiikalla. Toipuminen: Toistuva epäonnistuminen siirtää sävyn kauniisti pirteästä tukevaan ja ohjaa seuraavaa askelta.
5. Testaa emotionaalinen jatkuvuus Älä kysy käytettävyysistunnoissa vain "Oliko se helppoa?" Sen sijaan voit kysyä "Mikä tunne muuttui täällä?" Jos kuulet sanan "hämmentynyt → huvittunut → hämmentynyt", sinulla on konflikti, et virtaa. Toista siirtymiä, ei vain näyttöjä. Kuinka välttää tunteita konflikteissa: nopea tarkistuslista Punaiset liput → korjaukset:
Vitsit vakavina hetkinä → vaihda rauhalliseen, suorapuheiseen kielenkäyttöön ja selkeään toipumispolkuun. Juhla ennen päätöstä → siirrä juhla vahvistuksen jälkeen; vähentää sitä riskialttiisiin tehtäviin. Kovan tilan hyppyt → ilmoittaa siirtymät etukäteen; pidä kehystys yhtenäisenä; käytä mielekästä liikettä jatkuvuuden säilyttämiseksi. Tiimien välinen sävypoikkeama → keskitä ääni- ja ääniohjeet esimerkkeillä riskitaso- ja tilakohtaisesti.
On hetkiä, jolloin tunnevirran katkaiseminen on tarkoituksellista ja välttämätöntä. Turvavaroitukset, lakisääteiset vahvistukset ja turvallisuuskriittiset hälytykset hyötyvät usein äkillisistä sävynvaihteluista. Näissä tapauksissa häiriöt ovat tärkeitä ja vaativat huomiota. Ongelma ei ole emotionaalinen konflikti sinänsä; se on satunnainen konflikti. Kun suunnittelijat valitsevat häiriön tarkoituksella, käyttäjät ymmärtävät panokset sen sijaan, että he tuntevat piiskaa. Johtopäätös Suuret kokemukset ovat ohjattuja kokemuksia. Dan da Dan näyttää, kuinka voit siirtyä tunteiden läpi menettämättä meitä: se valmistautuu, siirtyy ja ratkaisee. Superman-kohtaus osoittaa päinvastaista: gag törmää sydämelliseen sykkeeseen. Tee edellinen. Kartoita emotionaalinen lyöntisi, sovita äänensävy tehtävän riskiin ja anna mikrovuorovaikutusten sillanta tunteita, jotta käyttäjät muistavat oikean huipun ja oikean pään, eivät keskellä olevaa piiskaniskua.
