My Role: UX/UI Designer
Tools: Figma, Webflow, Github
Duration: 2 Years
I was brought on by Tournament Kings to better understand our users in a team effort to document, and improve our discord bots and web resources.
The goal of this research was to better understand what are users needed and what their pain points were. I worked closely with our Support team to access our communities and user information. Whenever I found an issue that came up multiples times, I would chat with the community on possible solutions and bring all of my information to development. From there we would decide what we could accomplish and in what timeline.
Hung out in our servers and watched our Tourney Bot users in action with the bot
Reached out to our regular tournament players to get their feelings on the bot
Reviewed the support tickets coming in to find a trend with common issues
Created google forms with incentives to collect hard data on our user base
From all of our research we found most of our users were males between the ages of 13-17. After gathering more information on that demographic it was obvious we needed less barrier to entry with quicker user flows for shorter attention spans. To accomplish this I worked on decreasing the amount of commands needed for each feature and adding in more UI (button clicks) over typing in a command (the old school way of using bots)
With this information I created Personas for our users. This was for all of us to keep in mind who our audience is and who we are designing for. The surveys got the statistics that were needed, while the interviews and support tickets covered the more personalized issues that needed to be resolved.
Support Bot is the bot we created to help our users create their own support system within their guilds. This bot was taking the bones of our current Tournament Support bot (Gus) and creating something we could sell.
Creating user stories was the best way to analyze each users process from using the bot start to finish. Doing this helped identify pain points and highlight features that were creating too much of a barrier to entry.
After the UX/UI improvements were implemented I was tasked with the larger project of creating a wiki on github to document and guide users through every command for Tourney bot, and our other eventual bots.
From my research I started laying out the information architecture for our wiki. I kept in mind the users that are new to discord while also having all of the information for our frequent Tournament Admins. I felt the basic info needed to be in your face but with easy access to our more complicated features.
Our main page needed to highlight our biggest features, for quick access to what you need help with.
Once I completed the wiki it was time to update our website. To attract our users to our new wiki pages I created a “Learn the Bot” tab for our top bar, along with several “Learn more” buttons throughout our site. Having the wiki not only centralized all of our information but made it much more accessible to our staff and our users. This increased the use of our bot and also took some weight off of our support teams’ shoulders.
Next I created a page for all our paying customers to advertise their server and get new players to join. I did this by adding a “Tournaments” tab to our top bar so that anyone who visits the site looking to join a tournament would be brought right to a list of all of our affiliates. Each affiliate was able to submit their logo, card background, tags, and guild description with a clickable link to send game seekers straight into their guild. This attracted new users trying to find a place to game.
Using the feedback I received from users and customer support I was always looking for way to simplify our user flows and build up our UI. This type of work included..
Now that all of our guides were in one centralized place (the wiki), I restructured each bots help menu with a similar outline and “Getting Started” link with other clickable links, guiding you right to the most common features.
Having reactions on our games made it very confusing to the eye to line up which reaction went with which space. (There was counting involved yuck) To alleviate this we created buttons for each space. Now this looks a lot more like tick tac toe.
Knowing how to access the main menu on a bot isn’t always clear. The menu its self made sense but I felt we could do better with less reading and in turn a faster support turn around. Instead of you having to use the help command and then the menu, there would be an embed with button to immediately open a ticket.
Having reactions on our games made it very confusing to the eye to line up which reaction went with which space. (There was counting involved yuck) To alleviate this we created buttons for each space. Now this looks a lot more like tick tac toe.
MVP Features
Login
Profile Editing
Plan Selection
Wallet Creation
Account Activity
The next larger project I worked on was a rebranding package. As we developed more bots we were leaning toward more of a discord tool company, than just Tourney bot. For the rebrand I did more research on who our new users would be. Then I chose the color palette, the typography, and the UI elements. To get to the final mock up, I presented wireframe options, ui options, and then a final mock up from all of the feedback.