![](https://pro2-bar-s3-cdn-cf5.myportfolio.com/64e0acb4-359d-455e-9699-b8c2950ca039/6ea4902f-3569-4725-9e55-1ddbb062ac9e_rw_600.jpg?h=17f4d35aea971ca37569474265e5b5f3)
Dragon Story persistent leaderboard is a recurring time based challenge between bucketed groups of players:
• There are 6 Leagues within the Leaderboard feature which players can advance through to earn better prizes
• Each Leaderboard challenge lasts 5 days, with a 2 day break in between
• Players earn points by completing tasks within set time limits and reaching a Bingo
• Each Leaderboard challenge lasts 5 days, with a 2 day break in between
• Players earn points by completing tasks within set time limits and reaching a Bingo
Sketch
![](https://pro2-bar-s3-cdn-cf6.myportfolio.com/64e0acb4-359d-455e-9699-b8c2950ca039/7a523252-73d0-4c17-9004-1c25275b1357_rw_1920.png?h=8bcd61ce9eb6103eb2cd08e35dcc37d7)
Wireframes
Base on the product goal I was designing the user experience of the gameplay especially focus on the interaction:
• UI Surfacing: A default HUD button and new on-board building
• Earning Points from Challenges
• Leaderboard Structure
• Earning Points from Challenges
• Leaderboard Structure
![](https://pro2-bar-s3-cdn-cf3.myportfolio.com/64e0acb4-359d-455e-9699-b8c2950ca039/e5d891a2-00bb-41b3-b61a-156501f0b339_rw_1920.png?h=a3342d0569db5150334ffc6902a3cb49)
Visual design
Because there's a lot information on the main screen, I was organizing content to follow natural eye movement Z pattern. Users will know the challenge description and review their current bingo board then they can choose using boost to speedup. I chose purple as the primary color to show the contrast between UI elements and dragon leaf decor.
![](https://pro2-bar-s3-cdn-cf3.myportfolio.com/64e0acb4-359d-455e-9699-b8c2950ca039/ea566f39-72d6-4bcb-9765-ae8086831160_rw_1920.png?h=ab91946d7d40d3e989ce4076780c8952)
Iconography
![](https://pro2-bar-s3-cdn-cf2.myportfolio.com/64e0acb4-359d-455e-9699-b8c2950ca039/d26e1a6b-350b-4b2d-9a44-d8785b7ba578_rw_1920.png?h=ca22838c34e005cc12a5b8007ea6f7f3)