Board Games at Distance!
Play your favorite games with your friends & family!
This was a design project which my team and I designed over the course of a human-computer interaction course. Here we went through all of the iterations of the iteration design cycle (Don Norman) in order to identify and deliver a fun solution for our end-users, those who were board game lovers that unfortunately are unable to play their favorite board games with their friends and family due to the pandemic.
Problem 🤔
Frequent board game players need a platform to connect on in order to exclusively play their favorite games with their favorite people. One specific area which our competitors don’t offer completely, is the ability to communicate with voice responses. This was an issue which we discovered and implemented a solution for.
Goal 🎯
Design a website where common board game lovers can actively socialize and play with others using primary and secondary research.
Product 💻
Board Games At Distance is a website that gives its users the ability to play their favorite board games with the people they love. Due to the pandemic, it is difficult for people to communicate with each other face-to-face so this product focused on providing services that allowed users to play alongside others in an efficient manner.
Role 🙋♂️
UX Designer / Researcher
Responsibilities 📋
Conducting user interviews, surveys, competitive audits, lo-fi and hi-fi wireframes and prototypes, usability testings.
Duration 📅
September 2020 - December 2020 (4 Months)
Observation
Within our observation phase, we first created a field study planning worksheet in order to determine who our key stakeholders are as well as what need-finding methods we would use to gather information on their needs/wants and motivations (e.g. interviews, surveys, process mapping, etc.). We decided to interview three individuals on our own and took the information that we had gained and converted it into modular data through fragmentation on an affinity diagram. Here were the results we diagrammed below.
Ideation
Our next stage of our cycle was ideation. When looking back at our affinity diagram we noticed that our most common theme was “communication”. This meant that between all of our interviews, communication was the most significant aspect that our end-users needed. With this valuable insight, we sketched up a storyboard as well as rough wireframes in order to get a better understanding of how our design could solve this issue.
Lo-fi Prototype
Here is a video that we created showing off our lo-fi design and its use within our lives. Enjoy! (Done through Balsamiq)
Usability Testing: Findings
Structure: Participants enjoyed the clear distinction between each page. The one main area to improve upon was to include more intuitive signifiers that help the users identify them in a friendly manner.
Search: People wanted a way to simply search for games or friends from the home page.
Communication: In order to enhance communication between users, it is necessary to add a microphone feature that allows users to communicate thoroughly with each other.
Hi-fi Prototype
The final prototype for our product. This is where we got really in depth with visual design. Visuals were done through Adobe XD while we implemented the hotspots and interactions through Invision. Here are some of the wireframes that we came up with!
What I Learned 🧠
For this project specifically, we felt the impact of usability testings heavily. The transition between our lo-fi to hi-fi prototype showed a drastic difference because we got to see how our product would interact with users within the real-world. This gave us a lot of guidance when implementing visual designs as well as interaction methods.