It’sBarSocial connects users to places around them. It helps bring multiple platforms into one. Keeping users updated on business hours, specials, menus and more by the convenience of the establishments owner who are now in control of their own page. Also allowing users to find out how many individuals are at an establishment before heading there. Throughout the research, ideation and design process we focused on the user first and followed through in order to create an app that we believe the world needs.

Project Duration

4 months.

Role

Sole UX/UI Designer & Researcher.

Tools

Figma, Invision, Miro, Slack, Zoom, Adobe Illustrator.

Project Summary

It’sBarSocail was designed to keep the users and owners in mind. Making it easier than ever to find what it is that you’re looking for within the area you are currently in, or traveling to. From finding a food truck, to locating live music, maybe a new forvorite cocktail bar, or your new favorite restaurant, I wanted to step out of the norm, and away from the multiple searching required just to find somewhere to go.

The Challenge

Finding a place to go out when you’re in a new city or visiting can be hard. Not knowing what a place might have to offer for you depending on what you are looking for is not easy. Google only shows so much and Yelp only does the same. Unless you can find their social media and find out what is happening that day, like live music, food or drink specials and so on.

The Solution

Create a new way and easier way for users to find places around them. Intergrading multiple platforms that currently exist into one. Making it easier for the owners of the establishment to keep their business hours, events and menus updated. Allowing not only the user more control on finding something to do, but also the owner control to finally keep their establishment up to date for all to see.

Research

Secondary Research

During my secondary research I find it is a common problem for most users to have a centralized platform for them to be able to find a place to eat, drink or socialize.

1. Users have problems finding places to eat, drink or socialize.

2. Users seem to need some knowledge on finding places to go. The platforms vary, making it time consuming for the users to find places, often resulting in them spending too much time searching, or getting frustrated and just picking a place that might lead to disappointment for them and their party.

I find the same issue occurs when it comes to finding great things to do in the area you live, or are visiting. Many of the solutions require knowledge of where to go, who to ask and lack the aspect of saving time as well as money. Below I have linked a few articles that are trying to help people find more things happening around them and their solutions for each. But the issue still is present. I am hoping to be able to set up a better method of user testing and research in order to create a better solution to this problem. Below I shared a few links to solutions as well as statistics of the amount of users who are searching for the same common solution that I would like to resolve / improve.

Research Plan and Screener Surveys

To get insights into what the individuals of the target market I was looking to resolve these issues for needed and wanted, I used the screener surveys to recruit the best people to interview. After collecting all of the interview data, I was able to synthesize my findings into affinity groups, empathy maps, and user personas. The objective was to create a better platform for the users who like to go out to eat and drink. And to redesign the wheel.

Surveys

When creating my screener surveys I set out to find individuals who would best fit the clientele of those who went out to eat or drink at least once a week. Having the correct individuals to interview would be major key to the success of this project. I used Google to set up my screener surveys, and recruited people via text, social media and Slack.

Interviews

I then proceeded to create an interview script, and conducted 5 interviews with users who filled out my screener survey that best met the demographic of what I was looking to learn from these interviews. I wanted all users to feel as if there was zero wrong answers, because truly, there weren't. I asked each participant the same open ended questions that revolved around bars, restaurants and places to go near them. I conducted all interviews via Zoom. I asked each participant if it was okay to record each session to look back at later for notes. This process allowed me to better understand what users needed, wanted and were looking for when they went out.

Synthesis and Ideation

After user interviews I decided to separate each user interview into notes per user. From affinity mapping, to empathy maps, then personas. I made two separate empathy maps, one aggregated and one regular. I then set out to make personas on each user to better understand my case study. 

My interview notes

Affinity Mapping

After my interviews I was able to separate my notes into six catagories: Social media / websites used to find places, where they live or have lived, if they look at reviews for places and how they feel about them, user suggestions, user pain points & user likes.

Key takeaways

Within my user interviews and note taking I was able to gather more information on what individuals were looking for, using and wanting when they searched for places to eat and drink. How social media impacted their decisions on going places, and suggestions on what they would like to see while planning places to go out to eat or grab a drink with or without friends. As well as their difficulties in finding places while traveling, or when they’ve moved to a new city.

Empathy Mapping & User Personas

I then set out to created two separate empathy maps: one aggravated & one user empathy maps. Creating two separate maps for empathy let me collaborative the best visualization used to articulate what I know about the particular types of users.

Problem Statements: HMWs

The final piece of my research was to synthesize this data, with How Might We (HMW) statements to clearly communicate the most important problems users want solved.

1. How might we solve the issue of reviews not having reliable information?

2. How might we help users find what they’re looking to do around them?  Example: Live music, food trucks, drinks, specials

3. How might we let the restaurants keep their hours updated at all times?

4. How might we keep people informed on events, specials ect?

User Stories

Before I could get started with the design, I had to identify the most important functions this app needs. User stories were categorized by priority, the "Must Have" being the most crucial functions, to nice to have and Ok not to have. This helped me understand the necessary features and elements that needed to be implemented for a smooth experience.

Ideation: Drawing

At this point, I had a rough idea of what some of my screens could possibly look like, so I drew some rough sketches from my Problem Statements:HMW to better visualize it.

Site Map

Now I had a better idea of what my users needed, so I created the sitemap with the intent of engagement and simplicity. Separating each catagorie into six separate pages in order to create an easy navigation for the users and the flows that they might take in order to achieve what they were looking for.

User Flows

With the map completed, I was able to determine the three user flows that were most important to the product, based on my user stories. These user flows were to find a place to grab a drink, find a place with live music and create a review for a place.

Sketches

Sketching the screens necessary for the flows, I took inspirations from current popular apps as well as ones I use regular. Although the sketches weren’t too detailed, I still made use of recognizable UI elements and components. I also made sure to write in ideas and notes within each sketch to better prioritize my my designs.

Wireframing

I began working in Figma and used those sketches to create low fidelity wireframes. Doing so helped clarify how I wanted functions spaced out on screen, as well as giving me a much better insight on how I could simplify and prioritize functions. Throughout the design process the layout of the design would change, in order to create a better experience and design.

Design

Mission/Vision

Being able to find places around you easier would make everyone happier. Giving the user an easier experience finding things to do around them as well as the owner of the establishment complete control over their own pages for once. Rationale: I chose this mission/vision to help users as well as owners connect to events around them easier. I’ve worked in restaurants for 15 years, and understand the needs of users / owners.

Brand Platform

Company/Product Name: It’sBarSocial

I chose this name because I wanted people to feel engaged while using my app. Humans are social animals, thus making them feel more comfortable using something that relates to them. 

Style Guide

Now that It’sBarSocail had a style guide I wanted to focus on keeping its look modern and easy to use. I stayed away from too much going on in order to let the users focus on what they wanted to achieve and to keep them from getting distracted.

High Fidelity Screens

After the design system was tackled I was able to focus on HI fidelity wireframing. The style guide made it easier for me to create these designs efficiently and effectively. I created a total of 22 screens with some altered to make a total of 32 wireframes. I kept the design up to date with clear hierarchy and typography to keep it feeling fresh to the individuals using the app.

Prototyping

After I built out my hi-fidelity screens I went ahead and set up three separate, but intergraded prototypes for user flows before I went forward with setting up my usability testing.

Testing

Usability Tests

After the prototyping was finished I then followed through to conduct 5 moderated usability testing. I asked 5 individuals that I personally knew to partake in the study. Each Individual was between the ages of 25-45 and went out to get food or drinks at least twice a week. I then decided to do a usability test report in order to better show my findings.

Objectives

The primary goal is to uncover usability problems in the three red routes of the prototype.

Synthesizing and Redesigning

After the usability report I was able to focus on the issues that the individuals I interviewed help me discover in order to make the product and design the best I possibly could after my research. I went forward and updated a few designs as well as making it easier for the user to know where they are by adding color to the navigation when they are on the home page, profile page and so on. I will be continuing to work on this project throughout the year. And hope to have it up and running by the end of 2022. I will be sending all of my findings to a friend of mine who will be doing the coding for the backend. I will also be updating this case study as I further develop and research It’sBarSocial.

Reflection

While working on It’sBarSocial I was able to sharpen my UX/UI design skills with each step of the way. As someone who loves to continuously learn I find projects like this super exciting. I truly enjoyed each interviewer I had the pleasure of meeting, and would like to thank each individual that helped me create It’sBarSocail to what is has become four months later. Although I will continue to develop this app I will try to make sure to come back and update this case study as time passes. I am excited for the day you’ll be out on vacation, or just moved to a new city, and you have the convince to be able to pull out your phone, load this app, and find what you’re looking to get into that day, night or week,