Disain ei ole ainult pikslid ja mustrid. See on ka tempo ja tunded. Mõned tooted tunduvad kinematograafilised, kuna juhivad meid läbi ebakindluse, kergenduse, enesekindluse ja rahulikkuse, ilma et meid enda ümber tõmbaks. See on Emotion in Flow. Teised kahandavad oma hetked vales kohas tehtud nalja, ootamatu hüpikakna või hüpliku üleminekuga. See on emotsioon konfliktis. Need ei ole ainult UX-i ideed. Näete neid kõikjal meelelahutuses. Ja kõige selgem viis erinevust tunda on võrrelda seda, kuidas anime käsitleb emotsionaalseid nihkeid ja kuidas Marveli ja DC filmid komistavad. Kasutame kahte konkreetset näidet, ühte Dan da Danist (Netflixi animeseriaal) ja üht James Gunni Supermani filmist, et määratleda kaks mõistet ning seejärel tõlkida need praktilisteks tootekujundusmustriteks, mida saate kohe rakendada. Märkus. Keskendume digitaalsetele toodetele, sealhulgas rakendustele, SaaS-ile ja veebile. Emotion In Flow (Anime: Dan da Dan) Dan da Danis on toonivahemik metsik, õudus, koomika, õrnus, kuid ometi voolab. Näide: ühes kaares on peategelased veidral, koomilisel otsingul, mis hõlmab ühe peategelase "kuldseid suguelundeid" (jah, tõesti), teises aga tõmmatakse meid südantlõhestavasse loosse emast, kelle laps röövitakse. Paberil peaks see vahetus olema autoõnnetus. Ekraanil on see ühtne ja emotsionaalselt loetav. Miks see ekraanil töötab?
Panuste järjepidevus. Isegi kui näkk maandub, jäävad tegelaste eesmärgid ja oht puutumata. Huumor vabastab pinge pärast miniresolutsiooni; see ei eita ohtu. Selged meeleolu näpunäited. Muusika, kadreerimine, tempo ja tegelaste reaktsioonid edastavad järgmise tunde. Olete vahetuseks valmis, nii et sõidate sellega, mitte ei jää end ära tõmbama. Üks emotsionaalne ankur. Suhted jäävad põhjatäheks, nii et stseeni süda ei läheks, kui toon liigub.
Kuidas see tähendab UX-i? Head tooted teevad sama: valmistuvad, siirduvad, lahendavad, nii et kasutajad jäävad emotsionaalse tooni muutudes endasse.
Emotsioon konfliktis (Marvel/DC: James Gunn’s Superman) Lois ja Clark vestlevad südamliku, intiimse vestluse, aeglase, inimliku hetkega, samal ajal kui taustal kostab jooksev oks (koletis, kes on hiiglasliku pesapallikurikaga kinni löödud). Nukk varastab fookuse just siis, kui stseen palub teil tunda midagi tõelist. Tulemuseks on tonaalne kokkupõrge, mis torkab emotsiooni lahti, selle asemel et seda lahti lasta. Miks see ekraanil ebaõnnestub?
Suurenenud kognitiivne koormus. Siin toimuv seostub otseselt kognitiivse koormuse teooriaga. Kui stseen (või liides) palub kasutajatel töödelda kahte konkureerivat emotsionaalset signaali korraga, toob see kaasa kõrvalise kognitiivse koormuse, vaimse pingutuse, millel pole ülesande või hetkega midagi pistmist. Selle asemel, et keskenduda emotsionaalsele rütmile, jagatakse tähelepanu signaalide vahel, mis üksteist ei lahenda. Toodete puhul juhtub see nii, kui huumor, reklaamid või ootamatud kasutajaliidese muutused tungivad kõrge panusega hetkedesse: kasutajad on sunnitud tõlgendama tooni ja kavatsusi samal ajal, kui nad üritavad tegutseda, mis aeglustab arusaamist ja suurendab stressi. Võistlevad löögid samal ajal. Nali kattub tõsise löögi haripunktiga; publik pöörab tähelepanu pigem lülitile kui tundele. Ei mingit tonaalset üleandmist. Pole üleminekut, mis loob intiimsuse enne huumori saabumist, nii et hetk tundub pigem alahinnatud kui lahendatud.
Kuidas see tähendab UX-i? Toodete puhul on see konfettide enne kinnitamist probleem, räige viga rahavoos või reklaammodaal, mis ilmub otse kriitilise ülesande keskel. See suurendab ka kognitiivset koormust: kasutajad peavad probleemi lahendamisel huumorit töötlema, mis aeglustab neid ja suurendab stressi.
Kiired määratlused Emotsioon Flow-sEmotional nihked tunduvad teenitud, telegrafeeritud ja ajastatud, nii et need lahendavad eelnevad löögid. Keelekümblus hoiab. Emotsioon konfliktisPõhjatav lüliti (või kõva lõige), mis torkab elava emotsionaalse löögi. Keelekümbluspausid.
Nüüd, kui oleme sellele nime andnud: kuidas see UX-iga ühendub? Kuidas emotsioonid kujundavad toote meeldejäävust Inimesed ei mäleta kogemuse keskmist; nad mäletavad tippe ja lõppu. Kui teie voo haripunkt on pettumust valmistav või teie lõpp on segane, jääb see kinni. Nii et kujundage emotsionaalne kõver meelega. Emotsioonid elavad kolmes kihis (Don Normani emotsionaalsest disainist) ja teie toode peab need järjestama:
Vistseraalne (sool): esmamulje signaalid: visuaal, liikumine, haptika, heli. Näited: stabiilne luustikulaadur rahustab rohkem kui närvilisusvurr; õrn edukella/haptiline koputus laseb võidul karjumata maanduda; järjepidev leevendamine/suund annab silmale teada, mis muutus. Käitumine (tegemine): kas ma saan oma ülesande sujuvalt täita? Hõõrdumine tähendab siin stressi.Näited: kolm selget makseetappi prognoositava edenemisega; veaolekud, mis selgitavad, mis juhtus ja kuidas taastuda; vormilõpu plahvatuste asemel tekstisisene valideerimine. Peegeldav (tähendab): Lugu, mille räägin endale pärast: "Kas see oli seda väärt? Kas ma usaldan seda?" Näited: Korralik koondekraan ("Valmis. Reedeks saad X.") annab sulgemise; väike kokkuvõte ("Säästsite sel aastal 18 €") tekitab uhkust ilma ilutulestikuta.
Mikrointeraktsioonid on emotsionaalne liim. Igal neist on päästik (puudutan Pay), reeglid (mida süsteem teeb), tagasiside (edenemine ja selge tulemus) ning tsüklid või režiimid (mis juhtub, kui kasutaja proovib uuesti). Tehke need õigesti ja teie üleminekud sillutavad tundeid. Tehke need valesti ja nad katkestavad voolu.
Emotsionaalne beat sheet kaardistab selgelt Normani kogemuste kihtide:
Ebakindlus elab vistseraalses ja varases käitumiskihis, kus kasutajad toetuvad toimuva mõistmiseks sensoorsetele näpunäidetele (liikumine, selgus, tagasiside). Selgus on kindlalt käitumiskihis, hetk, mil süsteemi kavatsused ja kasutaja järgmine tegevus paika loksuvad. Ennetamine on segu käitumuslikust (kasutaja teeb midagi eesmärgipäraselt) ja peegeldavast (kasutaja ennustab juba tulemust ja kujutab ette, mis järgmiseks tuleb). Saavutus on peegeldav tipp, kus kasutaja hindab edu, usaldust ja seda, kas kogemus tundus õige. Rahulik/sulgemine on peamiselt peegeldav, aidates kasutajatel interaktsiooni tähendust kokku võtta ja otsustada, kas toode on usaldusväärne ja selle juurde tagasi pöördumist väärt.
Päris toodete puhul see jada ei kao, kui asjad lähevad valesti. Vead, latentsus ja halvenenud olekud ei ole emotsionaalse kaare erandid – need on osa sellest. Läbi narratiivse objektiivi vaadatuna on need hetked takistuseks kangelase teekonnal. Hästi läbimõeldud taastumisseisund tunnistab tagasilööki, selgitab juhtunu ja suunab järgmist sammu ilma uut emotsionaalset müra tekitamata. Kui ebaõnnestumist käsitleda rebenemise asemel löömisena, võib emotsionaalne voog säilida ka stressi all. UX-i näited: emotsioonid voolus vs emotsioon konfliktis Emotsioon voolus Kassa tehtud õigesti (Stripe/Apple Pay stiil): lühikesed sammud, selge edenemine ja selge edu olek (linnuke koos valikulise pehme haptikaga). Tipp (edu) maandub ja lõpp annab sulgemise (kviitung või järgmine samm).
Korjamise olek (sõidurakendused, nt Uber, Free Now või Bolt): järkjärgulised värskendused säilitavad orientatsiooni ja vähendavad ärevust ("Juht saabub", "2 minuti kaugusel", "Saabus"). Ebakindlus muutub selguseks, õrna liigutusega valmistab iga ülemineku ette.
Emotsioon konfliktis Märkus. Me ei nimeta siin konkreetseid tooteid – austame nende taga tehtud tööd. Selle asemel näitame mustreid, mis põhjustavad emotsionaalseid konflikte ja kuidas neid täpselt parandada.
Naljad tõsistel hetkedel. Naljakad copy-in-error olekud raha/tervise/turvalisuse pärast. Kasutajad on stressis; huumor võimendab ärritust. Tähistamine enne lahendust. Konfetid, ilutulestik või valjud helid enne kinnitamist. Pidu katkestab haripunkti. Raske oleku hüpped. Üllatusmodaalid/reklaamid keskülesanne, täisekraanil ülevõtmine ilma ettevalmistuseta. Tundub nagu järsk lõikamine emotsionaalse löögi ajal.
Mida saate teha emotsioonide tagamiseks Flow's Siin on leht Mõte koos täieliku malliga, mida saate dubleerida:
Emotsionaalne beat-lehe mall.
1. Kirjutage kõigepealt emotsionaalne löökleht Kaardistage iga põhivoo jaoks (astumine, maksmine, taastumine) tunded sammu kohta: ebakindlus → selgus → ootus → saavutus → rahulik. Kinnitage igale löögile koopia, liikumine ja mikrointeraktsioonid. (Kes kuhu emotsiooni kannab?) 2. Joondage toon ülesande riskiga Loo toonimaatriks (riskitase × olek). Suure riskiga vigade korral olge rahulik, lihtne ja lahendustele orienteeritud. Salvestage mängulisus madala riskiga kontekstides. Mallilõigud:
Kõrge riskiga viga: "Me ei saanud teie isikut tõendada. Proovige uuesti või võtke ühendust toega." Madala riskiga tühi olek: "Siin pole veel midagi. Kas soovite alustada prooviga?"
See on koht, kus paljud küpsed tooted triivivad vaikselt emotsionaalsetesse konfliktidesse. Aja jooksul lisavad meeskonnad rõõmu pigem harjumusest kui kavatsusest. Kasulik enesekontroll on küsida: kui eemaldaksime sellest sammust kõik mängulised või pidulikud elemendid, kas voog tunduks ikkagi inimlik – või oleksneed elemendid varjavad hõõrdumist? Hea emotsionaalne disain muudab kogemuse selgemaks; suurepärane emotsionaalne disain ei vaja segaduse kompenseerimiseks kaunistust. 3. Disaini tipp ja lõpp Tehke üks selge tipp (edu hetk) ja üks puhas lõpp (kinnitus ja mis edasi saab). Mõõtke meenutamist ja rahulolu mõlemas punktis. 4. Kasutage mikrointeraktsioone silladena, mitte prožektoritena
Ettevalmistus: väikesed järjepidevad liikumise vihjed enne suurt olekumuutust. Kinnitage: edu saavutatakse peenelt, pisut aeglasema väljalaske ja valikulise kerge haptikaga. Taastumine: korduv ebaõnnestumine muudab tooni rõõmsalt toetavaks ja suunab järgmise sammu.
5. Emotsionaalse järjepidevuse test Ärge küsige kasutatavuse seanssidel lihtsalt "Kas see oli lihtne?" Selle asemel võite küsida: "Mis tunne siin muutus?" Kui kuulete "segaduses → lõbustatud → segaduses", on teil konflikt, mitte vool. Korrake üleminekuid, mitte ainult ekraane. Kuidas konfliktis emotsioone vältida: kiire kontrollnimekiri Punased lipud → parandused:
Naljad tõsistel hetkedel → vaheta rahulik, vahetu keelekasutus ja selge taastumistee vastu. Tähistamine enne otsustamist → viige tähistamine pärast kinnitamist; vähendage seda kõrge riskiga ülesannete jaoks. Kõva oleku hüpped → üleminekute ettekuulutamine; hoia raamimine ühtlane; kasutage järjepidevuse säilitamiseks mõtestatud liikumist. Meeskondadevaheline toonide triiv → tsentraliseerige hääle- ja toonijuhised näidetega riskitaseme ja oleku kohta.
On hetki, mil emotsionaalse voolu katkestamine on tahtlik ja vajalik. Turvahoiatused, juriidilised kinnitused ja ohutuskriitilised hoiatused toovad sageli kasu järskudest toonimuutustest. Sellistel juhtudel annab häire märku tähtsusest ja nõuab tähelepanu. Probleem ei ole emotsionaalne konflikt ise; see on juhuslik konflikt. Kui disainerid valivad häireid tahtlikult, mõistavad kasutajad piitsalöögi asemel panuseid. Järeldus Suured kogemused on suunatud kogemused. Dan da Dan näitab, kuidas liikuda läbi tunnete meid kaotamata: see valmistab ette, läheb üle ja laheneb. Supermani stseen näitab vastupidist: gag põrkab kokku südamliku löögiga. Tehke endine. Kaardistage oma emotsionaalsed löögid, joondage toon ülesande riskiga ja laske mikrointeraktsioonidel tundeid sillustada, et kasutajad mäletaksid õiget tippu ja õiget otsa, mitte piitsahoopi keskel.
