T&T | table top tables
PROBLEM
In the game Dungeons and Dragons, many game leaders, aka "dungeon masters", enjoy making their own information tables to sort and organize events, interactions, names, creatures, etc, and reveal the result based on dice rolls. 
For example, if the leader was trying to decide what type of monster the group will encounter, ahead of time they could have made a table with 20 different monsters, each one corresponding to a number. They then will roll a d20 and if it lands on an 8, then the monster corresponding to an 8 will be the result.  
Making these tables and storing them can be a lot of slow work.
SOLUTION
Create an app, T&T, to create, organize, and edit tables. In addition to this, easily roll dice to generate a random number and reveal the corresponding table result.
Duration: In Progress
Role: Software Engineer & UI Design
Client: Gift
Tools: Figma, React Native, Adobe Illustrator
Current Status: Modernizing  the "Roll the Die" and "My Table" flow by creating my own dice icons using Adobe Illustrator and redesigning the UI on Figma.
Process
This project is a gift and a personal project of mine, so the design process was streamlined, but I still included many important aspects.
research
How can we make it easier for people to plan their D&D games? 
There are many apps for d&d, so I wanted to make sure I could create something different. I asked players of d&d what was missing from the existing apps. Those who were also "dungeon masters" explained the problem of tables to me and how difficult it could be to keep track of them and how long it could take each roll to search for the result.
In light of this, I concluded that a way to create, edit, and roll the table would be the most helpful.
Sketches
I made a few rough sketches of what I envisioned for the design of adding a table, rolling the die, and editing the table.
past designs
I have gone through multiple color schemes and designs. With each iteration I aim for a simpler, more modern design, including changing from a dark theme to a light theme.
Color Scheme
past SCREENS
home screen
home screen
roll the die
roll the die
edit the table
edit the table
confirm the table
confirm the table
create a new table
create a new table
create a new table
create a new table
add each result
add each result
confirm the table
confirm the table
Future plans
I plan on continuing to refine my design, then code in React Native to finish my project. I will then do user tests and make any adjustments to my design necessary.​​​​​​​

You may also like

Back to Top