Pivot Pong is a interview project conducted on behalf of my interview with Pivotal Labs in the Cambridge, MA office. It is a fictitious app centered around giving Pivots (employees of Pivotal Labs) an opportunity to play table tennis together and grow as team members. Click here to demo the app on UX Pin Project Duration: November 2017 – December 2017 Project Type: Skill demonstration exercise Designed For: Pivotal Labs My Contributions: UX and UI Design Programs Used: Sketch, Adobe Illustrator, UX Pin, Balsamiq Website: https://pivotal.io/labs Overview Why It Was CreatedPivotal Labs is centered around a fast moving, agile work environment where programmers and designers tackle projects in pairs, known as ``pair design`` or ``pair programming``. Table tennis is also a very important part of the company work environment, as it is the go to outlet for employees to relax and play with team members. The design challenge presented to me focused on developing an app which allows employees of Pivotal Labs (also known as ``Pivots``) to quickly and easily find a partner to play table tennis with. Approach for this projectBecause every project is going to be different, I am outlining the specific strategy I took when approaching this project; research and analysis, then design, then feedback. As you can see from the chart, we are able to move freely between design and feedback for smaller project tweaks. If the problem is more complicated, we will go to research and analysis, then to design. Research and Analysis Whiteboard challengeI was given roughly 40 minutes to brainstorm my idea. Using feedback I gained from this whiteboard exercise, I was tasked with building an app for my potential employer! Our user personaBased on the needs and work structure provided to me during the whiteboard session of the interview, I came up with Mark, our persona. InspirationsIn order to get the best sense of inspiration, I turned to users who previously designed a Pivot Pong layout on behalf of their interview with Pivotal Labs. I also observed leaderboard rankings within other apps to see how they were structured. Dane Robertson Pivot Pong Jason Luna Pivot Pong Scott Valentine Pivot Pong Michael Tinglin Pivot Pong Features I liked Many apps offer the ability to rematch players who they have previously connected with. Players in the top three rankings are given gold, silver and bronze medals. One app has a leaderboard which actively displays your rank, compared with the top leaders. Michael Tinglin’s app has a messaging feature, which I find extremely helpful for users who may be in different parts of the office and need to communicate pre game. Geolocation is a useful feature, as it tells users within the office if they can be matched with that person or not (based on if they are actively in the area). Features I saw to improve There is no feature in game to determine score and who is serving. There is no rulebook to inform users of how to play correctly. No indication if users are available for a rematch or not. I did not care for the menu bar on the bottom of several apps shown here. Design Our MVP Connects users who want to play with each other instantly Ranking across all Pivotal offices Provides leaderboards Gameifys the experience with in game rewards Profiles and short bios tell users about each other Keep track of the score and who is serving in app Rulebook and in game rule enforcement Sticky notesHere is the basic app flow. Information ArchitectureAnd here is the fully fleshed out version! Information Architecture considerations Home icon and hamburger are intentionally removed when player is searching for a partner (and also when users are involved in a match). this greatly reduces the chance of accidentally leaving a match. Red and green dots indicate when a player is active or inactive. Score is kept in app so players know when to switch and when to serve. Users can message each other if either one is running late. IOS Wireframe samplesHere are the Iphone mockups, displayed on an Iphone X. Wireframes were made using Balsamiq. The top three screen display pre match, the bottom half are screens where a match is currently active (notice how the hamburger and home icon disappear). App logoMy aim was to make a simple, yet effective logo which conveys both Pivotal culture and table tennis. I toyed around with a few ideas before I came up with this one; the Pivotal logo with a ping pong ball replacing the ``O``. UI ConsiderationsHere are the main colors used for the app, including button color considerations. Primary color used is Pivotal’s bluish green color Shades of blue is used for button shadows and background shading White is used for the icon colors Pivotal’s main green color is also used to indicate go/proceed Blue indicates miscellaneous tasks Red indicates to cancel App design samplesFinal app design was done using Sketch How the app works Find opponentTo encourage team building within the office, users must find players randomly. This is done by hitting the large ``find opponent`` button on the homescreen. Pre match screensIf there is a conflict, one of these screens pop up. If there is no conflict, you will be matched with an opponent once someone is located. If the table is in use, you can put yourself on a wait list until it is available. If you have already played one match (best 3 out of 5 games) and someone else is waiting in the queue, you will have the option to get back in line. If the person you requested a rematch from is no longer in the area (ie visitors from other offices), you will receive this notification. Match with someoneAn opponent is then found. You have the option to either play them or not. In game score trackerKeep track of your score, time and rules (such as who is serving and when to play normally vs. when to go into sudden death). Players are also reminded when to switch servers, based on the in game score kept. Continue playing (or not)Pivots have the option to decide how many games they want to play. If there is a queue building up, current players are limited to one match (first to three games out of five). Otherwise, gameplay is unlimited, as long as there is not queue building up. Victory or loss screen appears post game Screen which follows if another game is requested Post game optionsUsers can choose to send a rematch request to players whom they have already played against. The opponent must agree to the rematch request (once both players are displayed as active). Feedback Well received featuresThis was the part where I was able to speak with several Pivots to get their feedback and opinion on the app design and layout. Here is what I found: In game rule enforcement was well received, as it reminds users to switch servers during games. The leaderboard layout was well liked, as it shows both the top ranking players and your current ranking. The geolocation feature was also well taken, as it prevents errors when users are traveling (ie matching with someone visiting another office). It also opens up players to show up at the current office they are visiting. Users benefit from being reminded when to switch The leaderboard layout was well recieved Knowing when people are (or are not) in the area helps! Improvements Pivots said the rematch feature would likely get abused; once people randomly match with their friends, they will only hit the rematch button to match with that person. The messaging feature was not regarded as necessary; they stated that it would likely get used very little, if at all. The in game scoring was regarded as cumbersome and unnecessary; Pivots would be too involved with the game to bother to keep score. Pivots said the rematch feature would likely get abused; once people randomly match with their friends, they will only hit the rematch button to match with that person. The messaging feature was not regarded as necessary; they stated that it would likely get used very little, if at all. The in game scoring was regarded as cumbersome and unnecessary; Pivots would be too involved with the game to bother to keep score. Future Iterations Future iterationsUsing the feedback I received, I would implement and change the following features I would remove the “rematch” feature. This would get reportedly abused, and removing it would not only remove this issue, but it would also eliminate the need for the “available/not available” feature, as well as geolocation. I would consider removing the messaging feature. This would be dependent on how feasible it is to implement from the developer’s end, as well as how often it is used. This can be added in the beta version and it’s use would be measured based on heatmap software. In game score keeping may be removed as it is reported to be too much of a distraction from the game itself. The advantage here is that removing it is the least distracting option, while the disadvantage is that there is no way to enforce in game reminders of when to switch players or the score, so that responsibility is up to the players. A/B testing can be used to determine the best course of option. Pre game rules, as opposed to in game rule enforcement. This feature is lost as to eliminate the in game score tracker, so players are expected to remember the rules and their own score In game screen is simplified to simply show the players, the timer and tell the game when the game is finished. Since everything would be reported manually, players must input which person won the game. Future stepsThe next steps from here would be to collaborate with other parties. I would work with developers to determine how feasible it would be to implement these features, and weigh them with how necessary each one is. I would also collaborate with project managers regarding time and other project implementations. What I got out of this project How to design and pitch an app concept for a potential employer. Implementing a strong, logical thought process in the form of information architecture. Asking for, and implementing useful feedback. Further utilizing my Sketch and Balsamiq skills.