Home screenNotes:-Inbox & Home icon on the bottom bar                          janaki_krishnan_iyer20-Status update re-thi...
Home screen               janaki_krishnan_iyer20                                                        Mute              ...
Friends’ ListNotes:-Inbox & Home icon on the bottom bar                                                               10  ...
Friends’ List                                                       10                                                    ...
Friends’ ListNotes:-Buzz multiple friends should be allowed                                                               ...
Inbox10 10                                               Check new messages          Inbox options                        ...
Inbox                                                    Notes:    10                                              -Instea...
Inbox    10     10              Inbox options               From: Meena                                        3 min ago ...
Inbox    10     10               Inbox options               From: Meena                                        3 min ago...
Message with picture(s)10                                                  10                                             ...
Message with audio  10   10                                            10                                                 ...
Message with audio  10   10                                          10                                                10 ...
Message with video10                                         10                                            10 10          ...
Message with all media                                             10                                              10     ...
Media carousel    The images will work as a           10                                         10carousel. Sideways swip...
Slideshow player             The image will progress to            the next one in the following                     condi...
Slideshow player                If the user touches the            slideshow, it will pause at the               image whi...
Slideshow player            When the slideshow comes to                  a video thumbnail, the            thumbnail will ...
Slideshow player            When the slideshow comes to                  a video thumbnail, the            thumbnail will ...
Gallery                            10                             10Most Recent postsFriends’s postsLast week’s popular po...
Post                                                          10                                                          ...
Compose message     10      10  Reply to:       Add recipients  Meena, Pooji, Brun..              History   Record voice  ...
Compose message   10                                           10                                                 10    10...
Compose message   10    10Reply to:       Add recipientsMeena, Pooji, Brun..             History                 (415 KB) ...
Compose message                                                      10                                                   ...
Upcoming SlideShare
Loading in...5
×

Touch screen porting

245

Published on

Touch Screen porting document for an existing mobile social network on smart phones & the web. This design document includes graphic UI Designs as well as design & porting specifications. Use cases & conditions have been laid out in detail. Guidelines for the developers are in place. The target phones for this app were non-apple touch screen bar sized devices.

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
245
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
5
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Touch screen porting

  1. 1. Home screenNotes:-Inbox & Home icon on the bottom bar janaki_krishnan_iyer20-Status update re-think – have the option ofvoice and other multi-media entry rightthere. Perhaps have the update status Optionsinstead of edit profile-Call message – Compose instead or probeto find out-Friends – how many online Components of the status message will display here like VTP, but these are buttons and The status message, Click will play the attached anywhere on this row will component in the central media bring up the compose player *****Check out new games in Fun stuff****** message screen Express yourself Update status Post to gallery Compose This is a carousel i.e. one Notes: -The inbox counter will show the new swipe of the finger brings messages which are in after the user lastforth more icons on this. We Looking for something? vewed them will store at least 6 more images for this one 010 Inbox Friends Communities Gallery
  2. 2. Home screen janaki_krishnan_iyer20 Mute Options Invite friends to RockeTalk Connectivity test About Help*****Check out new games in Fun stuff****** Log off Express yourself Update status Post to gallery ComposeLooking for something? Downloads Contests Settings Messengers
  3. 3. Friends’ ListNotes:-Inbox & Home icon on the bottom bar 10 10-The search bar has a search icon attached.Clicking on this icon will search thedatabase. Friends’ list options Meena  Profile Feels like killing someone….. Buzz Message Amit_rastogi Feels like killing someone….. GenE_RocKer Feels like killing someone….. Lovely_eyes Video status – click to view Anup Video & voice status - click to view Irfan_jafri 3 pictures in status – click to view Start typing a name to search Back 10 Home
  4. 4. Friends’ List 10 10 Friends’ list options Meena Thumbnails for the first ten  Profile Feels like killing someone…..friends will be shown here. When Buzz Messagethe user is on friend 05 – the next 5 will be downloaded. Amit_rastogi Feels like killing someone…..When someone is searching. All GenE_RocKer Feels like killing someone…..the cached photos will display, Lovely_eyes the uncached ones will not be Video status – click to view called. Anup Video & voice status - click to view Irfan_jafri 3 pictures in status – click to view Start typing a name to search Back 10 Home
  5. 5. Friends’ ListNotes:-Buzz multiple friends should be allowed 10 10-For the moment, buzz will be greyed out ifa person chooses multiple friends. If theuser clicks on it , it will display an errorsound. Friends’ list options Meena  Profile Feels like killing someone….. The status scrolls. When the user clicks on it, it plays When touched Buzz Message voice, or video in a slideshow format. Amit_rastogi Voice auto-plays Feels like killing someone….. when the friend is clicked. GenE_RocKer Feels like killing someone….. Lovely_eyes Video status – click to view Anup Video & voice status - click to view Irfan_jafri 3 pictures in status – click to view Start typing a name to search Back 10 Home
  6. 6. Inbox10 10 Check new messages Inbox options Outbox From: Meena 3 min ago To: You, Pooji, Brun.. Sent items Reply Message options Clear all messages Get my bookmarked Amit_rastogi messages Show blocked users GenE_RocKer Home Lovely_eyes Exit Anup Irfan_jafri Salilmaladkar ComposeBack Home
  7. 7. Inbox Notes: 10 -Instead of the block option 10 use the arrow function Inbox options Notes: -Inbox & Home icon on the bottom bar From: Meena 3 min ago -Multiple options especially delete only Profile To: You, Pooji, Brun.. show up when stuff is marked -Think of the place where you can have the delete button show up when stuff is marked Reply Friend options -Recommended – middle of the screen -Think about having the text open up right there if its only a text message Amit_rastogi -Have a pop up sayhing ‘Clik here to see prfile’ appear and go away on the person’s thumbnail image GenE_RocKer The profile button will appear and disappear when the row is clicked on. Lovely_eyes Anup Irfan_jafri These buttons will appear with a dissolve in effect once anything is ticked. The outline will glow orange and then settle to Salilmaladkar black so that the user’s gaze is riveted to them Compose The reply/reaply all function will not display.Back Home
  8. 8. Inbox 10 10 Inbox options From: Meena 3 min ago Profile To: You, Pooji, Brun..Hey guys..how about a party at myplace this weekend. I’ll arrange thefood. You guys get the booze. What say? If the message is only text, itLets call Raj and Gul as well. They’ve … will automatically open up the text panel right there in the inbox itself. If it has too much text to show in half the screen, then X characters will be shown with an expand button Reply Notes: Friend options -Inbox & Home icon on the bottom bar -Multiple options especially delete only show up when stuff is marked -Think of the place where you can have the Amit_rastogi delete button show up when stuff is marked -Recommended – middle of the screen -Think about having the text open up right Compose there if its only a text message -Have a pop up sayhing ‘Clik here to see prfile’ appear and go away on the person’s Back Home thumbnail image
  9. 9. Inbox 10 10 Inbox options From: Meena 3 min ago Profile To: You, Pooji, Brun.. If the message is only voice, it will open in the inbox itself. XX:XX The above panel will remain open even after the message has played. A flick of the finger Reply on this message will bring the previous inbox view back Friend options Notes: -Inbox & Home icon on the bottom bar -Multiple options especially delete only show up when stuff is marked -Think of the place where you can have the Amit_rastogi delete button show up when stuff is marked -Recommended – middle of the screen -Think about having the text open up right Compose there if its only a text message -Have a pop up sayhing ‘Clik here to see prfile’ appear and go away on the person’sBack Home thumbnail image
  10. 10. Message with picture(s)10 10 10 10 From: Meena 3 min ago From: Meena 3 min ago To: You, Pooji, Brun.. Profile To: You, Pooji, Brun.. Hello…what you doing? Have y.. Hello…what you doing? Reply all Reply Reply all ReplyBack 10 Home Back 10 Home Notes: This text scrolls by in a -The profile button can dissappear once its shwon on open readable speed. -If there is text give an expand button which will open up the text panel
  11. 11. Message with audio 10 10 10 10 From: Meena 3 min ago From: Meena 3 min ago Profile To: You, Pooji, Brun.. Profile To: You, Pooji, Brun..Hello…what you doing? Hello…what you doing? XX:XX XX:XX Reply all Reply Reply all Reply Back 10 Home Back 10 Home Case II - Audio on mute Case I - Audio auto-playing. Counter stopped XX:XX counter running
  12. 12. Message with audio 10 10 10 10 From: Meena 3 min ago From: Meena 3 min ago Profile To: You, Pooji, Brun.. Profile To: You, Pooji, Brun..Hello…what you doing? Hello…what you doing? Reply all Reply Reply all Reply Back 10 Home Back 10 Home Case III- Audio stops playing. Case IV – There is audio attached Counter panel slides back in leaving but not playing only the audio button
  13. 13. Message with video10 10 10 10 From: Meena 3 min ago From: Meena 3 min ago Profile To: You, Pooji, Brun.. Profile To: You, Pooji, Brun.. Hello…what you doing? Hello…what you doing? Have.. Reply all Reply Reply all ReplyBack 10 Home Back 10 Home
  14. 14. Message with all media 10 10 From: Meena 3 min ago Profile To: You, Pooji, Brun..Notes:-The bottom array where the otherthumbnails are appearing shouwl not bethere…make space for the text instead withthe expand button Hello…what you doing? Reply all Reply Back 10 Home
  15. 15. Media carousel The images will work as a 10 10carousel. Sideways swipe will blow up the next image. From: Meena 3 min ago Profile To: You, Pooji, Brun..The user can also drag an imageout of the line and bring it to the panel to blow up. Hello…what you doing? Reply all Reply Back 10 Home
  16. 16. Slideshow player The image will progress to the next one in the following conditions 1- .5 seconds have lapsed 2 – the user makes a swipe on the image. In each case, the image will be animated as it swipes across. Back
  17. 17. Slideshow player If the user touches the slideshow, it will pause at the image which is in focus. In this case a play button will appear again. The slideshow will start playing again if the user clicks on the play button or if he makes a swipe with his hand again. Back
  18. 18. Slideshow player When the slideshow comes to a video thumbnail, the thumbnail will behave exactly like an image. Until the user clicks on it. The moment a user clicks on the image, it will open the video player as on the next slide and start playing. Back
  19. 19. Slideshow player When the slideshow comes to a video thumbnail, the thumbnail will behave exactly like an image. Until the user clicks on it. The moment a user clicks on the image, it will open the video player as on the next slide and start playing. The player controls disappear after sometime and appear again in the following cases: 1- the video stops playing 2 - The user touches the screen Back
  20. 20. Gallery 10 10Most Recent postsFriends’s postsLast week’s popular posts Post Search Categories Home Back
  21. 21. Post 10 10 Ammit’s post For the media a display template will be created. And the rest of the RTML will show below Family pics, amit, me View slideshow (8 The RTML will be pics) In the RTML each linkscrolled through swipes Rate will be presented in the as well as the scroller form of a button with an Category: Bollywood isolation area around it with a big enough button to be able to be ------------------ to make sure that clicked and dragged Share post erroneous touches do ------------------ not take place Post Search Categories Home Back
  22. 22. Compose message 10 10 Reply to: Add recipients Meena, Pooji, Brun.. History Record voice Open camera Phone Gallery Tap here to enter text… Send Back 10 Home
  23. 23. Compose message 10 10 10 10 Add recipients Reply to: Add recipientsReply to:Meena, Pooji, Brun.. History Meena, Pooji, Brun.. History XX:XX of XX seconds recorded XX:XX sec (415 KB)Tap here to enter text… Tap here to enter text… Send Send Back 10 Home Back 10 Home
  24. 24. Compose message 10 10Reply to: Add recipientsMeena, Pooji, Brun.. History (415 KB) (185 KB left)Tap here to enter text… Send Click ‘n’ attach Back 10 Home
  25. 25. Compose message 10 10 10 10 Add recipients Reply to: Add recipientsReply to: History Meena, Pooji, Brun.. HistoryMeena, Pooji, Brun.. (415 KB) (52 KB) (133 KB left) (415 KB) (52 KB) (133 KB left)Tap here to enter text… Picture 02.jpg 2205200804.jpg 02/01/07 3:22 PM Picture 02.jpg 02/01/07 3:22 PM Send Picture 02.jpg 02/01/07 3:22 PM Send Attach Back 10 Home
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×