1. Discussion Wireframes
For Spotlight 3.5

2. Change Log v1.0 – 11/4/2008 First Draft

3. Contents Overview slide 4 Universal Usage slide 10 Tagging slide 13
Audience slide 16
Discovery slide 22
Display slide 27
Dynamic Display slide 35
Drill Down slide 39
Reply & Comment slide 41
Counters slide 43
Collaboratelet slide 47
Social Profile Summary slide 54
Conclusions slide 57

4. Overview

5. Overview
We can mix in forums to the lists of bookmarks that are found throughout the application.
New Bookmarks

6. Overview
We can mix in forums to the lists of bookmarks that are found throughout the application.
New Bookmarks
New Dialogs

7. Overview
We can mix in forums to the lists of bookmarks that are found throughout the application.
New Bookmarks
New Dialogs
New System Message

8. Overview
We can mix in forums to the lists of bookmarks that are found throughout the application.
New Bookmarks
New Dialogs
New System Message
Replies to dialog

9. Overview
We can mix in forums to the lists of bookmarks that are found throughout the application.
New Bookmarks
New Dialogs
New System Message
Replies to dialog
Comment on bookmark

10. Universal Input

11. Universal Input
The input box is vague enough to allow questions, discussions or notes.

12. Universal Input
The input box is vague enough to allow questions, discussions or notes.
Optionally we can flag the message for special cases such as “important”.

13. Universal Input
The input box is vague enough to allow questions, discussions or notes.
Optionally we can flag the message for special cases such as “important”.
Because the input is consistent we can display the form on the page at all times making it easy to use.

14. Tagging

15. Tagging
Everything is tagged for organizational and discovery purposes.

16. Tagging
Everything is tagged for organizational and discovery purposes.
The tag cloud acts as a filter for the discussions as well as the bookmarks.

17. Audience

18. Audience
The message is put where it originated. In this case we are Enterprise-wide.

19. Audience
The message is put where it originated. In this case we are Enterprise-wide.
Navigate to groups to write to them.

20. Audience
The message is put where it originated. In this case we are Enterprise-wide.
Navigate to groups to write to them.
Navigate to people to write directly to them.

21. Audience
The message is put where it originated. In this case we are Enterprise-wide.
Navigate to groups to write to them.
Navigate to people to write directly to them.
There could be a persistent checkbox or button to allow a private note.

22. Audience
Note – we may also explore a persistent launch mechanism which will always present the user with a “To” field. This may replace the embedded form which you see here.

23. Discovery

24. Discovery
“All bookmarks” becomes “Enterprise-wide activity” and can appear on the homepage or off the “My Activity” tab.

25. Discovery
“All bookmarks” becomes “Enterprise-wide activity” and can appear on the homepage or off the “My Activity” tab.
In My Groups, there will be a link to “Discover Groups” which links to All groups.

26. Discovery
“All bookmarks” becomes “Enterprise-wide activity” and can appear on the homepage or off the “My Activity” tab.
In My Groups, there will be a link to “Discover Groups” which links to All groups.
In My Connections there will be a link to “Discover People” which will link to All People.

27. Discovery All bookmarks is the same as enterprise-wide activity.
All bookmarks is the same as enterprise-wide activity.
This activity shows up on the home page.
In My Groups, there will be a link to “Discover Groups” which links to All groups.
In My Connections there will be a link to “Discover People” which will link to All People.
The links are removed from the utility nav.

28. Display

29. Display
All activity will be made uniform.

30. Display All activity will be made uniform.
All activity will be made uniform.
The type will appear on the left to facilitate quick scanning (studies show scanning works best with left alignment).

31. Display All activity will be made uniform.
All activity will be made uniform.
The type will appear on the left to facilitate quick scanning (studies show scanning works best with left alignment).
Who is the next in sequence – showing name, title and social score (determined by user votes).

32. Display All activity will be made uniform.
All activity will be made uniform.
The type will appear on the left to facilitate quick scanning (studies show scanning works best with left alignment).
Who is the next in sequence – showing name, title and social score (determined by user votes).
A clear message written by the user (could be bookmark title).

33. Display All activity will be made uniform.
All activity will be made uniform.
The type will appear on the left to facilitate quick scanning (studies show scanning works best with left alignment).
Who is the next in sequence – showing name, title and social score (determined by user votes).
A clear message written by the user (could be bookmark title).
Where it was saved to.

34. Display All activity will be made uniform.
All activity will be made uniform.
The type will appear on the left to facilitate quick scanning (studies show scanning works best with left alignment).
Who is the next in sequence – showing name, title and social score (determined by user votes).
A clear message written by the user (could be bookmark title).
Where it was saved to.
When it was saved.

35. Display All activity will be made uniform.
All activity will be made uniform.
The type will appear on the left to facilitate quick scanning (studies show scanning works best with left alignment).
Who is the next in sequence – showing name, title and social score (determined by user votes).
A clear message written by the user (could be bookmark title).
Where it was saved to.
When it was saved.
Actions:
--Vote it up (or cancel vote)
--Reply
--Get a copy of the bookmark
--Etc…

36. Dynamic Display

37. Dynamic Display
Can mouse over the icon to get the original post which replies belong to.

38. Dynamic Display
Can mouse over the icon to get the original post which replies belong to.
Can mouse over the person to get their social profile summary.

39. Dynamic Display
Can mouse over the icon to get the original post which replies belong to.
Can mouse over the person to get their social profile summary.
Can click the expand icons to show the entire text (which can be longer than the space available).

40. Drill Down

41. Drill Down
Can click the item to drill down to a page that shows the entire thread (like traditional forums).

42. Reply & Comment

43. Reply & Comment
Clicking reply will expand the row revealing a set of boxes for the message, tags, flags and button.
Note: This can optionally be a javascript dialog box.

44. Counters

45. Counters
The reply button has a count of how many replies were made in this thread.

46. Counters
The reply button has a count of how many replies were made in this thread.
The like-it button has a count of how many likes post has.

47. Counters
The reply button has a count of how many replies were made in this thread.
The like-it button has a count of how many likes post has.
The author has a count of how many contributions they have made.

48. Collaboratelet (Thing-a-majig)

49. Collaboratelet (Thing-a-majig)
We can add a button to the toolbar which invokes a Collaboratelet.

50. Collaboratelet (Thing-a-majig)
We can add a button to the toolbar which invokes a Collaboratelet.
This is optional, can be: Say, Ask a Question, Write a Note

51. Collaboratelet (Thing-a-majig)
We can add a button to the toolbar which invokes a Collaboratelet.
This is optional, can be: Say, Ask a Question, Write a Note
Directory will allow choosing which group this gets displayed in, or if it goes directly to a person or set of people + groups.

52. Collaboratelet (Thing-a-majig)
We can add a button to the toolbar which invokes a Collaboratelet.
This is optional, can be: Say, Ask a Question, Write a Note
Directory will allow choosing which group this gets displayed in, or if it goes directly to a person or set of people + groups.
Marking as urgent will make the message stand out in red. It may be configured to give an notification to the audience.
Deadlines are shown on messages to encourage replies.

53. Collaboratelet (Thing-a-majig)
We can add a button to the toolbar which invokes a Collaboratelet.
This is optional, can be: Say, Ask a Question, Write a Note
Directory will allow choosing which group this gets displayed in, or if it goes directly to a person or set of people + groups.
Marking as urgent will make the message stand out in red. It may be configured to give an notification to the audience.
This is optional, can display deadlines to encourage replies.

54. Collaboratelet (Thing-a-majig)
We can add a button to the toolbar which invokes a Collaboratelet.
This is optional, can be: Say, Ask a Question, Write a Note
Directory will allow choosing which group this gets displayed in, or if it goes directly to a person or set of people + groups.
Marking as urgent will make the message stand out in red. It may be configured to give an notification to the audience.
This is optional, can display deadlines to encourage replies.
Character limits are shown and counted down as the user types.

55. Social Profile Summary

56. Social Profile Summary
The social profile summary can have a count of all contributions and a link to them.

57. Social Profile Summary
The social profile summary can have a count of all contributions and a link to them.
There is just enough here to sell the profile to the user, show what is interesting enough for them to click to the full profile.

58. Conclusions

59. Conclusions
This is the least destructive way to get collaboration into the application
We don’t have to re-organize the application
We can treat collaborative messages like bookmarks, and vice versa
By mixing collaboration and bookmarks we preserve the original purpose and avoid overshadowing it

60. User Interface Guidelines Nelson M. Wiggins
Connectbeam
User Interface Guidelines
Nelson M. Wiggins