The Bandit’s Inn – Mockups


Keeping a mobile-first approach in mind, I created a prototype version of my mobile mockup for user-testing, but still designed how I imagine this scaling up to tablet and desktop. I also kept the illustrations pretty rough for the time being.

On my last round of user testing, I kinda just went page-by-page and asked for thoughts. In further research, I realized this probably wasn’t the most effective method. For this round, I created a list of questions a typical user would ask themselves and asked the tester to find the answer. Some questions I included were, “When does Happy Hour start?”, “What does the inside of the bar look like?”, and “What are this month’s trivia themes?”. I found this to be a much more effective method of finding issues with my design.

I had 8 testers. 2 female, 6 male. 6 in their 20’s, 1 in her 30’s, 1 in his 50’s.

Helpful Links

*Red line indicates bottom of screen

Home Page

Made a few useful changes here. I realized I could save a bit of space if I stacked the icon for the menu and event items above their label. I added an illustration on the cover of a few rogues sitting back and chilling together to push that idea of community here.

User Testing Notes

  • Include “Happy Hour” hours in the Hours section.


I pretty much kept the navigation structure the same. No significant changes here.

User Testing Notes

  • Testers used the navigation with little difficulty.

Beer Menu

Added a couple pieces of additional information (calorie count, happy hour, specials, as well as differentiating between drinks that are on tap).

User Testing Notes

  • All of the younger testers had a hard time seeing the “On Tap” indicator under the logos. Interestingly, my older tester had no problem and saw them right away. Regardless, a new method of indicating “On Tap” is needed.

Mixed Drinks Menu

Added Happy hour and specials, as well as calorie count. I added a small triangle by the pictures, as well as underlined the titles, in an attempt to make the entry seem “clickable”. I’ll see how effective this was in user testing.

User Testing Notes

  • Testers used this page with little difficulty.

Food Menu

I moved Beverages here and simplified the organization here.

User Testing Notes

  • Rename page to “Food/Beverages”. Testers had difficulty finding the non-alcoholic beverage section. I asked, and they confirmed adding “Beverages” to the titled would help them find them faster.

Game Menu

I’ve added number of players, as well as the rating. I decided against adding difficulty because I felt that was subjective and difficult to measure.

User Testing Notes

  • One tester suggested a few ways I could adjust the text in the “rental instructions” to make it more clear (namely, that your ID is supposed to go to the bartender, and how they handle passing games around on high-traffic nights).


Added a section for news, and even in making up events I’ve found a use for this section.

User Testing Notes

  • Consider adding Happy Hour info here as well, as this was the first place many looked for it after the Home page.

Photo Gallery

I decided to simplify this page, and just have each section uploaded by date. I figure in having photos from events, there will inevitably be photos of the interior.

User Testing Notes

  • Testers used this page with little difficulty.

About Page

Added a paragraph to give an introduction to the concept, but otherwise no other significant changes.

User Testing Notes

  • Testers used this page with little difficulty.


No significant changes.

User Testing Notes

  • Testers used this page with little difficulty.

Additional Thoughts

Overall, I’m happy with how this round went. My testers generally struggled with the same tasks, so I’m confident about the necessity of the changes I need to make. I’m excited to make this site the most usable it can be!

The Bandit’s Inn Nav