Duration
6 Weeks
2018
Role
Project Mangement
Design Research
User Research
Prototyping
UI/UX Design
Collaborators
Tanvi Chhabra
Tools
Adobe XD
Adobe Illustrator
Adobe InDesign

Replanning and restructuring data on a website

RPG Table Finder

The project.

The Challenge

I established clear, tangible design objectives informed by insights uncovered through the research phase. These design objectives are further broken down into design requirements– labelled as data, quality, usability, and functional requirements

The Outcome―

RPG Table Finder aims to help people fond, create, or join groups of people playing table top role playing campaigns either in their geographic area, or online groups scattered across the world. In 2019, the website was a busy website with a lots of icons, even more text, and not a lot of styling – nothing differentiating links from body text, basic button styling, and data hierarchy that made the experience tedious to use.

This project restructured and redesigned RPG Table Finder, while also building upon the original website's offerings with features inspired by similar websites .

How we did it.

Project Timeline

This project was done solo where I covered project management, design research, user research, prototyping, UI/UX Design. Additionally, the project was spread over the course of six weeks while handling other projects.

Project Objectives

I established clear, tangible design objectives informed by insights uncovered through the research phase. These design objectives are further broken down into design requirements– labelled as data, quality, usability, and functional requirements

Laying down rules

Who we spoke to.

Users + Demographic

Tabletop roleplaying games have a very broad target audience, there's great diversity in the demographics of the user base. Since RPG Table Finder is geared towards everyone who plays tabletop roleplaying games, the websites target users are also a very a broad spectrum, but the user base that would look for groups to play with online tend to skew more towards young adults versus the older crowds who are more comfortable with the old school methods, and tend to have established groups already.

So for this project I looked at young adults as the target user group, all user research and testing was done amongst people in the 18-30 year old age range with no limitation to other demographic data such as their background or gender.

The insight we gained.

Testing

For the test I created a list of the 5 most important tasks for users to perform on the website, then asked participants to perform the task one by one and asked them to rate the task on a 5 point scale. While they completed the tasks, I kept track of all the errors that the users faced when completing the tasks, and how long it took them to complete each task.

Tanvi key decision

The tasks were created to cover most of the features of the website, some of the tasks would be on how they interacted with posts by other users and some that covered users interacting with their own posted data. These were all important tasks vital to the purpose of the website.

All users were also brand new users and had no experience with the website prior to this, they were also not well versed in the tabletop roleplaying scene but had a basic interest and understanding of what they were looking for.

Along with the individual task rating per user, the amount of time taken to complete each task was also timed to get an idea of how much effort was taken by the user to complete a task. A general post test questionnaire was also done after the individual test.

Tanvi key decision

The post test questionnaire was added on to give me an idea of the more general ease of use of the website. The first set would give me specific feedback on exact things users had issues with. The post-test help me get the bigger picture on general areas of issues that I might or might not have considered a problem.

The pain points ―

The website’s entire design is basically white icons and text on a dark grey background. Other than the hero image on the front page there are no other images in use on the website. Since all the text is white and is the same font, there is no way of knowing what is a link and what is just body text.

There is also an excessive use of icons, which is okay in some places but clutters the page in other sections, like the group listing.

Dealing with the data

Navigation Information Sorting

A major part of sorting through the data present on the website, was using card sorting with the various pages. Using both physical card sorting and digital card sorting I had a better idea of what navigation system worked better for people by allowing users to come up with various ways of sorting and grouping titles and subtitles. Coming up with user flows for some of the most essential goals of the website also helped in understanding the best way to go about planning the structure of the website.

Tanvi key decision

The card sorting used section titles and page titles. Not all the sections that were on the original websites were there in the card sorting, some I did away with because while testing we noticed there were overlaps

Navigating the way through

Content Chunks ―

Based on the card sorting I created new content chunks and re-organised all the data that existed on the original website, omitting duplicate content, and cleaning up the overall look of the pages.

Looking at this visually

Rethinking the visual
For the final few days of this project, I created mockups and an AdobeXD prototype based on the wireframes I had created earlier. A lot of the visual style was informed by other gaming and role playing game communities, the biggest influence being Dungeons and Dragons books, which are by far the most well known books in connection to table top RPGs.

This was tested with a small people that fell in the targeted demographic of this platform. I did go back and edit some of the group sections since I would try to keep certain aspects of the old website that I could use as a base, also certain options like filters that people within the community were deemed vital by users.

Looking back

This project was a pretty major part of my development as a UX designer. I was in my sophomore year during the duration of this project, and admittedly, I had a short-sighted view of what designing products and experiences truly meant. I was stubborn in my belief that having pretty looking interfaces was what mattered the most.

Working on this project opened my eyes into the process that a product goes through, even before the first sketches are drawn on paper, and to truly understand the importance of each phase of the design process – but especially the intricacies of managing and chunking data throughout products.