30 Days of Code — Day 9
Simple TTRPG Dice Roller
Today I wanted to optimize some aspects of the app to make it a bit more user friendly. One of the things I added to the Figma board was “Default quick select options”, so I’ve been working on implementing something like that, but the day quickly got away from me. Instead, I’m going to write about my thought process and how the messiness of it leads to feeling overwhelmed and giving up.
This part has been a challenge, but not for any technical reason. I don’t consider myself to be very creative, and my ability to design UI is not great. I’ve been struggling to implement this in a way that is both visually appealing and easy to use/understand.
I’m actually not finished with it yet, but I wanted to walk through what I’ve been working on because I was worried I’d run out of time and miss posting for today.
Predefined Rolls
One option I’m exploring is predefined rolls. Basically just a collection of common dice rolls that users can roll with just a single click/tap.
The hope would then be that these could be customizable when I have user profiles in place, and instead of being static values chosen by me, they will be whatever the user finds most helpful.
Visually I don’t love it. Right now I’m using Ionic Chips which is probably not the best option, but even if I make a custom component I’m just not sure that I like this row of buttons. The other option I’m considering for these predefined rolls is hiding them behind a Floating Action Button.
This seems much cleaner to me, but I need to research its impact on accessibility and the usability with trackpad/mouse given it’s more of a mobile UI component.
Variable Numbers of Dice
Another option I’m considering is creating a list of dice types and letting the user add the number of them they want.
I absolutely hate the amount of space this requires, and it limits the dice types to ones I determine rather than allowing the user to roll whatever they want, but I do like some aspects of this design and I can see myself using this component for something in the future. Probably just not this.
Looking Forward
There is a lot to do here, and I think I was initially off to a good start with the planning I put in to the MVP. What I really need is a strong reset and to create a similar plan for this next phase complete with features and a completed design for the UI. If I try to complete this project the same way I always do, I will get overwhelmed and give up. I know this to be true. After today I can already feel it happening.
But I’m not going to let it. I’m enjoying this project, and I think it will be really cool to finish it and have a real working tool that I can use for my D&D sessions and maybe even something that other people find useful.
So, I am not going to give up or let myself become overwhelmed. Tomorrow I will sit down and create a list of all of the remaining features I want this to have. Then I will put them into the chart in Figma in the appropriate places.
With that completed I need to start learning some of the fundamentals of UI/UX. I obviously am not going to become an expert on it in 20 days, but hopefully I will at least be able to find good resources that I can use for continuing my education.
With that said, I would love your feedback on ways that I can improve in these areas. What learning resources are your favorites? Who inspires you to create? Let me know down below. Thank you again for reading!
