paint-brush
Com dissenyar aplicacions Web3 centrades en l'usuari (DApps): consells i trucsper@aelfblockchain
3,012 lectures
3,012 lectures

Com dissenyar aplicacions Web3 centrades en l'usuari (DApps): consells i trucs

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

Massa Llarg; Per llegir

Obteniu consells i trucs per dissenyar les dApps Web3 més fàcils d'utilitzar. A més, aprèn com l'IA personalitza la UX/UI de Web3. Compartit per aelf, cadena de blocs d'IA de la capa 1.
featured image - Com dissenyar aplicacions Web3 centrades en l'usuari (DApps): consells i trucs
aelf HackerNoon profile picture

En el lent però segur canvi de Web2 a Web3 , les aplicacions descentralitzades (dApps) prometen ser un pas més que les seves contraparts de Web2 amb una major capacitat d'usuari i propietat de les dades.


No obstant això, els principis tradicionals d'UX/UI (és a dir, elements d'interfície coherents, incorporació fluida de l'usuari, llenguatge concís) encara tenen valor; D'altra banda, hi ha reptes únics als quals s'enfronten els dissenyadors i desenvolupadors d'UX/UI que s'esforcen per crear experiències d'usuari atractives a les dApps.


De fet, una estadística ha demostrat que només el 25% dels usuaris de Web3 se senten segurs d'utilitzar aplicacions descentralitzades.


Els usuaris esperen més autonomia i exigeixen interfícies intuïtives que els permetin navegar per conceptes i xarxes complexos Web3 sense esforç.


Els desenvolupadors de Web3 sovint requereixen una col·laboració estreta amb els dissenyadors per realitzar les seves creacions; la naturalesa descentralitzada de Web3 els convida a repensar variables de comportament humà com el factor de confiança, tenint en compte que les dApps ja no depenen d'intermediaris i agències centralitzades.

Què fa que un usuari de Web3 funcioni?

A diferència de les aplicacions web tradicionals, Web3 s'adreça a un públic divers, que va des dels entusiastes de la criptografia experimentats fins als nouvinguts que es mullen els peus a DeFi . Quan dissenyeu una dApp, tingueu en compte aquests diferents nivells de comprensió tècnica.


  • Criptonatius : aquests usuaris se senten còmodes amb conceptes com carteres, claus privades i tarifes de gas. Poden prioritzar les funcions avançades i les opcions de personalització.


  • Nouvinguts : és possible que aquests usuaris no estiguin familiaritzats amb la terminologia de blockchain i necessiten explicacions i orientació clares. La senzillesa i la facilitat d'ús són primordials per a aquest grup.

Principis clau del disseny intuïtiu per a Web3

Quan s'aprofundeix en el disseny intuïtiu per a Web3 i blockchain dApps , entendre la mentalitat i el viatge de l'usuari esdevé primordial. Comenceu tenint en compte el model mental del vostre públic. Són nous a les tecnologies blockchain o veterans de l'espai?


Dissenyar tenint en compte el seu nivell de coneixement pot millorar dràsticament la usabilitat.

1. Porta la familiaritat de Web2 a Web3

Porta les metàfores i els fluxos de treball de Web2 quan sigui pertinent. Això no vol dir que hauríeu de defugir els elements innovadors de Web3, sinó que heu de teixir components tradicionals de la interfície d'usuari. La familiaritat trenca barreres; quan els usuaris reconeixen patrons, naveguen amb més facilitat i confiança.

2. Menys és més

La pròpia idea de Web3 ja és... molt. La claredat i la senzillesa han de guiar les opcions de disseny. Els dissenys confusos poden descarrilar la implicació dels usuaris. En lloc d'això, busqueu una interfície neta i ordenada que emfatitzi les funcions bàsiques. Els elements essencials haurien d'estar al davant i al centre, reduint la càrrega cognitiva i ajudar els usuaris a prendre decisions ràpides.


aelfscan, un explorador de cadena de blocs, exemplifica la simplicitat a la seva interfície


3. Bucle de retroalimentació

Un altre aspecte crucial és el feedback. En una dApp, cada acció, com ara una transacció d'intercanvi o una entrada de dades, s'ha de reconèixer mitjançant comentaris com ara pantalles o animacions de confirmació òbvies. En la mateixa línia, hi hauria d'haver retroalimentació instantània i ofertes de solucions quan els usuaris trobin missatges d'error (o, en el llenguatge UX/UI, "camins infeliços").


Això assegura als usuaris que les seves accions estan registrades i efectives, generant un sentiment de confiança i fiabilitat.

4. Experiència consistent en tots els tipus de dispositius

Com la majoria de les aplicacions Web2, les dApps s'executen a mòbils, ordinadors i tauletes. Dissenyar per a la coherència entre diverses plataformes millora l'experiència de l'usuari. Ja sigui en una aplicació d'escriptori o en una interfície mòbil, la navegació coherent i les indicacions visuals ajuden els usuaris a formar un mapa mental de l'aplicació, fent que la transició entre dispositius sigui perfecta.


També redueix la paranoia innecessària durant determinades activitats de transacció, com ara utilitzar dos dispositius diferents per escanejar codis QR i introduir adreces de cartera.


Project Schrodinger, una plataforma AI NFT que fa que els usuaris adopten gats digitals per a oficis, mostra la coherència en l'experiència i els elements de la interfície d'usuari en tots els tipus de dispositius.


5. Seguretat i Privacitat

La seguretat no es pot subestimar a Web3, ja que els usuaris sovint gestionen actius digitals valuosos (imagineu el gran volum mogut per les balenes soles). Prioritzeu mètodes d'autenticació sòlids, avisos clars sobre riscos potencials i recursos educatius sobre les millors pràctiques de seguretat.


Tot i que Web3 i blockchain són coneguts per registres immutables, advoquen per l'ús de tècniques d'encriptació sòlides per protegir les dades dels usuaris i comuniquen clarament les precaucions per tranquil·litzar els usuaris. Proporcionar resums detallats de transaccions i historial d'activitats també és una manera de fomentar la tranquil·litat.

Consells pràctics per a Web3 UX/UI Design

Traduïm aquests principis en estratègies de disseny accionables:

1. Incorporació

Les primeres impressions importen. Els usuaris poden desconfiar de la complexitat o dels riscos de seguretat, de manera que serà una bona pràctica crear un procés d'incorporació fluid i atractiu que guiï els nous usuaris a través dels elements bàsics de dApp. Penseu en tutorials interactius o guies pas a pas, tant a l'aplicació com al web.


El registre d'una sola pantalla és un enfocament clàssic que pot ser més adequat per als usuaris experimentats de Web3 que ja saben què esperar i que se senten còmodes immersos directament al fons.


Les pantalles d'incorporació que es poden lliscar poden ser ideals per als nouvinguts; el format digerible els ajuda a absorbir les característiques bàsiques i la proposta de valor de la dApp. Tot i així, una bona pràctica és mantenir-lo a no més de tres lliscaments, ja que cada pas addicional augmenta l'abandonament dels usuaris.


La incorporació de Portkey consta de dos passos: una pantalla de benvinguda, seguida d'una pantalla d'inici de sessió o de registre que ofereix diversos mètodes SSO.


2. Integració de Web3 Wallet

Connectar una cartera criptogràfica sovint és la primera interacció real que té un usuari amb una dApp. Un procés d'integració de cartera maldestra pot provocar frustració i abandonament. Algunes maneres de fer-ho sense problemes inclouen:


  • Connexió amb un sol clic: sempre que sigui possible, busqueu una connexió "d'un clic". Utilitzeu WalletConnect o protocols similars per minimitzar el nombre de passos.


  • Detecció de carteres: detecta automàticament les carteres instal·lades de l'usuari i mostra les seves opcions preferides de manera destacada


  • Compatibilitat amb codis QR: ofereix l'escaneig de codis QR com a mètode de connexió alternatiu, especialment per als usuaris mòbils


  • Compatibilitat amb carteres múltiples: ateneu una àmplia gamma d'usuaris donant suport a carteres populars com MetaMask, Coinbase Wallet, Trust Wallet, Argent, Rainbow i, per descomptat, Portkey , la cartera d'abstracció de comptes (AA) basada en l'ecosistema aelf.


  • Orientació per als nouvinguts: proporcioneu instruccions clares i ajudes visuals per guiar els usuaris durant el procés de connexió, especialment si són nous a les carteres Web3.


  • Recordatoris de seguretat: mostreu recordatoris de seguretat clars i concisos durant el procés de connexió, posant èmfasi en la importància de protegir les seves claus privades.


Connexió de cartera amb un sol clic a ETransfer, amb suport de codi QR


3. Integració Know-Your-Customer (KYC).

Tot i que la descentralització és un principi bàsic de Web3, moltes dApps, especialment les que tracten transaccions financeres o dades sensibles, requereixen que els processos Know Your Customer (KYC) compleixin la normativa i garanteixin la seguretat.


  • Transparència i claredat: expliqueu clarament per què es requereix KYC i com es gestionaran les dades dels usuaris. Sigueu sincers sobre la informació que es recopilarà i com s'utilitzarà.


  • Procés simplificat: feu que el procés KYC sigui el més eficient possible. Minimitzar el nombre de passos i la quantitat d'informació requerida.


  • Tractament segur de les dades: emfatitzeu les mesures de seguretat establertes per protegir les dades dels usuaris. Penseu en l'ús de solucions d'identitat descentralitzades per millorar la privadesa.


  • Verificació fàcil d'utilitzar: integreu-vos amb proveïdors KYC fiables que ofereixen una experiència de verificació senzilla i fàcil d'utilitzar


  • Comentaris clars i actualitzacions d'estat: manteniu els usuaris informats durant tot el procés KYC. Proporcioneu comentaris clars sobre l'estat de la seva verificació i les accions necessàries.

4. Fluxos de transaccions

Les transaccions són el centre de la majoria de les interaccions Web3. Simplifica els fluxos de transaccions proporcionant explicacions clares de les tarifes de gas, temps estimats de transacció i passos de confirmació.


  • Claredat visual: utilitzeu indicis visuals clars per ressaltar informació clau, com ara imports de transaccions, tarifes de gas, tarifes de xarxa i temps de finalització estimats.


  • Comentaris en temps real: utilitzeu carregadors, barres de progrés o notificacions d'estat per oferir als usuaris actualitzacions de transaccions en temps real


  • Actualitzacions de preus dinàmiques: per a les transaccions que impliquen intercanvis o transaccions de fitxes , mostreu actualitzacions de preus dinàmiques per reflectir les fluctuacions del mercat. Incloeu exempcions clares de responsabilitat sobre la volatilitat dels preus i el seu impacte potencial en l'import final de la transacció.


  • Processament en segon pla: sempre que sigui possible, permeteu que els usuaris s'allunyin de la pantalla de transacció i realitzin altres activitats dins de la dApp mentre la transacció s'està processant en segon pla. Proporcioneu notificacions o alertes quan finalitzi o si es produeix algun error.


  • Passos de confirmació: implementeu passos de confirmació clars per evitar transaccions accidentals. Exigir als usuaris que revisin i confirmin explícitament els detalls de la transacció abans d'enviar-los.


  • Historial de transaccions: proporcioneu un historial de transaccions detallat que sigui fàcilment accessible i cercable. Permet als usuaris filtrar les transaccions per data, tipus o estat.


Quan els usuaris canvien de Portkey a AwakenSwap per realitzar intercanvis de testimonis, sembla que una exempció de responsabilitat inclou un advertiment sobre la volatilitat dels preus.


5. Tractament d'errors

Els errors són inevitables. En lloc de mostrar missatges d'error genèrics, proporcioneu orientació específica i informativa sobre com resoldre problemes; això es complementa millor amb un llenguatge empàtic.


  • Missatges específics i informatius: eviteu missatges d'error genèrics com ara "La transacció ha fallat". Proporcioneu detalls específics sobre què ha fallat, com ara "No hi ha prou fons per a les tarifes del gas" o "Hi ha un error de connexió a la xarxa".


  • Orientació contextual: ofereix orientació contextual sobre com resoldre l'error. Per exemple, si una transacció falla per falta de fons, proporcioneu un enllaç directe a la cartera de l'usuari o una guia sobre com adquirir més de la criptomoneda necessària.


  • Prevenció d'errors: sempre que sigui possible, implementeu mesures per evitar errors en primer lloc. Utilitzeu la validació d'entrada per assegurar-vos que els usuaris introdueixen els formats de dades correctes i proporcioneu advertències clares sobre els riscos potencials abans d'iniciar accions.


  • Mecanismes de recuperació: ofereixen mecanismes de recuperació d'errors comuns. Per exemple, si un usuari inicia una transacció amb una tarifa de gas baixa que provoca un retard, permeteu-li "accelerar" la transacció enviant-ne una de nova amb una tarifa més alta.


  • Llenguatge fàcil d'utilitzar: eviteu l'argot tècnic (és a dir, l'error 404) als missatges d'error. Utilitzeu un llenguatge conversacional clar, concís i natural que sigui fàcil d'entendre per a tots els usuaris.


Gestió d'errors al Projecte Schrodinger i ETransfer


6. Suggeriments i explicacions

No suposeu que els usuaris entenen tota la terminologia . Penseu en l'ús generós de consells sobre eines o pestanyes d'informació ampliables als punts de contacte digitals; expliqueu termes complexos com "comissions de gas", "contractes intel·ligents", "xarxes blockchain" o " NFT ", d'una manera concisa i senzilla.


També és una bona pràctica crear un banc de coneixement o una PMF dedicada a la dApp per allotjar contingut d'ajuda de format més llarg.


Pàgina de preguntes freqüents de Portkey Wallet


7. Prova i iteració

El treball no s'acaba mai, fins i tot després del llançament. Provar i actualitzar amb diligència la dApp per corregir errors és un fet, però és l'eix vertebrador per mantenir-se al dia amb l'evolució de les necessitats dels usuaris.


A l'inici de l'article, vam esmentar la investigació dels usuaris mitjançant enquestes, entrevistes i proves d'usabilitat. És una mina d'or de troballes per ajudar a millorar l'experiència dApp d'una manera centrada.


Les proves A/B i l'usuari textualment són dos dels mètodes més comuns per afirmar prototips i supòsits de disseny d'UX/UI. Estigueu preparats per girar en funció de les troballes i feu un seguiment del que funciona (i del que no).


Aquests passos us haurien d'apropar molt més a les "Estrelles del Nord" de la vostra creació.

Al tancament: un consell de bonificació

L'èxit de la vostra dApp pot dependre d'un factor X. Els usuaris recordaran la teva creació o hi tornaran?


Oferir experiències personalitzades podria ser la resposta. Això significa que els usuaris poden obtenir recomanacions personalitzades mentre interactuen amb la dApp, en funció del seu comportament i preferències. Podria ser quelcom tan senzill com una drecera predefinida de la funció que s'utilitza més sovint per un usuari o suggeriments personalitzats per ajudar en una activitat. La integració de la IA pot ajudar amb això, analitzant l'activitat a la cadena, predint les preferències dels usuaris i fins i tot oferint assistència proactiva.


Les experiències i interfícies centrades en l'usuari també s'estenen al programari i plataforma en què treballen els desenvolupadors i dissenyadors: els constructors també són els mateixos usuaris.


Si esteu construint sobre aelf , una cadena de blocs d'IA de capa 1 d'alt rendiment, el seu conjunt d'eines d'IA i la facilitat d'ús de l'entorn de desenvolupament integrat aelf Playground elimina el tedi del procés de construcció, de manera que vosaltres i el vostre equip us podeu centrar únicament en el disseny. la millor experiència d'usuari possible.


*Exempció de responsabilitat: la informació proporcionada en aquest bloc no constitueix assessorament d'inversió, assessorament financer, assessorament comercial ni cap altra forma d'assessorament professional. aelf no garanteix ni garanteix l'exactitud, la integritat o l'actualitat de la informació d'aquest bloc. No hauríeu de prendre cap decisió d'inversió basant-vos únicament en la informació proporcionada en aquest bloc. Sempre hauríeu de consultar amb un assessor financer o jurídic qualificat abans de prendre qualsevol decisió d'inversió.


Sobre aelf

aelf, la cadena de blocs de capa 1 pionera, inclou sistemes modulars, processament paral·lel, arquitectura nativa del núvol i tecnologia multi-sidechain per a una escalabilitat il·limitada. Fundada el 2017 amb el seu centre global amb seu a Singapur, aelf és el primer del sector a liderar Àsia en l'evolució de la cadena de blocs amb integració d'IA d'última generació, transformant la cadena de blocs en un ecosistema més intel·ligent i autoevolutiu.


aelf facilita la creació, integració i desplegament de contractes intel·ligents i aplicacions descentralitzades (dApps) a la seva cadena de blocs de capa 1 amb el seu kit de desenvolupament de programari (SDK) C# natiu i SDK en altres idiomes, com Java, JS, Python i Go. L'ecosistema d'aelf també allotja una sèrie d'Apps per donar suport a una xarxa de blockchain en flor. aelf es compromet a fomentar la innovació dins del seu ecosistema i es manté dedicada a impulsar el desenvolupament de Web3, blockchain i l'adopció de la tecnologia d'IA.


Obteniu més informació sobre aelf i mantingueu-vos connectat amb la nostra comunitat:

Lloc web | X | Telegrama | Discòrdia