TWISTER INTERFACE: INTERFACE DESIGN AND JUSTIFICATIONS

       Research for this assignment inspired changes in the final mock-up interface for Twister: Kinect. In fact, it even inspired changes to the mechanics of the game. Ideas considered interesting were scrapped due to unsuitability, whereas other ideas where refined and eventually, the final interface was developed below. I must note; the graphical prowess of this interface inst outstanding, but it is supposed to be a 'mock-up'.

TWISTER: KINECT - INTERFACE MOCK-UP
by Christian Whelan

       Designed by Charles Foley with success in 1966, Twister is the classic and nostalgic, physical party game. It’s physically demanding spotted mat is identifiable with the game’s name, rules and even memories. Thus, when replicating a twister experience digitally using Kinect, it’s important not to just replicate mechanics, but rather the spirit of Twister – laughs, comedy and memories. This goal ensures digital Twister is faithful, whilst offering the new through nostalgia and hardware. First – research.

SECTION ONE: RESEARCH ON UI DESIGN AND FEEDBACK

             Before designing the interface for Twister, it’s important to research examples within the same genre – Party Games. Two games will drive this research, Buzz and Wii Party - games that prove incredibly popular amongst its audience, an audience Twister: Kinect shares.

    Two statements ring true with examples below - “truly great user interfaces are the ones that are engineered to stay out of the way” (Teamtreehouse, Sollenbourger. K, 2012) and interfaces “…keep the user entertained” (Toastytech, 2007) through feedback and variety. Looking at the interfaces of Buzz and Wii Party, today’s HCI objectives are noticeable. Buzz and Wii Party are party games focused on the players. Instantly (which is important), three things are noticeable about the interfaces – affordances, pop out effects and simplicity. All are in effect within the “safe frame” (Level Up! , R. Scott, 2010) - information is presented in a thematic and fun way, whilst working in seamless co-operation to assist players in actually playing the game.

   Party games are multiplayer focused; therefore crucial aspect is distinguishing players between one another and highlighting which player controls which avatar. Here, the character’s avatars are paired with their attributes so players can keep track of theirs and others ‘personal’ stats. It’s a great idea that is undoubtedly achieved through images, text and attributes – these are HCI affordances. Affordances to be utilised in the Twister interface.

  The second aspect is the way pop-out effects are used to enhance affordances. Colours, borders, text colours, fonts and weight are key in facilitating gameplay as Sollenbourger states, “The size, color, and placement of each element work together, creating a clear path to understanding…” (2012). Buzz uses it to facilitate controls, whereas Wii Party uses it to distinguish the players’ avatars – both concepts needed for Twister that uses colour as a primary mechanic. The final aspect is the colour pallet – a rule of three comes into play, ensuring the interfaces are consistent and understandable as Sollenbourger supports.

   The final aspect of the user interfaces is simplicity. Only details that are crucial are visible as Sollenbourger continues to support “Does the user really need this?” (Teeamtreehouse, 2012) when discussing what should be asked when designing interfaces. This answer is exaggerated in the images to the right. In Buzz, all the players require, are attributes that highlight progress, information needed to progress, and information that determines the game. In Buzz, there’s the player information, questions / answers and the timer. In Wii Party, there’s the HUD avatar, score and timer. There is a praxis, one to be adopted in Twister’s interface.

    Visual, Aural and Tactile feedback is a trio that bring interfaces to life, keeping entertainment flowing and enhancing the game’s “feel”. Buzz and Wii Sport use the aforementioned. Visual effects, sounds and animation for buttons, successions, progressions and failures show that every single action has all three to increase polish as Sollenbourgh supports that “Your interface should at all times speak to your user, when his/her actions are both right and wrong or misunderstood.” (Teamtreehouse, 2012). Rogers also supports that “…there can never be too many fireworks!” (Level Up! , 2010). There is never s a second that goes by without a sound playing as a result of a player’s actions - effects such as shaking buttons, highlighted borders and sweeping sounds add to the games feel. It is incredibly important when Twister: Kinect has no physical controller – the entirety of Twister: Kinect’s feel will have to be reflected through discernible animations, visuals and sounds – diegetic, non-diegetic and spatial, as an interface is not just the HUD, it’s also the game environment.

         Conclusively, as Twister: Kinect has no physical controller; the game’s success is down to the interfaces and feedback– it has to be simple, readable and discernible. By researching Buzz and Wii Party, it is clear what works in interface design and what doesn’t. With feedback, more is better - even the subtle details adds to the experience.

SECTION TWO: COMPLETE UI DESCRIPTION

              Taking the interface and feedback research carried out on Buzz and Wii party, the Twister: Kinect’s multiple interfaces began development with many iterations and versions, changing as the mechanics informed the design. In the end, multiple modes required multiple interfaces and forms of feedback, all of which are consistent in theme - Twister: Kinect became familiar, but something new, adopting the entertainment show setting of the popular Buzz titles. In-game, the interface adopts the design of the game show, with the centre stage and contestants illuminated in strobe lights, and the HUD projecting key game attributes and properties (lives, character names, coloured spots).

    The most logical way to explain and justify the interface is it categorise the elements into diegetic and non-diegetic design aspects whilst referencing the mock-up interface design, concluding with an explanation of feedbacks that would give Twister: Kinect the polish many party games have. Foremost we have the diegetic design elements.

     There are only two diegetic design elements in Twister: Kinect - the projected player avatar and the in-game twister mat. Both of which are set in the game show themed environment and crucial in allowing the player to play the game. Foremost we have the mat. This is without a doubt, the most significant aspect of the interface, as players will reference it constantly throughout the play session, because of this, just like any other game avatar, it is central in the interface, illuminated by surrounding strobe lights – players will naturally be drawn to it as it’s their game environment. It is their means to success, just like the physical mat would be in the classic game of twister. Equally as important, is the avatar, the player’s themselves will be projected into the game environment using Kinects motion sensor technology. With these two diegetic design aspects, players would know where to move, where they are and how to get there, but there is still a lot missing - players do not know who they are. Colours are a crucial part of the solution, along with many other details. This is where the non-diegetic design elements come into play, with layout, colour, scaling and affordances.

     Player attributes, player properties, the spinner and the scores – the four crucial key elements that make up the non-diegetic interface of Twister. It could be said that because of the theme of the game (game show) that the in-game avatar are aware of these aspect, thus they create a diegetic interface, however, considering the in-game avatars are in fact the player’s themselves, the interface is still non-diegetic – it’s a required fourth wall, that just happens to be tied into the game’s thematic world.

     At this point, players have a virtual mat, an avatar and a virtual environment, but now player need a mechanic to the play the game – the spinner. This second half of the classic Twister game is again, central in the screen but remains for the majority of the game half its usable size, never hidden and never faded due to its constant use. With each player turn, the player would shout “Twister Spin”, bringing up the spinner, then automatically spinning. Once the spin is completed and colour and a limb is selected for that player. It’ is important to note that the spinner adopts the same design as it always has – four sections with the twister colours and an arrow. It is from this point the character attributes make themselves noticed to the players.

     In each corner for each player (one to four) everything the player could possibly need is contained, organised in a hierarchy of importance as Rogers states “use hierarchy to organise your HUD” (Level Up!, 2010). First is the player gamer tag gamer picture – the two aspects that the player will instantly identify with. These are also the largest of the elements. Following, in the same section, are the player’s lives, determined by how many slips the player has during the game. Why do the lives sit here? The reasoning rests in its importance, considering the lives determine the win/ lose scenarios, the player will want to have this information instantly, thus it is grouped with all the other important player information. Finally, as an offshoot from this section but still within the same corners, the colour circle sits, large and more central to the screen to highlight its importance. Once the spinner returns to original smaller size after the spin, this is the UI element that will tell the payer where they are to go next.

       Moving onwards, the player attributes and their positioning around each other was decided at an early stage. The positioning around the screen however, had seen iterations. It was all about ensuring the layout was simple, intuitive and understandable but on the most part invisible, as Rogers states “the HUD should be practically invisible” (2010). Only when the player needs information should they see the HUD, so in response to this fact, the player attributes where scattered to either corner as far as possible and minimised to a small but readable size so the player could focus on the action.

     With everything in the position and size it needed to be, it was all about using colour to offer affordances to the players – players need something to identify their avatar with in co-operation with their attributes. Thus, taking the colour scheme of twister and applying a colour to each player meant they instantly knew who they were, as the avatars share the same colour. Simultaneously, players can find their own information easily using colour association swiftly adopted due to the simple interface. It’s a simple but effective technique, that caries the bold theme whilst facilitating the gameplay – a goal from the start of this process.

    Finally, the score is central and adopts this colour coding technique. In Twister: Kinect, players are in competition, so the score it the focal point at the end of each game. Therefore, the scoreboard s both central and colour coded, the players can find it and recognise the scores relationship with each player.

        Now that the literal design of the UI has been explained, the feedback needs to be detailed. Feedback is incredibly important in Twister: Kinect. It gives the controller lacking game the feel the common controller provides. Therefore, literally every action has a sound, animation and accompanying graphic as Sollengerger supports “always provide feedback so the user doesn’t get bored” (2010).

    Starting with the obvious, music continuously plays as the game plays. As the game progresses and the positions increase in difficulty, the music’s tempo quickens to increase tension and excitement for the pending fall. At this point, it suddenly stops as crowds cheer, only for a new track to start and to add variety. Notable, is that as soon as the player falls or loses a life, a recording of the fall / slip plays whilst simultaneously showing snapshots of the players face as he / she does. It’s an entertaining bonus that could provoke falling just for that captured memory. Additionally, as the capture replays to the player, the in-game audience laughs with them – these subtle effects add to the feedback. The most commons sounds and effects however, are during the balancing act of staying in the game. As player desperately balance and change positions, buzzwords shoot on screen under the appropriate players attributes with the commentator shouting them – “Watch out” or “Great work!”. Various other sound bites play as fireworks set off and glitter falls off the screen. It’s an attempt to reward the player for their every move, something classic physical twister cannot provide. In doing so, the player can feel the game interact with them – theirs and the games actions are discernible.

Eventually, as stated, they fall. When this happens, the spinner is activated through a voice command. When the player activates the spinner, swooping sounds take over followed by the creaking and cracking of the turning wheel as it activates, speeds up and slows down to a halt to land on the limb assigned colour. When a colour is select, it shoots out of the screen with fireworks and the commentator dictates the next move. It then falls back to the players attributes with a crash and the spinner minimises with yet more swooping sounds. It is at this point where the game is at its most quiet – the player is attempting to reach the next position as players watch the screen.

      So, after an entire game of swopping, fireworks, shouting commentators and audience cheers, a player is left standing, wining the round or entire match. At this point the HUD swiftly zooms off screen disappears, the camera zooms in, the player is prompted to hold a winning pose as the game takes a photo and compiles it with the match’s best bits. To top it off, a chosen custom song plays for him / her whilst people begin for the next match. It’s a final reward for the victor that is personal and incredibly unique whilst fitting with the part atmosphere, keeping the party going and in turn, keeping the games going. It’s a feedback feature that Twister: Kinect owns.

      In all, the feedback in Twister: Kinect ensures that there is never a moment that passes where nothing is happening. Because of this, entertainment is prolonged, enhancing the twister experience, offering something familiar but something new. When it comes to the UI, User Interfaces should primarily facilitate gameplay - it should be informative, accessible, understandable but simple. Scott Rogers best summarises a game UI’s by stating “…the goal of these screens is to communicate clearly and efficiently to the player” (Level Up! , Scott Roger, 2010). Game interfaces share the same theory of the common computer interface, but they shouldn’t be the focal point of the experience – they create the fourth wall and become a double edged sword. The interface designed for Twister: Kinect follows this praxis, much like Buzz or Wii party. And the fourth wall, that is inevitable, is meaningful used to enhance gameplay. But players need controls to play the game. What are the Kinect controls and why us Kinect?

SECTION THREE: CONTROL SCHEME WITH OVERLAID INDICATOR

      In Twister: Kinect, controls have to be a seamless social activity, not an isolated activity as social play is the heart of Twister – the “interaction of multiple players.” (Zimmernman, Rules of Play, 2004). Thus, intuitive, discernible and entertaining are the three goals when designing the controls of Twister: Kinect. Two things make this possible – hand gestures and voice controls that should be “intuitive to the player” (Rogers. S, 2010). Too many motion controls and affordances can confuse for players, so blurring the gap between intention and physical action is key - “motion controllers should be broad and mimic reality” (Rogers. S, Level Up, 2010).

     Two questions needed answering through Kinect controls - how do players navigate interfaces and how do players play. With interface navigation, there are two options – twister positions (for added entertainment), or hand gestures and voice controls (selectable on start-up). If the player chooses to use Twister poses to navigate menus, each selection presents players difficult comedic poses, these poses are shown using non diegetic silhouettes (see below) coupled with the menu selections so players would instantly recognise their relationship. In addition, it increases entertainment as getting to the game is a now spectators sport and therefore, entertaining for all.  On the other hand, if players choose the standard gesture and voice controls, controls are less ‘obviously’ fun, rather they are simple and effective when you consider feedback and that Twister: Kinect only requires three gestures and intuitive voice commands. Again, it comes back to the Roger’s statement that “motion controllers should be broad and mimic reality”. Players will face four points of interaction – selecting, quitting, pausing and recording.

      To select, the player would place their hand over the selection and continuously wave until the selection smashes and takes the player to the next screen – quite standard. To quit or go back, for example, going back to the main menu from the House Party interface, the player would perform a bold swiping gesture from left to right, rolling a twister mat over the screen the reveal the next interface, similar to a smart phone. The reasoning behind this interaction is through a statement that rings true, especially now touch screens are as common as they are now, as Scott Rogers states “consider emulating control schemes” as it is “familiar” (2010) and therefore, less confusing. Pausing is more complicated, the only time the player would pause is during an in-progress game of a twister, which with hand gestures would definitely interrupt the game’s flow. Naturally, players would use voice controls to pause the game with the “Pause Game” voice command, but in order to do so physically, all players would have to put one arm straight in the air, which although impractical, would be an entertaining form of social co-operation. Of course, this specific gesture would be explained during the loading screen and in-game through affordance hints. Through three simple gestures, the player can navigate the entire interface, but make use of all the hardware.

  Voice control is the third and most important of the three control methods. It’s enabled throughout the entire game and most the efficient control method in-game due to its seamless and intuitive nature that prevents player frustration. It works exactly like it should, by accepting a variety of literal voice commands. If players wish to select the “House Party” mode, then the player would state “Select House Party” and so on. Microsoft used the Xbox dashboard, the most important interface of a console, as the promotional demo for Kinects voice control – Twister: Kinect shares the same intuitive voice control functionality. Most importantly however, is the voice recognition used to control the spinner, the primary mechanic, in which case the players would shout “Twister Spin!” when ready for the next move. At this point, the spinner would zoom and centre and animate accordingly. The variety of voice commands are detailed below.

    When playing the game, controls are passive and unintentional by players. The Kinect’s joint recognition would compare player’s position with the in-game twister mat. If there one or more limbs leave this zone, players loose a life. Likewise, if the player’s hands are on the mats circles, then they are safe, allowing the game to continue on. Couple this passive background control with the voice and gesture controls and Twist: Kinect is a game that utilises Kinect to its fullest whilst remaining intuitive enough to not interrupt the heart and soul of the game.

SECTION FOUR: CONTROLLER JUSTIFICATION

             Kinect is a “controller-free gaming experience using physical gestures and movements, replicating them onscreen” (Gadget Show, 2009). In comparison, Twister revolves around physicality. Considering Twister requires full body movement, the PlayStation’s and Nintendo Wii’s controllers aren’t appropriate for Twister: Kinect. 

       At the core of Twister: Kinect is a faithful digital recreation of the classic game. There is a plethora of controller options available, but it seemed Twister’s iconic rules and gameplay prompted at only two viable options – a connected physical mat (replica of the common twister mat), and the Kinect motion sensor. In the end, it was the mechanics and ideas at the design stage which prompted Kinect to overshadow the normally, equally viable mat option - physical controllers are designed for other gameplay styles, they would physically prevent players from playing twister, thus, preventing immersion and damaging what makes twister so fun. These four mechanics are joint recognition, gesture recognition, voice control and video and image capturing. 

      Firstly and most significantly, we have joint recognition as James Rivington states “your body is the controller” (TechRadar, 2010) when discussing Kinects main unique selling point. When twister revolves entirely around the body and Kinects main USP revolves around recognising the body, it is clear that Kinect is the suitable choice when Twister: Kinect’s main mechanic is considered, as Rivington continues on to say “It measures the positioning of 48 key joints in your anatomy and by tracking the movements of these joints, it can work out exactly what position your body is in.” (2011). It is the only controller that registers every joint, and outputs the desired response – it is designed for physical games like twister. But the physical mat peripheral can mimic this functionality at an equally entertaining level, it’s the other mechanics of Twister: Kinect that highlight the physical matt’s shortcomings.

   If a physical mat was utilised for a basic remake, there would be no benefits to using the Kinect over a physical peripheral, but when players switch to the conventional controller to navigate interfaces, there is a fourth wall – one that classic Twister avoids. Kinect however, has gesture recognition, it “uses the camera and microphone to work out what you're doing” as Rivington continues. Players use gestures to navigate menus – it’ a seamless experience.

    To enhance this point, gameplay in Twister: Kinect starts before the game begins (the menu), the traditional controller’s analogue sticks do not offer the athletic, tactile feel Kinect offers in this mini-game – players actually make the poses required to select a menu option and as Scott Rogers states, a game should “keep the gamer playing” (Level Up! , 2011). Considering the game’s USPs match the USPs of the Kinect, the physical mat or conventional controller has blatant downfalls. Additional mechanics of Twister: Kinect also justify Kinect use.

    Penultimately, as Rivington supports, Kinect has voice control. It was specifically promoted for navigating interfaces or enhancing gameplay by breaking the fourth wall. Mass Effect 3’s dialog and the Xbox dashboard are notable examples. Considering the point made regarding other controllers lacking suitability for Twister, it made sense that Twister: Kinect would have optional voice controls so players never stop playing. They could say “Spin the spinner” or “Record” to control the game. Other controllers could provide this, but they pose a physical barrier.

    This leads onto the final justification for Kinect use, one that also further justifies voice controls – the Snapshots mechanic. Automatically or when prompted, images and the last 10 seconds or 3 minutes of gameplay are recorded, saved and ready to be shared. It’s a mechanics that solidifies the spirit of Twister – fond memories. It’s a key mechanic that is utilised every time a player falls and plays on the non-diegetic interface for further entertainment. Without this, the game would not be as entertaining, as it provides reward from failure. There’s only one controller that allows this whilst still retaining the benefits a digital Twister needs – Kinect.

      

      Clearly, Twister: Kinect was inspired by and designed around the Kinect motion controller. It fully utilises its gaming benefits to enhance the Twister experience. Now, players don’t just play Twister, they play Twister before they player Twister, record and picture themselves playing twister, and share their memories with family and other Twister players. It’s the enhanced, modern Twister, which focuses on what Twister is about - controller free, unique family fun, only possible by Kinect.

NEXT POST: REPETITIVE CASUAL GAME: INITIAL CONCEPT AND IDEAS