1. Social Card Game App Overview This app is for a social card trading game that rewards users who collect all 5 types of cards The app helps players find other players to trade with by tweeting what cards they need or what duplicate cards they have to trade The app also provides information about the current prize (which can change as the game progresses), winners, & other announcements

2. Requirements HTML5 mobile app Optimized for mobile phone screen sizes, but must still work in tablet/desktop browsers (it’s OK to just display everything in phone size in the center of the browser window) Must run on Heroku and/or Force.com and integrate with the Twitter API and OAuth

3. Variables that must be configurable {admin}: the twitter user running the game (e.g. @robcheng) {sponsor}: the twitter hashtag for the company sponsoring the game (e.g. #acme) {game}: the twitter hashtag for the game (e.g. #awesomeCardGame) {event}: the twitter hashtag for the event (e.g. #df11} {bitly}: the link for the game web site (e.g. bit.ly/cnn) {card1}, …,{card5}: the twitter hashtags for each of the 5 cards – these may be up to 16 characters long (e.g. #train, #bus, #utility, #house, #hotel)

4. Variables that must be configurable The images for the cards: there will be at least 2 images for each card: large & small, but depending on your design there could be more. Feel free to require specific image sizes (they should all be square). Example images: The images for the game logo and various icons, e.g.:

5. Most recent announcement Game logo Each of the 5 cards has a clickable icon (when clicked, see slide 6) Prize money amount on tile is updated live based on tweets from @{admin} #{game} #prize (see slide 19) Most recent tweet from @{admin} #{game} #news (see slide 22) $1000 up for grabs $1000 up for grabs ? Main Screen: 8 elements, all clickable/tap-able Cards that are the most in demand have flames, based on latest tweet from @{admin} #{game} #{cardX} #OnFire (see slide 14) The game logo (when clicked see slide 23)

6. Most recent announcement Game logo $1000 up for grabs $1000 up for grabs ? Game logo Share or find #{card1} Tell people you have or need #{card1} Find people who have #{card1} Clicking on a card icon goes to a tell/find page: See slide 7 See slide 10 Back arrow ALWAYS goes back to previou s page

7. Game logo Tell people you have/need #{card1} Playing #{sponsor}#{game} at #{event}. #have #{card1}! Join the game {bitly} Post to Twitter Have #{card1} Need #{card1} Game logo Playing #{sponsor}#{game} at #{event}. #need #{card1}! Join the game {bitly} Post to Twitter Have #{card1} Need #{card1} Tell people you have/need #{card1} Text only populates when you press the have or need button above. Text must be editable. Tell people you have or need #{card1} Tapping this picture does nothing Clicking on ‘Tell’ goes to a have/need page:

8. Game logo Clicking on ‘Post’ will Oauth w/ Twitter if not already authed Authorize SCGame App To use your account? Post to Twitter

9. After tweet sent, return to home screen w/ bottom message Your Tweet Has Been Sent! Game logo $1000 up for grabs $1000 up for grabs ? This message should disappear in 3 seconds then be replaced with normal announcements

10. Game logo Finding #{card1} Farhad Manjoo @fmanjoo 1m Steve Jones @sjones 2m Frank McK @fmck 3m Joe Lee @jlee 5m Find people who have #{card1} Scrollable feed of all tweets with #{game} #have #{card1} – tweet text replaced with icons Clicking on ‘Find’ goes to a find page:

11. Game logo Farhad Manjoo @fmanjoo follows you San Francisco Farhad Manjoo @fmanjoo 2m Farhad Manjoo @fmanjoo 4m Farhad Manjoo @fmanjoo 5m Clicking a post on the find feed goes to a filtered user feed: Game logo Finding #{card1} Farhad Manjoo @fmanjoo 1m Steve Jones @sjones 2m Frank McK @fmck 3m Scrollable feed of all tweets by that user tagged #{game} #need #{cardX} (any of the 5 card hashtags) – tweet text replaced by icons This user’s details: photo, name, handle, location, and follow status Follow button (grey if you’re already following the user) Joe Lee @jlee 5m

12. Game logo Farhad Manjoo @fmanjoo follows you San Francisco Finalize your Offer.@fmanjoo.@fmanjoo Playing #{sponsor} #{game} at #{event}. Will #trade my #{card4} for #{card1}! Join the game {bit.ly}.@fmanjoo.@fmanjoo Playing #{sponsor} #{game} at #{event}. Will #trade my #{card4} for #{card1}! Join the game {bit.ly} Send Offer Game logo Farhad Manjoo @fmanjoo follows you San Francisco Farhad Manjoo @fmanjoo 2m Farhad Manjoo @fmanjoo 4m Farhad Manjoo @fmanjoo 5m When ‘Send Offer’ is pressed, either send the tweet or first OAuth if not already auth’ed (as in slide 8) Clicking a post on the user feed goes to offer page: Editable offer text; card #s based on card icon initially selected (slide 6) and user feed post selected (this slide)

13. After tweet sent, return to home screen w/ bottom message Your Tweet Has Been Sent! Game logo $1000 up for grabs $1000 up for grabs ? This message should disappear in 3 seconds then be replaced with normal announcements

14. Clicking on flaming icon goes to find/tell page w/ extra section Game logo $1000 up for grabs $1000 up for grabs ? Most recent announcement Game logo Share or find #{card4} Tell people you have or need #{card4} Find people who have #{card4} People who need #{card4}: Pictures of most recent 4 people that have tweeted #{game} #need #{card4}

15. Game logo Share or find #{card4} Tell people you have or need #{card4} Find people who have #{card4} People who need #{card4}: Game logo Farhad Manjoo @fmanjoo follows you San Francisco Farhad Manjoo @fmanjoo 2m Scrollable feed of all tweets tagged #{game} #need #{cardX} (whichever card is flaming) – tweet text replaced by icons Clicking anywhere on the extra section goes to needing page: Steve Jones @sjones 2m Frank McK @fmck 3m Joe Lee @jlee 5m NOTE: slides 15-17 (they need) are the reverse of slides 10-12 (they have)

16. Game logo Farhad Manjoo @fmanjoo follows you San Francisco Farhad Manjoo @fmanjoo 2m Farhad Manjoo @fmanjoo 4m Clicking a post on needing page goes to a filtered user feed: Game logo Farhad Manjoo @fmanjoo follows you San Francisco Farhad Manjoo @fmanjoo 2m Steve Jones @sjones 2m Frank McK @fmck 3m Joe Lee @jlee 5m Scrollable feed of all tweets by that user tagged #{game} #have #{cardX} (any of the 5 card hashtags) – tweet text replaced by icons

17. Game logo Farhad Manjoo @fmanjoo follows you San Francisco Finalize your Offer.@fmanjoo.@fmanjoo Playing #{sponsor} #{game} at #{event}. Will #trade my #{card4} for #{card5}! Join the game {bit.ly}.@fmanjoo.@fmanjoo Playing #{sponsor} #{game} at #{event}. Will #trade my #{card4} for #{card5}! Join the game {bit.ly} Send Offer Game logo Farhad Manjoo @fmanjoo follows you San Francisco When ‘Send Offer’ is pressed, either send the tweet or first OAuth if not already auth’ed (as in slide 8) Clicking a post on the user feed goes to offer page: Editable offer text; card #s based on card icon initially selected (slide14) and user feed post selected (this slide) Farhad Manjoo @fmanjoo 2m Farhad Manjoo @fmanjoo 4m

18. After tweet sent, return to home screen w/ bottom message Your Tweet Has Been Sent! Game logo $1000 up for grabs $1000 up for grabs ? This message should disappear in 3 seconds then be replaced with normal announcements

19. Game logo Winners so far: Appirio @appirio 1m Appirio @appirio 10m The #{game} #prize is now $1000. Play the game at #{event} {bit.ly} The #{game} #prize is now $5000. Play the game at #{event} {bit.ly} Farhad Manjoo @fmanjoo Prize Updates Steve Jones @sjones Most recent 2-3 (whatever fits) tweets by @{admin} tagged #{game}#prize Most recent 2-3 (whatever fits) people whose twitter handles were mentioned in a tweet by @{admin} tagged #{game} #winner + 25 others Game logo $1000 up for grabs $1000 up for grabs ? Most recent announcement Clicking on Prize icon goes to winners/prize updates page:

20. Click photo to open Twitter in browser and go to profile. Open Twitter in browser and go to tweet Game logo Winners so far: Appirio @appirio 1m Appirio @appirio 10m The #{game} #prize is now $1000. Play the game at #{event} {bit.ly} The #{game} #prize is now $5000. Play the game at #{event} {bit.ly} Farhad Manjoo @fmanjoo Prize Updates Steve Jones @sjones + 25 others Go to winners page (next slide)

21. Click photo to open Twitter in browser and go to profile. Scrollable list of all winners: everyone whose twitter handles were mentioned in a tweet by @{admin} tagged #{game} #winner Order feed by time of winner tweet, most recent at bottom Game logo Farhad Manjoo @fmanjoo follows you San Francisco Steve Jones @sjones does not follow you San Francisco Frank McK @fmck follows you Denver Joe Lee @jlee follows you San Jose Winners so far: Winners page

22. Game logo Appirio @appirio 1m Appirio @appirio 10m #{game} #news Card giveaway at 4pm. Come to Appirio booth. Play the game #{event} {bit.ly} Looking for #{card_1}? Come to Appirio’s session at 2pm. #{game} #news. Play the game at #{event} {bit.ly} Announcements @{admin} tweets tagged #{game} #news Touching a tweet opens Twitter in browser and goes to the tweet Game logo $1000 up for grabs $1000 up for grabs ? Most recent announcement Clicking bottom news bar goes to announcements page NOTE: in the news bar, strip off #{game} and #{news} hastags, OK to truncate long tweets

23. Game logo $1000 up for grabs $1000 up for grabs ? Most recent announcement Clicking top logo goes to Info Page Game logo Welcome to {game}, a mobile and social game created for {event} by {sponsor} using CloudSpokes. The objective of the game is to collect all five cards shown below. Those who do will be richly rewarded. Tell your friends about it! Thanks for playing twitter and facebook share buttons go to pre- configurable tweets with {bitly}