paint-brush
Felhasználóközpontú web3-alkalmazások (DApps) tervezése: tippek és trükkökáltal@aelfblockchain
3,134 olvasmányok
3,134 olvasmányok

Felhasználóközpontú web3-alkalmazások (DApps) tervezése: tippek és trükkök

által aelf9m2024/10/21
Read on Terminal Reader
Read this story w/o Javascript

Túl hosszú; Olvasni

Vegyen tippeket és trükköket a legfelhasználóbarátabb Web3 dApps megtervezéséhez. Ezenkívül megtudhatja, hogyan szabja személyre az AI a Web3 UX/UI-t. Megosztja az aelf, Layer 1 AI blokklánc.
featured image - Felhasználóközpontú web3-alkalmazások (DApps) tervezése: tippek és trükkök
aelf HackerNoon profile picture

A Web2-ről Web3-ra való lassú, de biztos váltás során a decentralizált alkalmazások (dApps) előrelépést jelentenek Web2-es társaikhoz képest, nagyobb felhasználói jogkörrel és adattulajdonnal.


Ennek ellenére az UX/UI hagyományos alapelvei (azaz konzisztens felületelemek, zökkenőmentes felhasználói beépítés, tömör nyelvezet) továbbra is értékesek; a másik oldalon pedig egyedi kihívások várnak az UX/UI tervezőkre és fejlesztőkre, akik arra törekszenek, hogy megnyerő felhasználói élményt hozzanak létre a dApps-ban.


Valójában egy statisztika kimutatta, hogy a Web3-felhasználóknak csak 25%-a érzi magabiztosnak a decentralizált alkalmazásokat.


A felhasználók nagyobb autonómiát várnak el, olyan intuitív interfészeket igényelnek, amelyek lehetővé teszik számukra, hogy könnyedén navigáljanak az összetett Web3-koncepciók és hálózatok között.


A web3-fejlesztőknek gyakran szoros együttműködésre van szükségük a tervezőkkel alkotásaik megvalósításához; A Web3 decentralizált jellege arra ösztönzi őket, hogy gondolják újra az emberi viselkedési változókat, például a bizalmi tényezőt, tekintettel arra, hogy a dApps már nem támaszkodik a közvetítőkre és a központosított ügynökségekre.

Mitől derül ki egy Web3 felhasználó?

A hagyományos webes alkalmazásokkal ellentétben a Web3 sokrétű közönséget szolgál ki, a tapasztalt kriptorajongóktól a DeFi- ben megvett újoncokig. A dApp tervezésekor vegye figyelembe a műszaki ismeretek különböző szintjeit.


  • Kripto-bennszülöttek : Ezek a felhasználók jól ismerik az olyan fogalmakat, mint a pénztárcák, a privát kulcsok és a gázdíjak. Előnyben részesíthetik a speciális funkciókat és testreszabási lehetőségeket.


  • Újoncok : Lehet, hogy ezek a felhasználók nem ismerik a blokklánc terminológiát , ezért egyértelmű magyarázatokra és útmutatásra van szükségük. Ennél a csoportnál az egyszerűség és a könnyű használhatóság a legfontosabb.

A Web3 intuitív tervezésének alapelvei

A Web3 és a blokklánc dApps intuitív kialakításában a felhasználó gondolkodásmódjának és utazásának megértése a legfontosabb. Kezdje a közönség mentális modelljének mérlegelésével. Újak a blokklánc-technológiákban, vagy a tér veteránjai?


A tudásszintjüket szem előtt tartó tervezés jelentősen javíthatja a használhatóságot.

1. Vigye be a Web2 ismerőst a Web3-ba

Metaforák és munkafolyamatok áthelyezése a Web2-ből, ahol releváns. Ez nem azt jelenti, hogy tartózkodnia kell a Web3 innovatív elemeitől, hanem inkább a hagyományos felhasználói felület összetevőit kell beépítenie. Az ismerősség lebontja a korlátokat; amikor a felhasználók felismerik a mintákat, könnyebben és magabiztosabban navigálnak.

2. A kevesebb több

Maga a Web3 ötlete már... sok. Az egyértelműségnek és az egyszerűségnek kell irányítania a tervezési döntéseket. A zavaros elrendezések kisiklhatják a felhasználók elköteleződését. Ehelyett törekedjen egy tiszta, letisztult felületre, amely kiemeli az alapvető funkciókat. Az alapvető elemeknek elöl és középen kell lenniük, csökkentve a kognitív terhelést, és segítve a felhasználókat a gyors döntések meghozatalában.


Az aelfscan, egy blokklánc-felfedező, az egyszerűséget példázza a felületén


3. Visszacsatolási hurok

Egy másik fontos szempont a visszajelzés. A dApp-ban minden műveletet, például egy swap-tranzakciót vagy adatbevitelt visszajelzésekkel kell nyugtázni, például nyilvánvaló megerősítő képernyőkön vagy animációkon keresztül. Ugyanebben a szellemben azonnali visszajelzést és megoldási ajánlatokat kell adni, amikor a felhasználók hibaüzenetekbe ütköznek (vagy UX/UI szóhasználattal „boldogtalan utak”).


Ez megnyugtatja a felhasználókat arról, hogy tevékenységeiket rögzítik és hatékonyak, ezáltal a bizalom és a megbízhatóság érzése alakul ki.

4. Következetes tapasztalat az eszköztípusok között

A legtöbb Web2-alkalmazáshoz hasonlóan a dApps mobilokon, asztali számítógépeken és táblagépeken is fut. A különböző platformok közötti konzisztencia kialakítása javítja a felhasználói élményt. Akár asztali alkalmazásról, akár mobil felületről van szó, a konzisztens navigáció és a vizuális jelzések segítenek a felhasználóknak az alkalmazás mentális térképének kialakításában, zökkenőmentessé téve az eszközök közötti átmenetet.


Ezenkívül csökkenti a szükségtelen paranoiát bizonyos tranzakciós tevékenységek során, például két különböző eszköz használatával QR-kódok beolvasására és pénztárcacímek bevitelére.


A Project Schrodinger, egy mesterséges intelligencia NFT-platform, amely arra készteti a felhasználókat, hogy a digitális macskákat kereskedelemben alkalmazzák, bemutatja a tapasztalatok és a felhasználói felület elemeinek egységességét az eszköztípusok között.


5. Biztonság és adatvédelem

A biztonságot nem lehet alábecsülni a Web3-ban, mivel a felhasználók gyakran értékes digitális eszközöket kezelnek (képzeljük el, mekkora mennyiséget mozgatnak egyedül a bálnák). Részesítse előnyben a robusztus hitelesítési módszereket, a lehetséges kockázatokra vonatkozó egyértelmű figyelmeztetéseket és a legjobb biztonsági gyakorlatokról szóló oktatási forrásokat.


Bár a Web3 és a blokklánc megváltoztathatatlan rekordjairól ismert, erős titkosítási technikák használatát javasolják a felhasználói adatok védelme érdekében, és egyértelműen közölnek óvintézkedéseket a felhasználók megnyugtatása érdekében. A részletes tranzakció-összefoglalók és a tevékenységi előzmények megadása szintén a megnyugvás erősítésének módja.

Gyakorlati tippek a Web3 UX/UI tervezéshez

Lefordítjuk ezeket az elveket megvalósítható tervezési stratégiákká:

1. Bevezetés

Az első benyomás számít. A felhasználók óvakodhatnak a bonyolultságtól vagy a biztonsági kockázatoktól, ezért bevált gyakorlat egy zökkenőmentes és lebilincselő bevezetési folyamat létrehozása, amely elvezeti az új felhasználókat a dApp alapvető tulajdonságain. Fontolja meg az interaktív oktatóanyagokat vagy a lépésenkénti útmutatókat az alkalmazáson belül és az interneten egyaránt.


Az egyképernyős regisztráció egy klasszikus megközelítés, amely jobban megfelelhet a tapasztalt Web3-felhasználóknak, akik már tudják, mire számíthatnak, és kényelmesen belemerülnek a dologba.


A csúsztatható bevezető képernyők ideálisak lehetnek az újoncok számára; az emészthető formátum segít nekik befogadni a dApp alapvető jellemzőit és értékajánlatát. Még ilyenkor is bevált gyakorlat, hogy legfeljebb három húzással tartsa be, mivel minden további lépés növeli a felhasználók lemorzsolódását.


A Portkey bevezetése két lépésből áll: Egy üdvözlő képernyő, majd egy bejelentkezési vagy regisztrációs képernyő, amely többféle SSO-módszert kínál.


2. Web3 Wallet integráció

A kriptopénztárca csatlakoztatása gyakran az első valódi interakció a felhasználónak a dApp-al. A nehézkes pénztárca-integrációs folyamat frusztrációhoz és elhagyáshoz vezethet. Néhány módszer a zökkenőmentessé tételre:


  • Csatlakozás egy kattintással: ahol csak lehetséges, törekedjen egy kattintásos kapcsolatra. Használjon WalletConnect vagy hasonló protokollokat a szükséges lépések számának minimalizálása érdekében.


  • Pénztárca felismerés: Automatikusan észleli a felhasználó telepített pénztárcáját, és jól láthatóan jeleníti meg a preferált opciókat


  • QR-kód támogatás: A QR-kód beolvasását kínálja alternatív csatlakozási módként, különösen a mobil felhasználók számára


  • Több pénztárca támogatása: A felhasználók széles körét szolgálja ki az olyan népszerű pénztárcák támogatásával, mint a MetaMask, Coinbase Wallet, Trust Wallet, Argent, Rainbow és természetesen a Portkey , az aelf ökoszisztémára épülő fiókabsztrakciós (AA) pénztárca.


  • Útmutató az újoncoknak: Adjon világos utasításokat és vizuális segédleteket, amelyek végigvezetik a felhasználókat a csatlakozási folyamaton, különösen akkor, ha még újak a Web3 pénztárcák


  • Biztonsági emlékeztetők: Világos és tömör biztonsági emlékeztetők megjelenítése a csatlakozási folyamat során, hangsúlyozva a privát kulcsok védelmének fontosságát.


Egykattintásos pénztárcacsatlakozás az ETransferen, QR-kód támogatással


3. Ismerje meg ügyfelét (KYC) integráció

Míg a decentralizáció a Web3 alapelve, sok dApp, különösen a pénzügyi tranzakciókkal vagy érzékeny adatokkal foglalkozó alkalmazások esetében, megköveteli, hogy az Ügyfelet Ismerje meg (KYC) folyamatok megfeleljenek a szabályoknak és biztosítsák a biztonságot.


  • Átláthatóság és egyértelműség: Világosan magyarázza el, miért van szükség a KYC-re, és hogyan kell kezelni a felhasználói adatokat. Legyen előre az összegyűjtött információkkal és azok felhasználásával kapcsolatban.


  • Áramvonalas folyamat: Tegye a KYC folyamatot a lehető leghatékonyabbá. Minimalizálja a lépések számát és a szükséges információ mennyiségét.


  • Biztonságos adatkezelés: Hangsúlyozza a felhasználói adatok védelmét szolgáló biztonsági intézkedéseket. Fontolja meg a decentralizált identitásmegoldások használatát a magánélet javítása érdekében.


  • Felhasználóbarát ellenőrzés: Integráljon megbízható KYC-szolgáltatókkal, amelyek zökkenőmentes és felhasználóbarát ellenőrzési élményt kínálnak


  • Egyértelmű visszajelzések és állapotfrissítések: Tájékoztassa a felhasználókat a KYC folyamat során. Adjon egyértelmű visszajelzést az ellenőrzés állapotáról és a szükséges műveletekről.

4. Tranzakciós folyamatok

A legtöbb Web3 interakció középpontjában a tranzakciók állnak. Egyszerűsítse a tranzakciós folyamatokat a gázdíjak, a becsült tranzakciós idők és a megerősítési lépések egyértelmű magyarázatával.


  • Vizuális tisztaság: Használjon világos vizuális jelzéseket a kulcsfontosságú információk, például a tranzakciós összegek, gázdíjak, hálózati díjak és becsült befejezési idők kiemelésére.


  • Valós idejű visszajelzés: Használjon betöltőket, folyamatjelző sávokat vagy állapotértesítéseket, hogy a felhasználók valós idejű tranzakciós frissítéseket kapjanak


  • Dinamikus árfrissítések: A token csereügyleteket vagy kereskedéseket magában foglaló tranzakciók esetén jelenítse meg a dinamikus árfrissítéseket, hogy tükrözze a piaci ingadozásokat. Tartalmazzon egyértelmű felelősséget az áringadozásról és annak a tranzakció végső összegére gyakorolt lehetséges hatásáról.


  • Háttérfeldolgozás: Amikor csak lehetséges, engedje meg a felhasználóknak, hogy elnavigáljanak a tranzakciós képernyőről, és más tevékenységeket hajtsanak végre a dApp-on belül, miközben a tranzakció a háttérben zajlik. Értesítéseket vagy figyelmeztetéseket küld a befejezéskor, vagy ha bármilyen hiba történik.


  • Megerősítő lépések: Végezzen egyértelmű megerősítési lépéseket a véletlen tranzakciók elkerülése érdekében. Követelje meg a felhasználókat, hogy nézzék át és kifejezetten erősítsék meg a tranzakció részleteit a benyújtás előtt.


  • Tranzakciós előzmények: Könnyen elérhető és kereshető részletes tranzakciós előzményeket biztosít. Lehetővé teszi a felhasználók számára a tranzakciók szűrését dátum, típus vagy állapot szerint.


Amikor a felhasználók átváltanak a Portkey-ről az AwakenSwap-ra, hogy tokencserét hajtsanak végre, a felelősség kizárása az áringadozásra vonatkozó figyelmeztetést tartalmaz.


5. Hibakezelés

A hibák elkerülhetetlenek. Az általános hibaüzenetek megjelenítése helyett adjon konkrét és informatív útmutatást a problémák megoldásához – ezt a legjobban empatikus nyelvezet egészítheti ki.


  • Konkrét és tájékoztató üzenetek: Kerülje az olyan általános hibaüzeneteket, mint a „Tranzakció sikertelen”. Adjon meg konkrét részleteket a hiba okáról, például „Nincs elég pénz a gázdíjhoz” vagy „Hálózati csatlakozási hiba történt”.


  • Kontextus szerinti útmutatás: Kontextus szerinti útmutatást kínál a hiba megoldásához. Például, ha egy tranzakció meghiúsul az elégtelen pénzeszköz miatt, adjon meg egy közvetlen linket a felhasználó pénztárcájához, vagy adjon meg egy útmutatót a szükséges kriptovaluta megszerzéséhez.


  • Hibamegelőzés: Amikor csak lehetséges, mindenekelőtt tegyen intézkedéseket a hibák megelőzésére. Használjon bemeneti érvényesítést annak biztosítására, hogy a felhasználók helyes adatformátumot adjanak meg, és egyértelmű figyelmeztetéseket adjon a lehetséges kockázatokról, mielőtt műveleteket kezdeményeznének.


  • Helyreállítási mechanizmusok: Helyreállítási mechanizmusokat kínál a gyakori hibákhoz. Például, ha a felhasználó alacsony gázdíjjal kezdeményez olyan tranzakciót, amely késedelmet okoz, engedje meg a tranzakció „gyorsítását” egy új, magasabb díjú tranzakció benyújtásával.


  • Felhasználóbarát nyelvezet: Kerülje a szakzsargont (azaz a 404-es hibát) a hibaüzenetekben. Világos, tömör és természetes társalgási nyelvet használjon, amely minden felhasználó számára könnyen érthető.


Hibakezelés a Project Schrodingernél és az ETransfernél


6. Eszköztippek és magyarázók

Ne feltételezze, hogy a felhasználók értik az összes terminológiát . Fontolja meg az eszköztippek vagy a bővíthető információs lapok nagyvonalú használatát a digitális érintkezési pontokon; magyarázza el tömören és laikus módon az olyan összetett kifejezéseket, mint a „gázdíj”, „intelligens szerződések”, „blokklánc-hálózatok” vagy „ NFT ”.


Az is bevált gyakorlat, hogy tudásbankot vagy dedikált GYIK-ot hozz létre a dApp-on belül a hosszabb formátumú súgótartalom tárolására.


A Portkey pénztárca GYIK oldala


7. Tesztelés és iteráció

A munka soha nem ér véget, még az indulás után sem. A dApp szorgalmas tesztelése és frissítése a hibák kijavítása érdekében adott, de ez a gerince a változó felhasználói igények követésének.


A cikkben korábban említettük a felhasználók kutatását felméréseken, interjúkon és használhatósági teszteken keresztül. Ez a felfedezések aranybánya, amely segít a dApp-élmény összpontosított fejlesztésében.


Az A/B tesztelés és a felhasználó szó szerint a két leggyakoribb módszer az UX/UI tervezési prototípusok és feltételezések megerősítésére. Készüljön fel arra, hogy a megállapítások alapján elforduljon, és kövesse nyomon, mi működik (és mi nem).


Ezek a lépések sokkal közelebb visznek alkotásod „Északi csillagaihoz”.

Zárásként: Bónusz tipp

A dApp sikere egy X tényezőn múlhat. A felhasználók emlékezni fognak az alkotásodra, vagy visszatérnek hozzá?


A személyre szabott élmények nyújtása lehet a válasz. Ez azt jelenti, hogy a felhasználók viselkedésük és preferenciáik alapján személyre szabott ajánlásokat kaphatnak a dApp-pal való interakció során. Ez lehet valami olyan egyszerű dolog, mint a felhasználó leggyakrabban használt funkciójának előre beállított parancsikonja, vagy testreszabott javaslatok egy tevékenységhez. Az AI-integráció segíthet ebben a láncon belüli tevékenységek elemzésével, a felhasználói preferenciák előrejelzésével, sőt proaktív segítségnyújtással is.


A felhasználó-központú élmények és interfészek a szoftver- és platformfejlesztők és tervezők munkáira is kiterjednek – a készítők maguk is felhasználók.


Ha az aelfre épít, egy nagy teljesítményű Layer 1 AI blokklánc , annak AI eszközkészlete és az aelf Playground integrált fejlesztői környezet felhasználóbarát jellege csökkenti az építési folyamat unalmát, így Ön és csapata kizárólag a tervezésre koncentrálhat. a lehető legjobb felhasználói élményt.


*Felelősség kizárása: Az ezen a blogon közölt információk nem minősülnek befektetési tanácsadásnak, pénzügyi tanácsadásnak, kereskedési tanácsnak vagy bármilyen más szakmai tanácsadásnak. Az aelf nem vállal garanciát a blogon található információk pontosságára, teljességére vagy időszerűségére vonatkozóan. Ne hozzon befektetési döntést kizárólag ezen a blogon található információk alapján. Mielőtt bármilyen befektetési döntést hozna, mindig konzultáljon képzett pénzügyi vagy jogi tanácsadóval.


Aelfről

Az aelf, az úttörő Layer 1 blokklánc moduláris rendszereket, párhuzamos feldolgozást, felhőalapú architektúrát és több oldalláncú technológiát kínál a korlátlan méretezhetőség érdekében. A szingapúri székhelyű globális központtal 2017-ben alapított aelf az iparágban elsőként vezeti Ázsiát a legmodernebb AI-integrációval rendelkező blokkláncok fejlesztésében, a blokkláncot intelligensebb és önfejlődő ökoszisztémává alakítva.


Az aelf megkönnyíti az intelligens szerződések és decentralizált alkalmazások (dApps) létrehozását, integrálását és üzembe helyezését az 1. rétegű blokkláncán a natív C# szoftverfejlesztő készlettel (SDK) és más nyelvű SDK-kkal, beleértve a Java, JS, Python és Go nyelveket. Az aelf ökoszisztémája számos dApp-ot is tartalmaz a virágzó blokklánc-hálózat támogatására. Az aelf elkötelezett az innováció előmozdítása mellett az ökoszisztémán belül, és továbbra is elkötelezett a Web3, a blokklánc fejlesztése és az AI technológia átvétele mellett.


Tudjon meg többet aelfről, és maradjon kapcsolatban közösségünkkel:

Weboldal | X | Távirat | Viszály