오늘 소개할 서비스는 ‘웹 3.0(Web 3.0)’ 서비스 화면 사례를 살펴볼 수 있는 곳입니다. 일반 서비스와 구조가 다르며, 실제 마주하는 화면 역시 기존 서비스와 다르기에 직접 찾아보며 경험하지 않는 이상 파악이 어려울 수 있는데요. 이런 어려움을 해결하고자 제작된 곳으로, 서비스 화면과 흐름에 따라 특정 ‘웹 3.0(Web 3.0)’ 서비스 구조 및 사용자가 실제 보고 경험하게 되는 사례를 확인할 수 있습니다. 이 글을 작성하는 날을 기준으로 1,149개의 화면 사례가 등록되어 있기도 하고요. (다만, 일정 개수까지 무료로 확인할 수 있으며 전체를 확인하기 위해서는 결제를 해야한다는 점 참고해주세요)

기본 화면의 모습입니다. 기본 화면은 ‘서비스’를 기준으로 리스트를 살펴볼 수 있는데요. 왼쪽으로 서비스 타입과 포함된 블록체인 기술 등에 따라 필터를 적용할 수 있습니다. 리스트는 서비스 로고, 서비스명, 간략한 소개와 대표 이미지 4개를 포함하고 있습니다.

리스트를 통해 원하는 서비스를 선택하면 해당 서비스의 화면 사례만 모아볼 수 있는 화면으로 이동할 수 있습니다. 상세 화면에는 서비스에서 특정 기능을 사용하는 일련의 과정(Flow)에 따라 화면 사례를 볼 수도 있고, 화면 단위로 (인터페이스에 따른) 사례를 보는 것도 가능합니다. 화면만 서비스에 따라 모아두는 것도 사실 쉽지 않은데, 플로우 단위로 살펴볼 수 있어 더 유용하게 느껴지네요.

화면 단위의 사례 리스트입니다. 앞서 본 리스트는 ‘플로우’에 따라 리스트가 구성되어 필터 역시 ‘플레이 리스트에 담기’ 등의 행동에 초점이 맞춰져 있었는데, 화면 단위에서는 체크박스, 모달, 리스트, 드롭다운 등 인터페이스 단위에 초점이 맞춰진 모습입니다. 기능에 대한 사례를 보고 싶다면 플로우를, 인터페이스 단위로 확인하고 싶다면 스크린을 선택해 확인할 수 있습니다.

일정 기능을 사용하는 과정에 따라 사례를 살펴볼 수 있는 화면입니다. 몇 단계로 구성된 사례인지 상단 프로그레스 바를 통해 알 수 있으며, 왼쪽 상단에 현재 보고 있는 사례가 어떤 기능에 해당하는지 타이틀 형식으로 제공됩니다. 위 이미지는 사용자가 플레이리스트에 음원을 추가하는 과정으로 각 단계에 따라 화면이 어떻게 변경되는지 등을 자세히 확인할 수 있습니다.

뉴스레터를 신청하면 새로 등록되는 사례를 빠르게 메일로 확인할 수 있으며, 서비스 내 기본적인 검색 기능을 제공해 원하는 사례를 서비스명, 기능, 인터페이스 단위로 찾아볼 수 있습니다. 다만, 처음에 작성한 것처럼 모든 사례를 무료로 볼 수 있는 것은 아니며 월 17달러의 금액을 지불해야 확인할 수 있습니다. 이 정도 규모의 사례를 직접 저장하고 분류하기 위한 노력의 대가로 생각해야 하지 않을까 싶네요. 뉴스레터와 무료로 확인 가능한 사례를 먼저 살펴본 뒤, 결제 등을 고려해도 충분하다고 생각합니다. 더 자세한 내용은 ‘링크’를 참고해 주세요!