4편 화면 기획하기
안녕하세요. 오늘은 투표 화면을 만든것을 보여드리려 합니다.
3편에서 시나리오 기획한대로 화면을 만들어 보았습니다.
먼저 지난번에 보여드린 유저플로우를 기반으로 화면을 만들어 봤습니다.
1. 이메일인증
처음 g.ekku.edu 로 끝나는 이메일을 적은 후 인증하기 버튼을 통해 이메일 인증을 완료하고, 지갑생성페이지로 넘어갑니다.(이부분은 구현하지 않고 화면상으로만 남겨두겠습니다.)
2. 지갑생성 & Vault 서비스 이용하기
먼저 해당화면은 생성하기, Vault 서비스 이용하기, 투표하러 가기 버튼을 이루어져 있습니다.
이메일 인증이 완료된 후 지갑생성하기 버튼을 클릭해 지갑을 생성합니다.
지갑 주소와 PK를 화면에 띄워줍니다. 또한 생성됐다는 메시지를 보여줍니다
Vault 버튼을 클릭하면 저장됐다는 메시지를 띄워줍니다.
Vault에 안전하게 저장이 된 다음 투표하러가기 버튼을 클릭하면 투표 페이지로 이동합니다.
3. 투표하기
두명의 후보중 한명을 선택해 투표하기 버튼을 클릭합니다.
투표하기가 완료되면 완료됐다는 메시지를 띄워줍니다. 또한 10코인이 지급됐다는 메시지를 보내고 마이페이지로 이동합니다. 코인은 교내에서 현금처럼 사용될 수 있는 역할을 합니다.
4. 마이페이지
마지막으로 마이 페이지에서는 지갑잔액을 표시해주고, 투표 트랜잭션 로그를 보여줍니다.
이로써 화면기획까지 마무리를 했습니다. 다음편 부터 Smart contract 생성과 Luniverse API를 활용해 필요한 기능들을 완성시키는 글이 연재될 예정입니다.
감사합니다.
"위 게시물은 람다256의 루니버스 Dev plan을 무료로 제공받아 작성하였습니다.”
김현명(hyunmyung137@gmail.com)