← 돌아가기NAODA UI Design
로그인이메일과 비밀번호를 위에, 구글과 애플을 아래에 뒀다. 어두운 바닥에 채운 버튼은 하나뿐이라 다음 걸음이 어디인지 헷갈리지 않는다.
Login
다른 서비스로 들어가는 로그인NAODA 계정으로 남의 앱에 들어가는 자리다. 앱 아이콘과 이름을 제목에 세우고, 아직 확인되지 않은 앱이면 입력 칸보다 먼저 그 사실을 알린다.
Login App
로그인 실패틀린 곳과 일어난 일을 갈라 적었다. 형식이 어긋난 것은 그 칸 아래에, 로그인이 거절된 것은 오른쪽 위 알림에 둔다.
Login Error
가입비밀번호 규칙을 치기 전에 카드로 먼저 보여준다. 이메일·비밀번호·확인·추천 코드·약관 동의를 한 화면에 세로로 세웠다.
Sign
정보 제공 동의무엇이 넘어가는지를 문장으로 적는다 - 로그인 정보는 넘기지 않고 숫자 식별자만 넘어가며, 그 앱은 그것으로 계정을 알아본다.
Oauth Consent
가입 입력 오류 세 벌이메일 형식·비밀번호 규칙·확인 불일치를 한 프레임에 나란히 뒀다. 세 경우 모두 틀린 칸만 붉게 두르고 나머지는 건드리지 않는다.
Sign Error
메일 코드 확인여섯 칸과 5분 타이머를 나란히 두고, 코드가 안 맞으면 칸 아래에 적는다. 이름은 확인 화면이지만 그려진 것은 틀린 상태다.
Verify
소셜로 들어온 가입 마무리구글·애플로 들어오면 이메일은 이미 확인된 상태라 추천 코드와 약관만 남는다. 남는 것만 남기고 나머지 칸을 지웠다.
Oauth Terms
가입 완료끝났다는 말과 버튼 하나만 남긴다. 축하 그림을 붙이지 않고 다음 자리로 보내는 데만 쓴다.
Welcome
탈퇴 요청 철회삭제를 신청한 계정으로 다시 들어오면 신청 날짜부터 보여준다. 15일 안에는 되돌릴 수 있고 그 뒤에는 못 되돌린다는 것을 버튼 아래에 적었다.
Cancel Unsubscription1
철회 코드 확인되돌리는 것도 메일 코드를 받는다. 다섯 번 틀리면 코드를 다시 받아야 한다는 것을 시도 횟수와 함께 적는다.
Cancel Unsubscription2
철회 완료계정이 살아났다는 말과 서비스로 돌아가는 버튼 하나. 앞의 완료 화면과 같은 뼈대를 쓴다.
Cancel Unsubscription3
비밀번호 재설정 - 메일 주소가입한 주소를 받아 코드를 보낸다. 형식이 틀리면 보내기 전에 칸 아래에서 걸러 헛되이 기다리는 일을 만들지 않는다.
Reset Password1
재설정 코드가입 확인과 같은 여섯 칸을 쓴다. 다섯 번 틀리면 코드를 새로 받아야 하고, 그 횟수를 세어 보여준다.
Reset Password2
새 비밀번호규칙을 카드가 아니라 제목 아래 문장으로 놓았다. 새로 치는 칸과 확인하는 칸만 남기고, 안 맞으면 두 번째 칸을 두른다.
Reset Password3
재설정 완료끝났다는 한 줄과 로그인으로 가는 버튼. 새 비밀번호로 바로 들어가라고 로그인 자리로만 보낸다.
Reset Password4
설정 - 계정커버와 아바타를 맨 위에 두고 표시 이름·소개·이메일을 잇는다. 연결한 앱 관리와 비밀번호 변경은 각각 버튼으로 빼고, 계정 삭제는 맨 아래 회색 링크로 내렸다.
Setting Account
연결한 앱 관리NAODA 계정으로 들어간 앱을 한 줄씩 세우고 각 줄을 펼쳐 권한을 본다. 계정을 준 자리와 거두는 자리를 같은 목록에 둔 셈이다.
Oauth Manage
자주 묻는 질문묶음 넷을 카드로 세우고 고른 것만 희게 뒤집는다. 아래 아코디언은 한 번에 하나만 펴지고, 펴진 줄만 × 를 갖는다. 본문은 아직 더미다.
Faq
소개 페이지로고 오브젝트를 건 히어로, 무엇을 하는 곳인지 세 줄로 나눈 구간, 그리고 보도자료 격자까지 한 프레임에 이어 붙였다. 밝기를 바꿔 구간을 가른다.
About
개인정보 처리방침조항 본문 아래에 수집 항목 표를 붙였다. 쓰는 목적·받는 항목·근거를 한 줄로 맞춰, 문장으로 흩어 두면 안 읽히는 것을 표로 세운다.
Policy
계정 패널 - 지갑 연결 전홈 위로 오른쪽 패널을 덮는다. 지갑이 없으면 연결 버튼이 그 자리를 차지하고, 아주 긴 이름은 말줄임으로 자른다.
Profile1
계정 패널 - 지갑 연결 후같은 패널에서 버튼 자리가 주소 칩으로 바뀐다. 주소는 앞뒤만 남겨 줄이고 복사와 연결 해제를 그 옆에 붙였다.
Profile2
지원하지 않는 브라우저권하는 쪽을 채운 버튼으로, 그래도 들어가는 쪽을 그 아래에 뒀다. 막지는 않고 무엇을 권하는지만 분명히 한다.
Unsupported Browser
쿠키 · 개인정보 설정아래 띠에서 「더 보기」로 들어오면 이 창이 열린다. 항목별로 켜고 끄되 필수는 잠근 채 두고, 저장·거부·전체 허용을 나란히 세웠다.
Cookies
지갑 고르기지갑 셋을 줄로 세우고, 특정 게임의 보상을 받으려면 어느 지갑이어야 하는지를 목록 아래에 따로 적었다. 고르기 전에 알아야 하는 조건이라 목록 밖으로 뺐다.
Connect Wallet
지갑 연결 전 경고 - 두 상태읽었다는 체크가 없으면 확인 버튼이 죽어 있고, 체크하면 살아난다. 한 프레임에 두 상태를 나란히 그려 무엇이 버튼을 여는지 보이게 했다.
Connect Wallet Warning
홈 전체게임 히어로 캐러셀로 열고, 로드맵을 분기별 타임라인으로 세우고, 파트너 로고와 커뮤니티 배너로 닫는다. 히어로만 그림이고 나머지는 글자와 선으로 끌고 간다.
Home
설정 - 계정 편집 중커버와 아바타 위에 교체 아이콘이 얹히고 표시 이름 칸이 열린다. 이미 쓰는 이름이면 저장 버튼 옆이 아니라 칸 바로 아래에서 걸린다.
Setting Account Edit
설정 - 지갑연결한 주소는 지갑 아이콘·체인 표시·복사·해제를 한 줄에 담고, 그 아래 빈 칸을 하나 더 열어 두 번째 지갑을 붙일 자리를 보여준다.
Setting Wallet
설정 - 소셜 연결연결한 것은 계정 이름을 달고 테두리 버튼으로 끊게, 안 한 것은 「연결」을 채운 버튼으로 둔다. 버튼 모양만 봐도 어느 줄이 이어져 있는지 안다.
Setting Social
설정 - 추천왼쪽은 내보내는 것(코드와 초대 링크, 각각 복사), 오른쪽은 들어온 것(가입자와 가입 시각)이다. 주는 쪽과 받는 쪽을 좌우로 갈랐다.
Setting Referral
설정 - 프로모션탭이 하나 더 붙고 화면에는 코드 칸과 등록 버튼만 남는다. 결과를 보여줄 목록이 아직 없어 빈 채로 둔 자리다.
Setting Coupon
설정 - 획득 이력무엇을·어떤 POP·어느 트랜잭션·언제를 한 표로 세우고 해시만 링크로 뺐다. 파일 이름이 「이후 스펙」이라 적힌, 나중 단계로 미뤄 둔 화면이다.
Setting History 이후스펙
계정 삭제 요청무엇을 잃는지·되돌릴 수 있는 기간·같은 메일과 지갑을 다시 못 쓴다는 것을 세 묶음으로 적고, 읽었다는 체크 뒤에야 확인을 누르게 했다.
Unsubscription
삭제 요청 접수접수됐다는 말과 함께 15일 안에 다시 로그인하면 되돌릴 수 있다는 것을 카드로 남긴다. 나가는 화면에서 돌아올 길을 마지막으로 한 번 더 적는다.
Unsubscription2
비밀번호 변경왼쪽에 캐릭터 띠를 세우고 오른쪽에 폼을 붙인 두 칸 짜임이다. 새 비밀번호는 쓰던 것과 달라야 한다는 조건을 제목 아래에 먼저 적었다.
Change Password
비밀번호 변경 완료같은 두 칸 짜임을 유지한 채 폼만 걷어냈다. 설정으로 돌아가는 버튼 하나만 남는다.
Change Password2
100%