Ethereum DEVCON IV Review :: Deep Dive into Ethereum UX — #1. DAPP UI & User Research
이더리움 블록체인 사용자 경험의 현주소와 고찰
온더는 이더리움 블록체인의 확장성 솔루션 Plasma 체인을 연구개발하는 회사입니다. 온더의 비전은 이더리움 블록체인 기술의 사용성을 제고시키고, 암호경제와 현실경제를 연동시켜 지금보다 더 나은 세상을 만드는 것입니다.
안녕하세요 ? 온더의 한량 연구원 허상범입니다 😄 미디엄에는 꽤나 오랜만에 글을 쓰네요.
이번 주제는 10월 30일부터 11월 2일까지 체코 프라하에서 개최된 이더리움 DEVCON4의 리뷰, 특히 이더리움 블록체인의 사용자 경험(User Experience : 이하 UX) 이슈를 다룰 예정입니다.
적어도 국내에서는 블록체인 또는 DAPP의 UX에 대한 논의가 전혀 활발하지 않은데요. 이번 포스팅을 통해서 국내의 많은 UI/UX 디자이너, 프로덕트 담당자, 그리고 개발자 분들이 블록체인 UX에 좀 더 가까워졌으면 좋겠습니다.
DEVCON4에 참여하기 1달 전 즈음부터 블록체인 UX에 대한 문서를 틈틈히 작성하고 있던 터라, 컨퍼런스에서 논의된 내용과 더불어서 제가 생각하는 블록체인 UX란 무엇인지에 대해 포괄적으로 전달하겠습니다 :)
(참고) 아마 이 문서는 UI/UX에 관심있는 분들에게 주로 공유될 것 같은데요. 기존에 논의되던 UX 구성 요소들에 비해서 다소 이질적인 부분들에는 주의 또는 경고 표시를 미리 해두었으니 너무 난해하다 싶으시면 그냥 넘어가도 됩니다 :)
Index
Intro
DEVCON4 UX & Design Session Overview
#2. Mesh Network (Gig Economy)
#3. Wallet, ENS and Universal Login
#4. Mechanism Design Meets UX
#5. Gas Abstraction
DAPP UX Design Awards
Conclusion
Intro
사용자 경험(UX)이란?
일단, 현업에서 종사하고 계신 디자이너 분들이나 UX에 관심있는 분들은 바로 DEVCON4 UX & Design Session Overview 으로 점프하셔도 됩니다! 글의 서두 부분은 UX의 중요성을 잠시 상기시키고 싶어서 쓴 내용이라서요 👀
그게 아닌 분들은 꼭 읽어주시면 좋겠습니다. 제가 개인적으로 느끼기엔 블록체인 씬에서 만나는 분들은 기술이나 돈에만 관심있지, UX를 생소하게 느끼는 분들이 많을 것 같더라고요. 간단하게나마 그 중요성을 짚고가면 좋을 것 같습니다.
우선 우리 모두의 백과사전인 위키백과에 “사용자 경험”을 검색하면 아래와 같은 개념 정의가 나옵니다.
사용자 경험은 사용자가 어떤 시스템, 제품, 서비스를 직,간접적으로 이용하면서 느끼고 생각하게 되는 총체적 경험을 말한다.
음.. 너무 추상적입니다 😵 이번 포스팅은 DEVCON4 리뷰이기도 하니, 컨퍼런스에서 가져온 사진으로 이야기해보도록 하죠.
위 그림은 이더리움 DEVCON4의 마지막 날 진행되었던 UX Awards 에서 공개한 UX 우수성 심사 기준입니다.
1. Ingenuity (10%) : UX 솔루션이 얼마나 창의적인가 ?
2. Language & Visual Cues (20%) : 제품에서 필요한 액션과 비주얼적 요소들이 유저가 이해하기에 쉽고 명료한가 ?
3. Usability (30%) : 사용자와의 인터랙션이 쉽고 사용성이 높은가 ?
4. User Research (20%) : 충분한 리서치와 통찰로부터 UX 솔루션이 도출되었는가 ?
5. Accessibility (20%) : 유저들의 진입장벽을 얼마나 낮추었는가 ?
사용자 경험이라는게 기본적으로 아주 포괄적인 개념이지만, 대부분 위와 유사한 지표들을 가지고 UX를 평가하곤 합니다. 시각적으로 나타내면 아래와 같은 그림으로도 표현할 수 있겠네요.
이더리움 생태계에서의 UX 구성 요소들 역시 위 그림과 크게 다르지 않은데요. 앞으로 소개할 DEVCON4 UX & Design Session Overview 파트에서 이더리움 UX의 다양한 주제를 다뤄보도록 하겠습니다 :)
UX는 왜 중요한가 ?
현대 IT 사회에서는 제품을 기획하고 개발하는 프로세스에 있어서 UX에 대한 이해와 이에 대한 피드백을 자사의 제품에 반영하는 것은 정말 중요합니다.
IT 인프라를 기반으로, 디지털 네트워크에 의해 움직이는 현대 사회이다보니 재화의 수요자와 공급자 간에 정보가 유통되는 속도는 매우 빠릅니다. 이는 곧 On-demand 방식의 커뮤니케이션을 훨씬 용이하게 만들었죠.
즉, 공급자 위주의 경영 정책이 아니라 수요자 위주의 경영 정책이 각광받는 시대가 되었습니다.
소니와 애플을 통해 이해하는 UX의 중요성
가장 이해하기 쉬운 예를 들어 볼까요 ? 2018년 현재 수 많은 블록체인 플랫폼들이 등장하고 있는 것처럼, 2000년대 초반에는 수 많은 IT 벤처기업들이 탄생해 서로 경쟁하기 시작했습니다.
그중에서도 저는 특히 소니와 애플을 주로 비교하는데요. 이 두 회사는 유사한 비전과 제품군을 가지고 출발했지만, 서로 다른 UX 전략에 의해 각각 다른 노선과 지위를 갖게 된 대표적인 케이스입니다.
소니는 공급자 관점에서만 혁신을 해석하고 디자인적 완성도를 추구했던 회사였다. 공급망(supply chain)은 잘 갖췄지만 사용자 접점 구축에는 미흡했다. 이는 공급자 주도의 시장에서 급성장한 과거의 성공 경험과 2000년 이후 물량 공급(supply push) 위주의 경쟁 전략이 소비자 주도의 수요 중심(demand push)으로 전환된 환경에 적응하지 못하면서 만들어진 결과다… (중략)
- written by Dong-A Business Review (DBR) -
두 기업은 한 때 시장에서 어깨를 나란히 했으나 지금 시점에서 소니와 애플은 그 위상에 있어서 차이가 많이 납니다. 많은 사람들은 그 차이의 중심에 UX 전략에 대한 차별성이 있다고 이야기하곤 합니다. 즉, 이렇게 수요 위주의 IT 산업 생태계 에서 특정 제품의 대중적 수용(Mass Adoption)을 위해 가장 중요한 것은 UX라고 해도 과언이 아닙니다.
소니와 애플 뿐만이 아니라, 블록체인이나 분산 어플리케이션을 만들어가는 우리들도 모두 마찬가지입니다. 서버를 점유하고 있는 기업에 의해서 얼마든지 검열이 가능하고, 중앙화된 기존의 웹 인프라 및 서비스에서도 충분히 높은 삶의 질을 유지하고 있는 대중들은 기술의 과정이 아닌 “결과”만을 중요시할 뿐입니다.
솔직히 사용자들 입장에서 블록체인의 어려운 기술 스택과 핵심 가치(검열 저항성, 탈중앙성 등)들을 얼마나 중요하게 받아들일 수 있을지는 알 수 없죠. 굳이 이해할 필요도 없고요. 당신의 데이터가 검열될 수 있다는 것과 현재 웹 구조가 중앙화된 상태라는 것을 이해시키는건 아주 소모적인 일이라고 생각합니다. 결과로 보여줄 뿐입니다.
블록체인 UX 디자이너는 왜 희소할까 ?
사실 현재 국내에서 이더리움 블록체인에 대한 UX 환경은 거의 불모지에 가깝습니다. DAPP 또는 블록체인 UI/UX 전문가나 디자이너들 역시 거의 없다시피 할 정도지요.
이더리움 리서치 채널(ethresear.ch)에 있는 리서치 카테고리만 살펴봐도, UI/UX에 대한 논의는 그 비중 자체가 타주제에 비해 절대적으로 적습니다. 제가 생각하기에 그 이유를 간단히 적어보면 다음과 같습니다.
첫째. 일단 기술의 구조 자체가 너무 어렵습니다.
위는 이더리움 황서의 내용인 EVM 아키텍쳐를 시각화한 자료입니다. EVM은 쉽게 생각해서 모든 사람이 동일한 데이터를 공유하고 있는 월드 컴퓨터라고 생각하시면 됩니다.
사진을 딱 봐도 느껴지시겠지만, 이더리움 코어 레이어는 매우 복잡한 구조로 되어 있습니다. 기술을 Raw 레벨에서 도식화한 탓에 그럴 수도 있는데 좌우지간 저 그림만 봤을때는 이더리움이 사용자 친화적인 기술로 보여지진 않습니다. 정말로요..
물론 저도 EVM 내부 구조를 잘 알지 못하고 UI/UX 디자이너가 위 구조를 모두 다 알아야 하는 것도 아닙니다. 그러나, 바로 아래 내용인 Fat Protocol 관련 내용에서도 다시 한 번 언급할테지만, 이더리움 기반 DAPP의 UX를 이해하려면 이더리움 코어 구조 또는 프로토콜의 절차를 조금은 알아야 할 필요가 있습니다. 예를 들면 트랜잭션 수수료 가스(GAS)라든지 계정의 생성 과정, 월렛의 키 관리 등 이슈가 있겠지요. 하지만 그 진입장벽은 꽤나 높습니다 :(
Fat Protocol and Blockchain UX
Fat Protocol 가설은 기존 웹 구조와 블록체인의 가치 창출 방식이 서로 다르다는 걸 설명할 때 많이 차용되는 개념인데요. 사실 이게 UX에서도 꽤나 유효합니다. 간단하게나마 설명해보면 이렇습니다.
기존 Web 구조에서는 프로토콜 레이어보다 그 상위 계층인 어플리케이션 레이어에서 웹 기술이 더욱 실체화될 수 있었고 경제적 부가가치 역시 다양한 어플리케이션을 위주로 창출되어 왔습니다. 직관적인 예로, 우리는 인터넷 프로토콜의 창시자는 누군지 모르지만 Facebook의 마크 주커버그를 모르는 사람은 거의 없습니다.
그러나 블록체인의 경우에는 프로토콜이 체인의 유효성이나 완결성을 결정(GHOST, Casper FFG, etc)하고 네트워크의 안정성을 유지하는 데에 핵심적인 역할을 하고 있습니다.
당장 이더리움의 합의 방식이 PoS 알고리즘으로 바뀌면(빠른 시간 내에 안되겠지만), 이더리움의 데이터를 동기화시키고 보상을 받는 측면에 있어서 더 많은 사람들이 프로토콜을 유지하고 경제적 보상을 받을 수 있는 환경으로 변합니다. 그만큼 블록체인을 설명함에 있어서 프로토콜 자체가 어플리케이션 레이어에 비해 더욱 큰 비중을 차지하고 있습니다.
DEVCON4에서 논의되었던 UX 세션들의 컨텐츠도 프로토콜 레이어를 수정하거나 응용하는 것이 대부분이었습니다. 예컨대, 트랜잭션 수수료 모델에 변화를 준다거나 어카운트 주소를 좀 더 보기 쉽게 변환하는 것 따위의 것들이요.
그러나, 유저가 직접적으로 접하는 UI나 디자인 인사이트, 여러가지 UI 툴 역시 앞으로 매우 중요해질 것으로 생각합니다.
둘째. 암호화폐 경제를 파악하기 어렵다.
DAPP과 유저 간 상호작용을 가능하게 하는 매개체이자 디지털 자산인 토큰(token)의 경우, 그 자체로 경제적 가치를 지닌 재화입니다. 기술도 어려워 죽겠는데 이제는 경제까지 알아야 한다고 합니다. 편하게 살기 참 힘드네요.
어쨌든 블록체인 위에서 제품을 기획하거나 유저의 효용 수준을 고려할 때에는 경제적인 사고방식(또는 메커니즘 디자인)이 일정 수준 필요합니다. 솔직히, 어플 하나 만들려고 하는데 경제에 대한 감각이 이렇게까지 필요하나 싶을 정도입니다.
한편으로는 이해가 가는 것이, 상기 그림에 나타나있는 토큰 패턴들이 우리가 많이 이야기하는 “유틸리티 토큰”을 분류해놓은 그림인데요. 웬만한 DAPP 이 기획하는 토큰 모델은 대부분 특정 서비스와 연동되어서 유저에게 효용을 주는 유틸리티 토큰일 것입니다.
어떤 DAPP 팀에서 UI/UX 디자이너로 일한다면 기본적으로 자기가 서비스하려는 토큰이 무슨 토큰이고, 어떤 유틸리티를 제공하려고 하는지는 당연히 알아야하지 않을까요?
이 때, 이런 토큰 패턴들을 이해하기 위해서는 재화가 경제적으로 거래되는 기본적인 흐름 정도는 이해하면 좋습니다. 수요-공급 원리라던가… 그런 것들 말입니다. (물론 구현되지 않고 이론상으로만 존재하는 복잡한 토큰 패턴이 더 많습니다 😅)
이런 내용과 관련해서는 블록체인 교육 커뮤니티 BASE에서 입문자들을 대상으로 제가 발표했던 자료가 있습니다. 아래 공유된 자료를 참고하시면 블록체인 경제학이 도대체 뭔지 입문(!)하시는데에는 도움될 것 같습니다. 자료가 너무 허접하다면 맨큐의 경제학을 추천.. ㅎㅎㅎ
Ethereum and UX
자, 드디어 이더리움과 UX에 대한 내용으로 넘어왔습니다 !
아래는 Guidebook 모바일 앱에서 확인할 수 있는 데브콘의 UX & Design 세션 타임 테이블입니다. 첫째날부터 마지막날까지 타임테이블을 보면서, 이더리움 생태계도 이제는 본격적으로 UX 문제에 직면하고 있다는 것을 많이 느꼈습니다. 제가 위에 첨부한 Guidebook 타임 테이블 링크만 참고하셔도, 이더리움 UX의 흐름을 대충 느낄 수 있습니다.
작년 DEVCON 3에서 다소 활발하게 논의되었던 Plasma, State Channel, Zero Knowledge Proof(ZKP) 등의 스케일링 이슈보다는 이더리움을 현실 세계에 들여옴에 있어서 극복해야 할 실제적인 여정들이 주로 논의되고 있었습니다. 그 중 대표적인 것이 UI/UX 라고 봅니다. 실제로 UI/UX에 대한 세션이 따로 편성된건 DEVCON 4가 처음입니다.
이더리움 최전방에서 논의되고 있는 각종 UX 개선 사항들은 가스 시스템의 다양한 개선 모델 뿐만 아니라 이더리움 계정 접근성, 월렛 사용성, 유저 리서치, UI 디자인, ENS(Ethereum Name Service), 메커니즘 디자인, Gig Economy 등 매우 폭 넓었습니다.
그만큼 이더리움의 대중적 수용(Mass Adoption)에 있어 필수적인 사용자 경험 관련 내용들이 지속적으로 제안되고 보완되고 있는 것이겠죠 :)
DEVCON4 UX & Design Session Overview
이제 본격적으로 DEVCON4에서 언급된 UX 관련 내용을 살펴보면서 이더리움의 UX를 폭 넓게 다뤄보도록 하겠습니다. 뒷 순서에 배치되어 있을수록 조금 더 무겁고 인프라 레벨에 위치한 내용들이니, 필요한 내용들을 취사선택해서 읽고 가시는 것도 좋을 것 같습니다 :)
1. UI Design & User Research
2. Mesh Network (Gig Economy)
3. Wallet, ENS and Universal Login
4. Mechanism Design
5. Gas Abstraction
1. UI Design & User Research
첫번째 파트는 다소 가벼운 주제입니다! DEVCON4에서는 UI 디자인을 함에 있어서 필요한 철학이나 디자인 툴, 그리고 유저 리서치에 대한 내용이 종종 논의되었습니다.
창의적인 UI에 대해서 아이디에이션할 수 있는 시간은 별로 없었던 것 같고 그나마 독특했던 부분은 Aragon의 Lorikeet 정도였는데 이는 #3에서 소개하도록 하겠습니다 :)
UX 관련 내용도 마찬가지로 우리가 일반적으로 배우거나 익숙한 정량적인 UX 평가 기법들이나 전통적인 UX 교과과목에서 배우는 내용들보다는, 이더리움에 포커싱된 UX들도 몇 가지 있으니까요. 차근차근 알아보시기 바랍니다 !
#1. How To Design for Humans & Get Users Onboard (by Coinbase)
유저들이 블록체인에 뛰어들기 위해서는 각종 dApp이나 미들웨어 서비스의 UX가 ‘인간’을 위한 것이어야 합니다. 즉, 소수의 기술자들이나 컴퓨터만 이해할 수 있는거라면 이더리움은 대중과 함께 어울릴 수 없습니다.
저는 이 두 슬라이드가 유독 마음에 들었는데요. 다소 직관적인 내용이지만 블록체인이나 DAPP을 개발하고 있는 사람들이 가장 간과하고 있는 측면이 아닌가 하는 생각이 들었습니다.
첫째. 크립토라는 것은 대다수의 사람을 위한 것입니다. 제가 블록체인 생태계에서 답답하던 것도 Plasma, State Channel, ZKP 등등 너무 많은 기술적 논의나 ICO, STO 같은 온갖 비즈니스 이슈들 때문에 사용자들이 어떻게 편안함을 느낄 수 있게 할 것인지에 대한 고민이 너무 뒤쳐져 있었습니다.
많은 사람들의 삶을 변화시키고 대중에게 스며들 목적을 가진 기술이 블록체인이라면, 대중에게 어떻게 이 기술을 어필할 것인지를 유저 입장에서 고민하는 과정이 필요합니다. 이는 유저 페르소나, 유저 리서치 등 일반적인 유저와 맞닿아있는 상황에서 블록체인을 생각해보는 시도를 이끌어낼 수 있습니다 (관련 내용은 #2에서 다시 말씀드리겠습니다).
둘째. 우리 할머니가 비트코인을 쓸 수 있을까? 라는 질문입니다. 다소 과장된 지점은 있긴 하지만 암호화폐 또는 DAPP의 사용성과 접근성 측면에서 아주 중요한 내용이라고 봅니다.
실제로 DEVCON4에서 진행된 UX Awards 수상자인 Bounties Network의 CEO는 수상 소감을 말하며 “내가 UX를 고민함에 있어 많은 도움을 주셨던 우리 어머니에게 감사를 표한다”고 말하더군요 :)
DEVCON4 UX 세션 스피커들 중 대부분은 자신의 팀원이나 가족 등 가장 가까운 사람들부터 이해시키려고 노력하는 것이 UX의 첫 걸음이라는 점을 공통적으로 중요시했습니다.
#2. Guerilla User Research (by Quartz, Kevin Kim)
실제로 DAPP을 사용하는 사람들에 대한 리서치, 즉 유저 리서치에 대한 논의가 수면 위로 올라오기 시작했고 타국으로 리서치 트립을 가는 등 실제로 행동에 옮기는 팀이 많아지고 있었습니다. 11월 21일 어제 탈중앙화 메신저를 만드는 팀인 Status도 Nonce에서 UI/UX 관련 밋업을 열었구요.
Lots of interview needed for user research
소규모 회사일수록 Formal 하지 않고, 느슨한 조직 구조를 갖고 있으며 다소 비형식적인 유저 리서치를 진행하기에 좋은 환경을 갖고 있습니다. 이와 관련해서 지급 결제용(means-of-payment) 스테이블 토큰을 개발하는 Celo라는 회사가 진행한 유저 리서치 사례가 소개되었는데요.
Celo 역시 비교적 최근에 블록체인 프로젝트를 진행하고 있는 회사로서, 규모가 크지 않은 회사입니다. Celo의 직원들은 자신들의 토큰이 범용적으로 활용될 가능성이 높은 국가인 케냐에 가서 적극적인 유저 리서치를 행하는 모습을 보였습니다.
사실 발표를 듣고 있을 때는 왜 세션 제목이 Guerilla User Research인지 잘 알지 못했는데요.. 글을 쓰다 보니 제목의 의미를 좀 알겠네요. 아마도 지금 시점의 블록체인 회사들은 대부분 규모가 작은 회사일 것이고, 소규모 회사일수록 더 적극적이고 유동적으로 유저 리서치를 행할 수 있는 환경이라는 의미에서 이런 제목을 사용하지 않았나 싶네요 🤔
그러나, DAPP 사용자 자체가 적다 !
사실 이게 지금 시점에서 가장 안타까운 지점이기도 하고, 어찌 보면 당연하기도 한 부분인데요. 스피커였던 Kevin Kim은 Brayton Williams의 Medium 포스팅을 인용하면서, “실제로 DAPP을 사용하는 사람들이 많이 없다”는 점이 문제라는 것을 지적하기도 했습니다. 심지어 개발자들도 말이죠 !
실제로 DAPP을 사용하는 사람들이 많이 없으니, 어떤 유저 페르소나를 가져가야 하는지도 감이 잡히지 않을 것입니다. 표본이 절대적으로 적으니, 당연히 다양한 유저들이 어떤 경로로, 어떤 생각으로 DAPP을 사용하게 되는지 그 여정(User Journey)을 파악하거나 유저 리서치를 행하는 것조차 쉽지 않습니다.
이런 문제들과 관련해서, 세션의 발표자 Kevin Kim은 본인이 블록체인 DAPP 해커톤에 참여하면서 직접 느꼈던 UX 아이디어들을 Medium에 포스팅했더라구요 :) DAPP을 기획하면서 만날 수 있는 유저들의 케이스를 다양하게 나열하고, 이들에게 어떤 블록체인 경험을 제공할 수 있을 것인지 고민한 흔적이 잘 나와있습니다.
#3. Lorikeet and Decentralized Web (by Aragon)
이번 절에서는 이더리움 테스트넷에서 돌아가고 있는 Aragon의 웹사이트를 실제로 들어가서 이더리움 기반 웹이 뭔지, 분산형 웹이 어떤 구성요소가 포함되어 있는지 같이 확인해보려고 합니다. 시간이 없거나 긴 글 싫어하시는 분들을 위해 데브콘 풀영상 링크도 같이 첨부합니다 :)
일단, 다른 팀이 아니라 Aragon이 탈중앙화된 웹 서비스를 지원하는 툴을 만들었다고 하니 일단은 신뢰가 갔습니다. 이 팀은 애초부터 이더리움 블록체인을 통해 가능해지는 탈중앙화된 디지털 사회를 대비하고 DAO의 조직과 운영을 돕겠다는 식의 슬로건을 외치는 팀이었거든요. ICO를 할때에도 자본 세력(고래)을 막는 Hidden Cap을 제안하는 등 꽤나 합리적으로 진행했던 것으로 기억이 납니다.
아무튼 이번에 소개해드릴 세션은 Aragon의 UX를 소개하는 세션입니다. 사실 제가 디자인을 전업으로 하는 사람이 아니라서 그럴수도 있는데, UX가 막 크게 독특하다거나 하진 않았습니다. 아, 물론 다른 DAPP 보다는 훨씬 뛰어났습니다 😺
오히려 집중하기 시작했던 내용은 Lorikeet이라는 디자인 툴이었는데요. 탈중앙화 웹 구조의 디자인을 도와주는 소프트웨어 툴이라고 합니다.
일단 Github에서 Aragon의 design 레포에 들어가보면 Lorikeet에 대해 이렇게 소개하고 있습니다.
Lorikeet : Open Source Design System for decentralised apps, with design guidelines and production ready React components
Lorikeet의 디자인 컴포넌트는 대부분 Sketch를 통해서 만들어졌다고 하고, 보시는 바와 같이 UI 라이브러리는 React와 연동이 가능한 것으로 보입니다. 요즘 많은 디자이너들이 포토샵 대신 Sketch를 사용하고 있다는데, 저도 얼른 맥북을 최신 버전으로 업그레이드해서 이 툴을 좀 써봐야겠네요 🤔
사실 저는 발표를 들으면서 개인적으로 궁금했던게 “탈중앙화 웹”이라는건 알겠는데, 그 웹을 디자인하는 패턴이 도대체 뭐가 특별한게 있을까 싶었습니다. 어차피 버튼이나 팝업창, 알림(notification) 같은 디자인 컴포넌트들은 대부분 웹에서 동일하게 들어가는 요소들 아닌가 싶기도 했고요.
그래서 포스팅을 준비하면서 Aragon 웹사이트도 들어가보고 인터페이스도 좀 살펴봤는데요. 분산형 웹 구조에 특화된 디자인 툴이라는게 말씀드린대로 디자인 측면에서 독특한 것을 쓴다기보다는, 다음과 같이 블록체인에서만 의미있는 요소들을 이해하는게 중요해보였습니다.
i) 사용자의 계정 주소를 UI 상에 표현함에 있어서 identicon이나 이모지를 개인의 주소(EOA)와 서로 맵핑시키는 기능 및 디자인을 지원해준다거나
ii) DAO(Decentralized Autonomous Organization :탈중앙화 자율조직), TCR(토큰 큐레이션 모델)등 탈중앙화 어플리케이션 환경에서 중요하게 여겨지는 각종 기능을 구현할때의 UI 이슈가 있습니다.
Aragon 웹사이트로 Decentralized Web 체험해보기
그렇다면 이제 실제로 분산형 웹을 한 번 살펴보도록 할텐데요 ! 아래는 Rinkeby 테스트넷에서 돌아가고 있는 아라곤 웹 사이트입니다. Aragon은 Lorikeet을 통해서 자신들의 웹 사이트를 구축해나가려고 하는 것 같습니다. 스크린샷을 통해 UI들을 한 번 살펴봅시다 👊
사진에 설명을 달아놓았듯이, 이더리움 기반의 분산 애플리케이션을 사용하기 위해서는 자신의 계정 주소에 대한 접근이 꼭 필요합니다. 이더리움 블록체인 상에서 트랜잭션을 발생시키기 위해서는 내 계정(EOA)에 가스 수수료 이상의 ETH를 보유하고 있어야 하기 때문이죠.
UX에 신경을 쓰는 팀들 (Gnosis, Aragon, Status, etc)이라면 대부분 Metamask같은 월렛이나 Mist같은 이더리움 전용 브라우저와 연동을 시켜놓은 상태입니다. DAPP 팀이 월렛을 따로 만드는 경우도 있지만, 대부분 메타마스크처럼 범용성이 높고 개발 단계가 높은 월렛을 주로 사용하는 것 같습니다.
메인 화면을 살펴보니 Aragon의 웹은 현재 메인넷과는 연동되지 않은 상태인 것 같은데요. “Create a new organization”을 클릭하려고 하니, You need at least 0.1 ETH (you have 0 ETH). Request Ether on the Rinkeby Network.라고 되어 있죠?
앞서 말씀드린 것처럼 어떤 DAPP에서 트랜잭션을 날리려면, 즉 DAPP에서 필요한 어떤 액션을 취하려면 최소한 수수료를 낼 만큼의 ETH는 필요하니까 이런 문구가 써있는 것입니다. (Rinkeby 테스트넷 Faucet에서 가짜 ETH를 무료로 얻어올 수 있습니다. 저는 테스트넷에 ETH가 없어서 잔액이 0 ETH이구요 ㅠ)
위 페이지는 화면 상의 인터랙션을 프로토타이핑할 수 있도록 돕는 도구 invision으로 만든 가상의 UI 입니다.
프로토타입 이름은 DAO Switcher인데요. Aragon의 경우, 각기 다른 목적의 DAO를 여러개 만들어서 운영할 수 있도록 도와주는 플랫폼이기 때문에 여러개의 DAO를 전환(Switching)하는 UI가 필요하겠죠.
사실 개인적으로 이 화면이야말로 탈중앙화된 웹에서의 독특한 특징이라고 생각하는데요. DAO라는게 어찌보면 카카오톡 단톡방이나 DC인사이드의 갤러리처럼 커뮤니티의 일종으로 보일 수도 있지만, DAO는 기본적으로 블록체인 위의 스마트 컨트랙트에 의해 제 3자에 대한 신뢰가 필요없이 운영되는 조직이라야 의미가 있습니다.
그래서 DAO를 지향하는 서비스나 프로젝트 같은 경우, 무형의 디지털 자산인 토큰(ERC20 등)을 가지고 여러 의사결정에 직접 참여하는 투표 기능을 갖춘 경우가 많습니다. 위 UI에서도 투표율에 대한 시각화가 되어있는 것을 확인할 수 있네요.
어쨌든 Aragon은 DAO라는 개념을 중요하게 생각하고 이를 관리하는 플랫폼을 자처하고 있으니, 상기 그림처럼 DAO를 관리함에 있어 UI를 어떻게 디자인하느냐가 회사 입장에서는 꽤나 중요해보입니다.
DAO에 대한 좀 더 구체적인 설명은 여기에서 참고하세요 !
위 페이지 역시 invision으로 프로토타입을 해놓은 UI인데요. 이 부분은 Aragon 자체와 관련이 있는 UI라기보다는 블록체인의 트랜잭션 처리 절차와 관련있는 내용일 것입니다. Your transaction is being processed라고 표현되어 있죠? 보통 특정 시점에서 한 개의 블록 안에 많은 트랜잭션이 처리되지 못할 때, 트랜잭션이 펜딩(pending)되고 있다고 이야기를 많이 합니다.
위 화면은 이런 펜딩 상황에서 UI를 보여주는 것이고, Aragon은 펜딩이 발생하고 있을 경우 알림창을 활용해서 유저들에게 펜딩 여부를 인지시켜주려고 하는 것 같네요 !
이 밖에도 토큰 거버넌스의 핵심으로 여겨지고 있는 TCR(Token Curated Registry) 모델을 웹에서는 어떤 UI로 표시할 것인지, 이더리움에서 처음 주소를 생성할 때 나오는 랜덤 시드 구문들(비밀키)의 관리를 어떻게 도울 것인지 등 재밌는 UI 이슈들이 여러 DAPP 프로젝트에서 등장하고 있습니다 🤓
Aragon의 UI와 관련된 자세한 내용은 Github 디자인 레포에서 확인해보세요 !
Conclusion
얼마 전 저희 어머니가 저에게 이런 말씀을 건네셨습니다.
“상범아, 블록체인으로 돈 잃은 애들도 되게 많다던데? ”
네, 그렇습니다. 우리는 일상에서 블록체인을 이야기할 때 주로 돈 잃은 애들이나 비트코인 을 제외하면 대중과의 접점을 찾기 매우 힘듭니다. 조금 더 나아가면 “떡상, 존버, 가즈아” 이런 내용들까지도 가능하겠네요. 사실 정작 리서치를 하는 저는 투자랑 관련된 얘기를 거의 접해본 적이 없는데 말이죠..
솔직히 좀 답답하긴 합니다. UX의 가장 큰 지도자가 되어주실 수 있는 어머니나 가족, 우리의 친구들의 반응은 아직 블록체인이란 그저 투기를 가능하게 하는 IT 기술에 불과하니까요.
그러나 Status, Gnosis, Aragon 등 일찌감치 이더리움 위에 올라타 열심히 일하고 있는 DAPP팀들은 당연하게도 UX를 깊이있게 고민하고 있습니다. 향후 몇년 동안은 이런 팀들에 의해 UX 리서치가 주도될 것으로 판단하고요. 우리나라 UI/UX 디자이너들의 수준이 높기 때문에, 이더리움 UX 측면에서 우리나라도 충분히 경쟁력이 높다고 봅니다.
제가 최근에 읽은 아티클 가운데 기억나는 문장 하나를 남기며 본문을 마치도록 하겠습니다.
I don’t think people really “need” the technology, but I am sure people need technology outcomes.
UX를 고민하는 사람들이라면, 기술 그 자체의 혁신성과 구조에 집중하기 보다는 “기술의 결과”가 무엇인지 알아채고 이를 극대화시키는 것이 사용자들의 만족을 높일 수 있을 것입니다.
Blockchain UX Lab
이 웹사이트는 제가 최근에 오픈한 페이스북 페이지인데요. 기존 웹/앱 환경에서의 UX에 관심이 많기도 했고, 블록체인이 UX 측면에서 해결되어야 할 문제들이 정말 많아서 블록체인, DAPP, 미들웨어와 관련된 UI/UX 이슈들을 국내에도 종종 공유해 볼 생각입니다.
국내에 우수한 UI & UX 디자이너, 개발자, 블록체인 프로덕트 담당자 분들과 함께 블록체인(특히 이더리움)의 사용자 경험을 좀 더 다양한 관점에서 살펴보고 싶습니다 :) 이번 리뷰 시리즈에서 다루지 못한 내용들은 이 페이지에도 종종 공유할 생각이니까 관심있는 분들은 많이 구경와주세요 !
끝으로, 2018년 현재까지 출시된 DAPP의 소비자 경험에 대해서 재밌게 설명해주는 비디오가 있어 공유하면서 글을 맺습니다. 다음에는 Mesh Network와 Gig Economy 환경에서의 UX를 다루도록 하겠습니다 😀
How Dapps Work in 2018 ?
참고로, 현재까지 나와있는 DAPP은 아래 사이트에서 확인할 수 있습니다.
재밌고 유익하게 읽으셨다면 1 Clap 👏
이 글이 더 많은 사람들에게 공유되길 원하신다면 50 Clap 👏
혹시 본문에 대한 질문이나 좀 더 필요한 내용, 또는 포스팅에 존재하는 오류에 대해서 질의가 필요하신 분들은 danny.h@onther.io 로 언제든지 연락주세요 :)
