Today I began working on the dashboard for my app. I hadnt designed this prior but as I began using the app I realised this would really help the user with wayfinding.

For my first draft, I pulled in items from other pages. I found that they were using a couple different design patterns and thus, didn't match up as well as I'd hoped.

After re-aligning and spacing everything out a little better I had a more cohesive dashboard but I thought this still lacked consistency.

I tried making Saam's health bars match the height of the ticket list. Unfortunately this meant I had to strip back the titles. I considered putting these in place of the percentages but I knew this would cause issues when the bars drop below 20%. Without the titles, this component would make no sense to the user.

I googled around for inspiration and came across the above screenshot. I thought a game like dashboard might do the trick so I researched some similar design patterns using https://www.gameuidatabase.com/

I jumped into Figma and began wireframing what this dashboard might look like. I considered building a leaderboard component earlier in the wireframing process to further add gamification, but couldn't quite find a place for it. I think when a user lands on the a page which shows high scores across the app, they will be encouraged to beat these and jump straight into reading!