A Mobile Game App

Have you ever noticed your friends taking the same kind of photos such as their roommate eating ramen, another majestic photo of their dog, or the same views of their work place?

Biggest Creeper sources your Instagram feed at random and asks you… who took that photo?! It’s a bit tongue and cheek, but challenge yourself and quiz your friends to see who can spot the habitual Instagramers!

Objective: Create a game that people can engage in and have a good laugh poking fun at social network.

My Role: UX/UI Designer exploring user research, user flow, wireframes, prototyping, and visual design.

Discovery

USER RESEARCH

The first step in my process was to figure out target audience, player habits, and motivations. I interviewed 3 and surveyed 12 people online with an age range of 21-35.

Insights & Validation:

  • Almost all people use Instagram.
  • Most people are not competitive.
  • 67% play games a couple times a week.
  • Majority play only with friends and family.

User Goals:

  • People play for distraction.
  • The majority are influenced by their peers.
  • People want to be engaged in an easy way.

PERSONAS

After gathering my research, I created two personas to understand my target demographic, motivations, habits, and place a face for my player.


COMPETITORS

Next I audited features and best practices my competitors used, and also noticed best and worst ways they addressed user goals.

Priorities and goals after observing competitors:

  • Source user generated content from social network.
  • 

  • Encourage social interaction through challenges.
  • Create leveled challenges to keep users engaged.

Explore

TASK FLOWS & WIRE FRAMES

I explored various task flows and jump started by sketching wire frames for navigation.


PROTOTYPING

I tightened up my wireframes and took them into the world. I tested my paper prototypes within two rounds with 3-5 people.

Insights from Round 1:

  • Dashboard seemed cluttered. Too many visuals with thumbnails.
  • Notifications located in Leadership Board (Trophy Button) was confusing.
  • Too many features for challenging a friend.

Insights from Round 2:

  • Users didn’t understand that social activity was below quick play.
  • Multitude of steps in challenging a friend was overwhelming.
  • Need an easy way to engaged, and prioritize content.

Define

FINAL WIREFRAME

After collecting feedback, final wireframes were created.

Annotated Wireframes:

  • After the end of each game, new photo fades into screen.
  • Swipe left once for games waiting for your turn.
  • Swipe left twice for games pending your friend’s turn. Swipe should be a single movement with a ease into the next screen.
  • Tap icon to quiz specific photo to friend. This will take you to another screen. Ease into next screen. Quizzing for each photo can only be done before the end of the game.
  • Depending on which is the right answer, the wrong answers fade out, and the right answer fades in.
  • Search takes you to another screen, ease into. You can only search for hashtags.

Final

FINAL WIREFRAME & UI

My final thoughts and what I’ve learned along the way:

  • People want to be engaged right away, so bring it front and center on the dashboard.
  • Do not be afraid to give up or change various parts of your ideas.
  • I shifted my priorities along the way. I went from a focus on social aspects to being focused on the player right from the start, and was able to create a cleaner and more usable design.
  • Eliminating unnecessary features gave way to what the game actually means to the player.

Top
ALL CONTENT © 2015 SUZAN CHOY