OurTime Redesign - Homepage

Transcription

1 OurTime Redesign - Homepage Last Updated: May 11, 2012 Objective Redesign homepage to better engage users and get them to access their communications. Expected Results Higher usage of features mentioned above. Change Tracker Date Purpose Description 05/11/2012 Initial Version Business Requirements DESIGN & FUNCTIONALITY The homepage is composed of 7 modules and 2 ad units 1. Profile Module Contains the following data & functionality: a. Username i. Links to member s profile edit page b. Profile Link i. Links to member s profile edit page c. Photos Link i. Links to add / edit photos page d. Profile photo / Silhouette i. If no approved main profile photo, display gender- specific silhouette ii. Links to add / edit photos page e. Profile completion status i. Profile completion percentage is based a sum of completed steps. 1. If all steps are complete, display 100% ii. Profile completion next steps in priority order for display 1. Photo Upload a. Copy: Upload a photo i. Link to Photo upload page

2 b. Value: +40% 2. Personal Info a. Copy: Personal info i. Link to Profile Edit b. Value: +10% i. NOTE: This is increased in the new design as audio/video have been removed from site experience and should no longer be used in calculation 3. Personality a. Copy: Personality i. Link to Profile Edit b. Value: +15% 4. Greeting a. Copy: Finish greeting i. Link to profile edit b. Value: +35% iii. Display the next available step in next steps space If no next step available, display Profile Complete! with no additional % shown iv. Display the 2 nd next available step in next steps space If no next step available, suppress f. New items list i. Display the number of unread/never viewed items in this format: 1. You have received X chats, X messages, X flirts, X likes, X comments, X yeses, X favorites, X views. 2. Copy should always begin with You have received 3. Number and name should be a single link. (i.e. 12 messages should link) ii. Punctuation between new items 1. If another follows place a, in between. 2. If the last available place a. at the end. iii. List out the following communications in the order listed below. 1. Chats a. 0 unread: Suppress b. 1 unread: X chat c. >1 unread: X chats d. If paid, X chat links to inbox FILTERED FOR CHATS e. If free, X chats leads to upgrade then to inbox FILTEED FOR CHATS f. New items are cleared when read 2. Messages a. 0 unread: Suppress b. 1 unread: X message

3 c. >1 unread: X messages d. If paid, X messages links to inbox e. If free, X messages leads to upgrade then to inbox f. New items are cleared when read 3. Flirts a. 0 unread: Suppress b. 1 unread: X flirt c. >1 unread: X flirts d. If paid, X flirts links to Inbox FILTERED FOR FLIRTS e. If free, X flirts leads to upgrade then to Inbox FILTERED FOR FLIRTS f. New items are cleared read 4. Likes a. 0 unread: Suppress b. 1 unread: X like c. >1 unread: X likes d. If paid, X likes links to Inbox FILTERED FOR LIKES e. If free, X likes leads to upgrade then to Inbox FILTERED FOR LIKES f. New items are cleared when read 5. Comments a. 0 unread: Suppress b. 1 unread: X comment c. >1 unread: X comments d. If paid, X comments links to Inbox FILTERED FOR COMMENTS e. If free, X comments leads to upgrade then to Inbox FILTERED FOR COMMENTS f. New items are cleared when read 6. Yes Votes a. 0 new: Suppress b. 1 new: X yes c. >1 new: X yeses d. If paid, X yeses links to Yes Votes list page (/connect/yesvotes) e. If free, X yeses links to upgrade page then to Yes Votes list page f. New items are cleared when yes votes page is viewed 7. Favorite a. 0 new: Suppress b. 1 new: X favorite c. >1 new: X favorites d. If paid, X favorites links to Favorites list page (/connect/favorites)

4 e. If free, X favorites links to upgrade page then to Favorites list page f. New items are cleared when favorites page is viewed 8. Views a. 0 new: Suppress b. 1 new: X view c. >1 new: X views d. Both paid and free, Views links to Views list page (/connect/views) e. New items are cleared when views page is viewed iv. If there are 0 new items the whole sentence should be suppressed g. Communication Links i. Inbox link 1. Shows total (read and unread) number of items in inbox (sum of incoming Chats, Messages, Flirts, Likes, Comments) 2. Links to Inbox ii. Connect link 1. Shows total (new and not new) number of items in Connect (sum of incoming Yes Votes, Favorites, Views) 2. Links to Connect main page 2. Real Time Notification Module a. For the redesign phase 1, this button simply links to the all notifications page. 3. Members Module (My Favorites, Remember To ) Contains the following data & functionality with tabs to navigate between the two panes. Page should not reload to switch between tabs. a. My Favorites i. List of 3 entries Most recent 3 favorites the user has saved as a favorite 1. Display rules a. Display favorites that have not been communicated with at top of list b. If more than one member that has not communicated with, display most recently favorited first c. If more than one member has communicated been communicated with, display most recently favorited first d. Display will be updated with new members upon page display. i. The module will not be updated while member is viewing page 2. Profile Photo a. Links to member profile 3. Online Indicator

5 a. Dot is colored if member is online, grey if offline 4. Username a. Links to member profile. 5. Age and location displayed as: Age Location a. Use standard [location] i. If in US or Canada, City, ST ii. If outside US, City, Country 6. Days since you added favorite a. Use standard [timeframe] i. If days since action = 0, display Today ii. If days since action = 1, display Yesterday iii. If days since action >1, display <#> days ago 7. Favorite Star a. Should be a colored active star to show favorite status b. If member has been marked as favorite, star is Yellow i. If star is clicked, member is removed from favorites list and star is turned White ii. Member will continue to show in favorites module c. If member has not been marked as favorite, start is White i. If star is clicked, member is marked as favorite and star is turned Yellow 8. Flirt button a. Sends 1- click flirt b. Confirmation i. Copy is displayed over favorite, flirt and message icon buttons. ii. Copy fades out over 3 seconds, revealing the icon buttons it had covered. iii. Copy: Flirt sent! 9. button a. Links to compose message page 10. View all Favorites a. Links to the incoming Favorites page 11. For members with <3 saved favorites, display favorites how- to: a. If member only has 2 saved favorites, display how- to copy in position 3. b. If member only has 1 saved favorite, display how- to copy in position 2 and suppress position 3. c. If member has 0 saved favorites, display how- to copy in position 1 and suppress positions 2 and 3. d. Module height does not change based on suppressed items constant height.

6 e. Copy: Simply click the star for any member and you will save them to your favorites so you can quickly find them again later. Then send them messages when you re ready! b. Remember To i. List of 3 entries incoming to the user 1. Communication types consist of chats, messages, flirts, comments, likes, yes votes, favorites, views. 2. Display rules a. Display members that have sent a communication and no communication has been sent since that communication was originally received b. If more than 1 type of communication has been received from a single member, only display the most recent communication. c. If communication has been received from any favorite, prioritize to top of list. d. Member should not appear to the member twice in the same display. (i.e if a member sent a like and a comment and that was the last communication received, only the comment should be displayed as it would have been received AFTER the like) ii. Display Paid members 1. Profile Photo a. Links to member profile 2. Online Indicator a. Dot is colored if member is online, grey if offline 3. Username a. Links to member profile. 4. Age and location displayed as: Age Location a. If in US or Canada, City, St b. If outside US, City, Country 5. Copy Based on communication type: a. Chat Sent you a chat request [timeframe] Reply b. Message Sent you a message [timeframe] Reply c. Flirts Sent you a flirt [timeframe] Reply d. Comments Commented on your photo [timeframe] Reply e. Likes Liked your photo <timeframe> Reply f. Yes Votes Said yes to you [timeframe] Reply

7 g. Favorites Saved you as a favorite [timeframe] Reply h. Views Viewed you [timeframe] Reply 6. Favorite Star a. If member has been marked as favorite, star is Yellow i. If star is clicked, member is removed from favorites list and star is turned X color ii. Member will continue to show in favorites module b. If member has not been marked as favorite, start is X i. If star is clicked, member is marked as favorite and star is turned Yellow 7. Flirt button a. Sends 1- click flirt b. Confirmation i. Copy is displayed over favorite, flirt and message icon buttons. ii. Copy fades out over 3 seconds, revealing the icon buttons it had covered. iii. Copy: Flirt sent! 8. button a. Links to compose message page 9. View all Reminders a. Links to All Notifications page 10. For members with <3 saved incoming communications, display how- to: a. If member only has 2 communications, display how- to copy in position 3. b. If member only has 1 communication, display how- to copy in position 2 and suppress position 3. c. If member has 0 communications, display how- to copy in position 1 and suppress positions 2 and 3. d. Module height does not change based on suppressed items constant height. e. Copy: Don t forget to reply to other members that communicate with you. You never know which will be the one - they are waiting to hear from you! iii. Display Free members 1. Profile Photo a. Links to member profile 2. Online Indicator

8 a. Dot is colored if member is online, grey if offline 3. Username a. Links to member profile. 4. Age and location displayed as: Age [Location] a. If in US or Canada, City, St b. If outside US, City, Country 5. Copy Based on communication type: a. Free members are only shown Views b. Views Viewed you [timeframe] Reply i. Reply links to Upgrade page then read/compose message page 6. Favorite Star a. If member has been marked as favorite, star is Yellow i. If star is clicked, member is removed from favorites list and star is turned White ii. Member will continue to show in favorites module b. If member has not been marked as favorite, start is White i. If star is clicked, member is marked as favorite and star is turned Yellow 7. Flirt button a. Sends 1- click flirt b. Confirmation i. Copy is displayed over favorite, flirt and message icon buttons. ii. Copy fades out over 3 seconds, revealing the icon buttons it had covered. iii. Copy: Flirt sent! 8. button a. Links to Upgrade then Compose Message page 9. View all Reminders a. Links to All Notifications page 10. For members with <3 saved incoming communications, display how- to: a. If member only has 2 communications, display how- to copy in position 3. b. If member only has 1 communication, display how- to copy in position 2 and suppress position 3. c. If member has 0 communications, display how- to copy in position 1 and suppress positions 2 and 3. d. Copy: Don t forget to reply to other members that communicate with you. You never know which will be the one - they are waiting to hear from you!

9 4. I m Interested Module a. Member selection/display logic is the same as current implementation b. Left arrow goes to previous photo i. From 100 results pulled, left arrow uses result 100, then 99, 98, etc. ii. Previous photo is loaded and displayed faded with gradient overlay on left side c. Right arrow uses current live functionality to go to next photo i. From 100 results pulled, right arrow uses result 2, then 3, 4, etc. ii. Next photo is loaded and displayed faded with gradient overlay on right side d. Save button adds member to favorites i. If saved button is clicked 1. Member is saved to favorites 2. Next member is loaded 3. If previous member is loaded, show accurate favorite status with yellow or white favorite indicator. e. The photo links to the member s profile page f. Try it now links to full I m Interested page 5. Community Updates Module a. Logic is in WI b. Need popup design. 6. Next Steps Module a. This is detailed in a separate WI. WI is not created yet but this WI will be updated when it is available. 7. Today s Matches Module a. Entire banner clicks through to today s matches page b. 3 profile silhouettes i. Silhouettes for Men ii. Silhouettes for Women c. The silhouette for each of Today s Matches has an interest beneath it i. The interest is pulled from Interests matching 1. Select from interest 1 if available, else interest 2, else interest 3 2. Display as Loves [interest] ii. If 0 interests available, randomly choose between 1. Display as Has [eyecolor] eyes 2. Display as Has [haircolor] hair iii. If no interests or eye color available, suppress d. If user s Today s Matches are all completed, suppress entire banner e. If there are no Today s Matches available, suppress entire banner 8. New Members in My Area Module

10 a. Use existing logic from New Members in my Area (WI ) i. If no new members are available use external search to load gender specific and location specific results to populate. b. 9 members are shown. i. Pulled members 1-3 are placed in large image spaces ii. Pulled members 4-9 are placed in small image spaces c. Clicking photo links to member s profile d. If member clicks on Search Now, the member should land on search results and, if available for that member, with the New Members sort option selected and visible in the sort selection drop down 9. Stories Module Contains the following data & functionality: a. Success Stories Abstract i. Use current logic to pull success stories ii. PSD has layers to show this tab b. Related Articles i. Use current logic to pull related articles ii. PSD has layers to show this tab 10. Rectangle Ad Unit a. 300x100 ad unit 11. Half Page Ad Unit a. Display a 300x600 ad unit. i. If a 300x600 is not available, display a 300x250 ad