Confirmed users, Bureaucrats and Sysops emeriti
3,599
edits
Labs/The Coop: Difference between revisions
Jump to navigation
Jump to search
no edit summary
No edit summary |
No edit summary |
||
| Line 45: | Line 45: | ||
== Design == | == Design == | ||
=== Interaction Design === | |||
: Like a real chicken coop, the UI will have boxes in which each of a user's friends will live. The boxes will be filled with an avatar (drawn from flickr by default?) and represent that friend. | : Like a real chicken coop, the UI will have boxes in which each of a user's friends will live. The boxes will be filled with an avatar (drawn from flickr by default?) and represent that friend. | ||
* Icons in the box will indicate new/recent content | * Icons in the box will indicate new/recent content | ||
| Line 65: | Line 59: | ||
** etc, etc. | ** etc, etc. | ||
== Initial Wireframes == | === Initial Wireframes === | ||
;Wireframe/Mockups | ;Wireframe/Mockups | ||
: These are initial thoughts on how we might present the UI for The Coop. Of course we can skin it differently, and future mockups will add more detail highlighting the interaction of dragging content onto another user's face (ex: pop a little DHTML layer that showed a preview of the content you were sharing and let you comment) but these give a basic idea. Nothing's set in stone, hopefully this will stimulate future ideas and discussion: | : These are initial thoughts on how we might present the UI for The Coop. Of course we can skin it differently, and future mockups will add more detail highlighting the interaction of dragging content onto another user's face (ex: pop a little DHTML layer that showed a preview of the content you were sharing and let you comment) but these give a basic idea. Nothing's set in stone, hopefully this will stimulate future ideas and discussion: | ||
| Line 76: | Line 70: | ||
<small>(all images used in these mockups are Creative Commons licensed with the exception of the image of Elfina, which was totally lifted from [http://www.penny-arcade.com/comic/2006/02/22 this Penny Arcade cartoon])</small> | <small>(all images used in these mockups are Creative Commons licensed with the exception of the image of Elfina, which was totally lifted from [http://www.penny-arcade.com/comic/2006/02/22 this Penny Arcade cartoon])</small> | ||
=== beltzner's thoughts on the wireframes === | ==== beltzner's thoughts on the wireframes ==== | ||
* More faces in less space is probably better | * More faces in less space is probably better | ||
* Different zoom modes is probably best | * Different zoom modes is probably best | ||
| Line 83: | Line 77: | ||
* The ability to attach a comment is a must, but needs to be lightweight | * The ability to attach a comment is a must, but needs to be lightweight | ||
* We could probably do some fun gesture based UI here, too | * We could probably do some fun gesture based UI here, too | ||
=== Influences === | |||
: Our design was influenced by Chris Messina's mockup for the unimplemented [http://flickr.com/photos/factoryjoe/102993817/in/set-72057594068514811/ "People in the Browser"] feature, with a horizontal bar containing avatars for a user's friends, and icons overlaid on those avatars to indicate the presence of new content: | |||
: http://people.mozilla.com/~beltzner/images/people-in-the-browser-idea.jpg | |||
: <small> [http://flickr.com/photos/factoryjoe/102993817/in/set-72057594068514811/ mockup originally by Chris Messina]</small> | |||
== Implementation Thoughts == | == Implementation Thoughts == | ||