Mniej zaufania, więcej prawdy: najlepsze praktyki i wzorce projektowania w sieci Web3

Opublikowany: 2022-07-22

Deweloperzy marzą o nowym internecie. Web3 to zdecentralizowany model, który daje użytkownikom pełną własność platform i treści, które tworzą online. Jednak próba zrewolucjonizowania Internetu wiąże się z wieloma wyzwaniami projektowymi — głównie z budowaniem interfejsów użytkownika, które rozwiązują zamieszanie i obawy związane z bezpieczeństwem spowodowane różnymi funkcjami Web3.

Objaśnienie Web3

Aby zrozumieć Web3, warto znać krótką historię Internetu:

  • Web 1.0 był zdecentralizowany, co oznaczało, że własność i kontrola nad treściami i platformami były rozproszone wśród wielu osób i firm.
  • Web 2.0, obecna iteracja Internetu, ewoluowała dzięki niewielkiej liczbie firm tworzących oprogramowanie z platformami przyjaznymi dla użytkownika, takimi jak Apple, Google, Facebook (obecnie Meta) i Twitter. W miarę jak coraz więcej osób stawało się aktywnymi twórcami i konsumentami online, sieć stawała się coraz bardziej scentralizowana, będąc w dużej mierze własnością i kontrolowaną przez kilka korporacji.

Dzięki Web3 programiści ponownie decentralizują internet. Monopole technologiczne nie będą już posiadać i kontrolować treści i platform tworzonych przez użytkowników. Web3 ma również na celu rozwiązanie problemów związanych z bezpieczeństwem i prywatnością w Internecie.

Web3 to:

  • Trustless: Deweloperzy, twórcy treści i inni użytkownicy zachowują kontrolę nad sposobem tworzenia i utrzymywania platform Web3 i DApps — zdecentralizowanych aplikacji — oraz nad tym, jakie treści mogą być publikowane. Mają pełny wgląd w kod i sposób uruchamiania usług. Stoi to w przeciwieństwie do Web 2.0, gdzie korporacje i rządy mają kontrolę, a użytkownicy nie mogą niezależnie weryfikować informacji o tym, jak aplikacje są tworzone i zarządzane.
  • Bez uprawnień: użytkownicy mogą wejść do dowolnej aplikacji Web3 bez zezwolenia firmy lub agencji rządowej. Logują się za pomocą cyfrowych portfeli kryptograficznych, które przechowują ich klucze prywatne, hasła, których używają, aby uzyskać dostęp do walut cyfrowych. Portfele mogą być sprzętem podobnym do dysków USB lub aplikacji mobilnych, takich jak MetaMask i TrustWallet.
  • Rozproszone: Władza i kontrola nad produktami i usługami internetowymi nie są skoncentrowane w rękach inwestorów lub dyrektorów generalnych, ale równomiernie rozłożone wśród użytkowników, którzy zarabiają udziały własnościowe w oparciu o swój wkład w rozwój i utrzymanie platform Web3.
  • Otwarte: Web3 działa na blockchainie, który przechowuje dane w poszczególnych grupach, zwanych blokami. Gdy blok jest wypełniony informacjami, jest on połączony z poprzednim, tworząc łańcuch w porządku chronologicznym. Blockchain to otwarta księga najczęściej używana do rejestrowania transakcji finansowych.

Wiele aplikacji Web3 jest tworzonych przez małe zespoły składające się w dużej mierze z programistów i przez nich kierowane. Niektóre zespoły są niezależne; inne są zatrudniane przez firmy, w tym rynki NFT (nonfungible token) i giełdy kryptograficzne. Często to programiści zatrudniają projektantów do pracy nad produktami Web3. W wielu przypadkach preferowani są projektanci z wcześniejszym doświadczeniem Web3 ze względu na stromą krzywą uczenia się w tej szybko zmieniającej się przestrzeni.

Web3 Przypadki użycia i bariery dla ekspansji

Web3 jest zdominowany przez aplikacje finansowe: kryptowaluty, giełdy kryptograficzne do handlu (giełdy zdecentralizowane lub DEX) i NFT, które są używane do oznaczania własności unikalnych przedmiotów cyfrowych lub fizycznych. Ponadto zdecentralizowane finanse (DeFi) pozwalają użytkownikom ominąć banki i uzyskać dostęp do usług finansowych typu peer-to-peer, takich jak zaciąganie pożyczek, udzielanie pożyczek, otrzymywanie odsetek i handel aktywami.

Rozszerzenie Web3 na inne sektory okazało się trudne. Na przykład nie ma sposobu, aby odróżnić legalną witrynę Web3 od oszustwa — problem, który jest potęgowany, ponieważ użytkownicy muszą wprowadzić swoje dane uwierzytelniające portfela kryptowalutowego, aby uzyskać dostęp do platform Web3. Jeśli witryna Web3 jest oszustwem, każdy użytkownik, który wchodzi, może potencjalnie stracić wszystkie swoje pieniądze.

Inną kwestią jest to, że blockchain nie pozwala na przesyłanie zdjęć lub filmów. Użytkownicy mogą przechowywać multimedia w sieciach kryptograficznych, takich jak Ethereum, ale jest to drogie.

W grach wideo Web3, NFT mogą reprezentować awatary graczy i zakupione przedmioty – ale często niemożliwe jest przeniesienie tych zasobów do innych gier lub aplikacji, co zmniejsza inwestycje graczy i odstrasza ich od gier Web3.

Co projektanci muszą wiedzieć

Wykorzystanie następujących wzorców interfejsu użytkownika i zasad projektowania UX może przyspieszyć rozwój platform Web3:

Dostarczaj jasne monity i pełne informacje

Wiele aplikacji Web3 błędnie zakłada znaczne doświadczenie ze strony użytkowników. Zamiast tego projektanci powinni wyjaśnić implikacje nieznanych funkcji i działań Web3. Na przykład przed zdeponowaniem środków kryptograficznych w puli płynności nowi inwestorzy muszą wiedzieć, że ich pieniądze mogą stracić na wartości – ostrzeżenie, które może zostać dostarczone wraz z wyskakującym komunikatem na ekranie wpłaty.

Działania w aplikacjach DeFi są regulowane przez standardy znane jako protokoły. Większość aplikacji DeFi przeprowadza regularne audyty bezpieczeństwa i dokumentuje kluczowe ustalenia, w tym luki w zabezpieczeniach oraz problemy i poprawki kodu. Projektanci mogą zapewnić, że aplikacje DeFi powiadamiają użytkowników o dostępności nowych raportów z audytu, a także mogą ułatwić zrozumienie audytów, podsumowując złożone sekcje czystym tekstem.

Podobnie wiele osób czyta dokumentację produktu Web3, aby zrozumieć mechanikę protokołów i podejmować świadome decyzje dotyczące korzystania z aplikacji. Wiele z tego materiału składa się z trudnego do zrozumienia technicznego żargonu.

Tutaj ponownie projektanci mogą zapewnić przyjazną dla użytkownika treść, dostarczając podsumowania konwersacji na początku sekcji dokumentacji, wraz z linkami do bardziej technicznych treści. Wyskakujące glosariusze można osadzać w tekście jako ikony łączy, umożliwiając użytkownikom poznanie znaczenia terminów za pomocą kliknięcia myszą lub dotknięcia palcem. A kopia może być podzielona na obrazy, które ilustrują ważne koncepcje Web3.

Używaj znajomych walut do komunikowania się o kursach wymiany

Ponieważ kryptowaluty, takie jak bitcoin, stają się coraz bardziej popularne, a ich ceny wahają się, może być trudno śledzić, ile są warte. W portfelach cyfrowych i aplikacjach e-commerce, w których te tokeny są kupowane, sprzedawane i wymieniane na aktywa, takie jak NFT, projektanci powinni pokazywać użytkownikom konwersje cen z kryptowalut na ich rodzimą walutę i unikać używania więcej niż kilku miejsc po przecinku.

Spraw, aby skróty portfela i transakcji były łatwo czytelne

Domyślnie każdy adres w łańcuchu bloków to długi ciąg znaków — do 42 — znany jako identyfikator lub skrót. Wysyłając środki, ludzie muszą sprawdzić cały ciąg. Łatwo popełnić błąd, a stawka jest wysoka: wszystkie transakcje blockchain są ostateczne. Jeśli zasoby zostaną wysłane na niewłaściwy adres portfela, nie ma możliwości ich odzyskania. W firmie inwestycyjnej, w której pracowałem, pośredniczyliśmy w transakcjach ICO (początkowa oferta monet), wysyłając ogromne przelewy do uczestniczących firm — i za każdym razem sześć osób sprawdzało adres portfela odbiorcy.

Ethereum Name Service (ENS) umożliwia ludziom zmianę ich skrótów na coś łatwiejszego do odczytania i zapamiętania, takie jak ich imiona plus .eth . Jednak nie wszyscy korzystają z ENS, ponieważ jest to kosztowne.

Projektanci Web3 UX mogą sprawić, że transakcje będą mniej stresujące, pokazując tylko pierwsze i ostatnie cztery znaki skrótu, aby umożliwić użytkownikom weryfikację bez sprawdzania całego ciągu. Projektanci mogą również wprowadzić wymóg, aby użytkownicy dwukrotnie sprawdzali hash przed jakąkolwiek transakcją, a także mogą umieszczać logo identyfikacyjne obok każdego adresu odbiorcy. Tym dodatkowym warstwom weryfikacji powinno towarzyszyć przypomnienie, że wysłanie aktywów na zły adres spowoduje całkowitą utratę środków.

Wyjaśnij czas oczekiwania na transakcję

Przelewając środki online za pośrednictwem banku, natychmiast otrzymujesz aktualizację statusu lub potwierdzenie, że transakcja się powiodła. Nie jest tak w przypadku Web3 DEX. Minimalny czas przetwarzania transakcji blockchain wynosi około trzech minut — ale musiałem czekać aż dwie godziny. Korzystam z tej technologii od sześciu lat i nadal wpadam w panikę, gdy pieniądze opuszczają mój portfel i nie otrzymuję potwierdzenia dostawy na czas.

Więcej DEX-ów powinno pokazywać status transakcji za pomocą tekstu lub animacji, na pasku stanu lub w powiadomieniach. Jeśli wyświetlanie aktualizacji w interfejsie użytkownika nie jest wykonalne, dobrą alternatywą jest udostępnienie łącza do eksploratora bloków typu open source — takiego jak Etherscan w sieci Ethereum.

Zrzut ekranu pokazuje powiadomienie o wpłacie Tether (USDT), kryptowaluty hostowanej w sieci Ethereum. Komunikat brzmi: „Jeśli Twoja wpłata nie dotrze w szacowanym czasie, sprawdź postępy w Samodzielnej pomocy wpłaty” i zawiera link. Jest również tekst wskazujący, że średni czas przybycia to trzy minuty, a monety zostaną wpłacone po 12 potwierdzeniu przez sieć. Dodatkowo wyświetlane jest bieżące saldo użytkownika w wysokości 0 USDT.
Powiadomienie o wpłacie kryptowaluty Tether (USDT) w sieci Ethereum. Więcej giełd Web3 musi wyświetlać status transakcji i średni czas dostawy, aby zwiększyć komfort i pewność użytkowników. (Źródło: Shetcoiner.com)

Zaimplementuj przycisk „Wyślij Max”

Bitcoin, eter i inne kryptowaluty są często wyrażane w wielu miejscach po przecinku, na przykład 0,0000085191. Trudno jest dokładnie i skutecznie wpisać całkowitą kwotę podczas wysyłania pieniędzy do osoby lub firmy w celu zakupu aktywów, takich jak NFT, lub podczas deponowania środków w inteligentnym kontrakcie. Polecam, aby projektanci stworzyli w aplikacjach przycisk „Wyślij Max”, pozwalający użytkownikom jednym kliknięciem przenieść całe saldo portfela na inny adres.

Jest to wygodne, gdy saldo portfela danej osoby jest równe lub nieco wyższe niż suma, którą muszą przelać; niektórzy użytkownicy mają wiele portfeli, co zwiększa prawdopodobieństwo takich zdarzeń. Mogą przesłać pełne saldo, a funkcja automatycznie konwertuje je na bitcoin lub eter. Ta funkcja nie wykonuje żadnych rozliczeń, gdy saldo portfela jest większe niż suma należna, więc projektanci powinni dołączyć okno dialogowe z potwierdzeniem, aby upewnić się, że użytkownicy nie wysyłają przez pomyłkę więcej, niż zamierzają.

Wyjaśnij, jak działają ceny gazu

Gaz jest prawdopodobnie najbardziej denerwującą i dezorientującą rzeczą w Web3, szczególnie dla kogoś nowego w kryptowalutach. Ceny gazu to dodatkowe opłaty, które użytkownicy ponoszą w celu pokrycia kosztów mocy obliczeniowej wymaganej do przetwarzania transakcji. Użytkownicy mogą zdecydować się na płacenie wyższych opłat, aby przyspieszyć transfery.

Projektanci muszą wyjaśnić, czym jest gaz i jak działa. Jeśli to możliwe, powinni pokazywać cenę gazu w rodzimej walucie fiducjarnej, która jest najczęstsza wśród użytkowników (zwykle USD). Projektanci mogą również zasugerować realną kombinację ceny gazu i wynikającej z niej szybkości przesyłu; w przypadku wstrzymania lub niepowodzenia transakcji z powodu niskich opłat za gaz projektanci powinni umożliwić użytkownikom płacenie wyższych opłat, aby przyspieszyć transfery.

Spraw, aby historie transakcji użytkowników były łatwo dostępne

Praktycznie wszystkie scentralizowane witryny e-commerce (web 2.0) umożliwiają użytkownikom sprawdzenie ich pełnej historii zakupów. Trudno jest uzyskać dostęp do takiego rekordu na zdecentralizowanej giełdzie: Portfele udostępniają historię transakcji, ale tylko dla jednego konta na raz, a filtrowanie według DApps jest trudne lub niemożliwe. Aby uzyskać taką historię dostępną na scentralizowanej platformie, użytkownicy Web3 muszą przejść do eksploratora bloków, takiego jak Etherscan, który nie jest przyjazny dla użytkownika i utrudnia znalezienie konkretnej transakcji.

Projektanci Web3 powinni dać ludziom prosty sposób przeglądania transakcji on-chain, które dokonują w ramach poszczególnych DApps. Powinien być umieszczony w łatwym do znalezienia miejscu, takim jak panel boczny lub menu. Inną opcją byłoby utworzenie trybu „widoku łańcucha” aktywowanego przyciskiem: po kliknięciu umieściłby filtr na całym interfejsie użytkownika, wskazując całą zawartość w DApp, która jest przechowywana w łańcuchu bloków — w tym historię transakcji . Pomocne byłoby również umożliwienie użytkownikom łatwego filtrowania i eksportowania ich rekordów transakcji.

Zrzut ekranu przedstawia część historii transakcji użytkownika na Zerion, zdecentralizowanej giełdzie w sieci Ethereum. Przedstawione są dwa depozyty kryptowaluty – BitTorrent i ether – wraz z otrzymaniem gumowatego niedźwiedzia NFT. Dodatkowo obraz pokazuje saldo 15 023,99 USD, a także opcje cen gazu, przeliczania walut i zakupów kryptowalut. Boczne menu pokazuje, że historia jest tak łatwo dostępna, jak przegląd, inwestycje, przelewy, transakcje NFT i inne opcje.
Historia transakcji użytkownika na platformie DeFi Zerion, hostowanej w sieci Ethereum. Projektanci mogą ulepszyć interfejs użytkownika wielu aplikacji Web3, ułatwiając dostęp do tych rekordów, filtrowanie i eksportowanie. (Źródło: Zerion)

Włącz łatwe zarządzanie kluczami prywatnymi

Klucze prywatne, które umożliwiają użytkownikom dostęp do ich cyfrowych portfeli, nie są łatwe do przechowywania. Ludzie czasami zapominają o stworzeniu ich kopii zapasowych lub nie wiedzą, jak to zrobić. Te klucze nie mogą być odzyskane po utracie: Nie ma opcji „zresetuj hasło”. Projektanci mogą rozwiązać ten problem, podążając za przykładem MetaMask i zapewniając każdemu użytkownikowi frazę początkową, serię słów, których można użyć do odblokowania portfela.

Projektanci muszą również ostrzec użytkowników, że ich fundusze będą niedostępne i podatne na kradzież, jeśli stracą swoje klucze prywatne lub frazy początkowe. Taka wiadomość powinna pojawić się w aplikacji portfela użytkownika, najpierw jako powiadomienie podczas konfigurowania portfela, a następnie jako powtarzające się przypomnienie o ustalonym harmonogramie.

Kluczowe dania na wynos

Aby Web3 zyskało na popularności i wyszło poza portfele cyfrowe i platformy finansowe, projektanci muszą uczynić aplikacje Web3 bardziej spójnymi i intuicyjnymi. Muszą również zapewnić prostszą edukację użytkowników, aby pomóc nowym użytkownikom zapoznać się z nowymi funkcjami i interakcjami dostępnymi na platformach Web3.

Zapewnienie bezpieczeństwa DApps również musi być priorytetem. Nie da się kontrolować nieufności i braku uprawnień w sieci Web3, ale projektanci mogą przewidzieć, co może pójść nie tak i pomóc zapobiegać takim zdarzeniom. Bardziej przejrzyste zastrzeżenia co do zagrożeń pozwolą na uspokojenie obaw ludzi i przekonanie ich do korzystania z Internetu3.

Dalsza lektura na blogu Toptal:

Jak projektować, aby uzyskać maksymalne zaufanie do produktu

Popraw swój UX dzięki zasadom udanego projektowania interakcji

Zalety Webflow bez kodu Projektowanie stron internetowych: studium przypadku