Sticky Note/Poster Module Mashup Design Proposal
34 views
Skip to first unread message
matty_x
May 7, 2010, 2:27:28 PM5/7/10
to Open Wonderland Forum
The sticky note module is surprisingly useful and versatile. We use it
like crazy. Even more useful and versatile would be if it supported
HTML and graphics, like the poster module does.
Imagining the design becomes challenging when you consider the
affordances of each. The sticky note module allows for simple editing,
no HTML needed. The poster module provides rich display of graphics
and text. Currently, they employ different usage paradigms... but I
think they could be synthesized with a mashup.
The idea I have for a mashup would allow for non-editable areas
defined with HTML and editable areas that function as the sticky note
module does now. I've tried to envision this idea in the below design
draft/mockup/use case.
I'd like to get some community input regarding desired features/
requirements. Below is the URL to a freely editable design draft.
Please feel free to add your comments and suggestions directly to the
shared document or add them to this forum thread.
http://docs.google.com/Doc?docid=0Aao7Mi2AKJ1PYWRqYmhxa2ZoMzdiXzExMWZkaHJjenpw&hl=en
Looking forward to everyone's feedback!
like crazy. Even more useful and versatile would be if it supported
HTML and graphics, like the poster module does.
Imagining the design becomes challenging when you consider the
affordances of each. The sticky note module allows for simple editing,
no HTML needed. The poster module provides rich display of graphics
and text. Currently, they employ different usage paradigms... but I
think they could be synthesized with a mashup.
The idea I have for a mashup would allow for non-editable areas
defined with HTML and editable areas that function as the sticky note
module does now. I've tried to envision this idea in the below design
draft/mockup/use case.
I'd like to get some community input regarding desired features/
requirements. Below is the URL to a freely editable design draft.
Please feel free to add your comments and suggestions directly to the
shared document or add them to this forum thread.
http://docs.google.com/Doc?docid=0Aao7Mi2AKJ1PYWRqYmhxa2ZoMzdiXzExMWZkaHJjenpw&hl=en
Looking forward to everyone's feedback!
Margaret Leber
May 7, 2010, 4:34:46 PM5/7/10
to openwon...@googlegroups.com
Interesting. Almost like forms support for Swing HTML.
Must...restrain...brain...of...death...nnnnnnngh....SCRIPTING!
(who said that?)
Must...restrain...brain...of...death...nnnnnnngh....SCRIPTING!
(who said that?)
Nicole Yankelovich
May 9, 2010, 12:03:59 AM5/9/10
to openwon...@googlegroups.com
Matty,
This looks extremely useful! My main wish for the sticky note portion is to have some minimal formatting ability akin to what's available in the Thunderbird email program:
You can't do too much, but you can at least do some simple formatting without having to write HTML code. So when you take control, you get a control panel like this in the HUD. If you decide to go this route, you can add an item to this HUD panel to change the overall color of the note, which would allow you to eliminate the "Change color" context menu item.
On the subject of the context menu, I suggest changing the wording of the "Set Text..." context menu item to "Configure Note..." because you're really doing a lot more than just setting text.
Also, I continually want to be able to resize sticky notes. Perhaps you could add a checkbox in the configure note mode to indicate if the note is resizable or not. I would make resizable the default.
While I like your concept of putting instructional text in the note when you create one, I worry that this makes the Rich Sticky Note much less useful as an ordinary sticky note. I would instead suggest having the default behavior be the sticky note behavior. In others words, have all Rich Sticky Notes pre-configured so that they already include the html code for the textarea. This would serve two purposes. Users could add Rich Sticky Notes and use them as sticky notes without the need for any configuration. Second, for those who did want to configure the notes, they would already have some html code in there that could be modified, including the all-important textarea code. When I use posters, the first thing I do is type in the basic html tempate:
<html>
<body>
</html>
</body>
Having the template already in there would definitely come in handy.
As for the instructions, perhaps you could put up a transitory message in the HUD with the instructions? Alternately, you could add an "I" for information icon to the editing palette. I think most people will notice the option to configure the note when they select "Take Control" to add or edit text.
From an aesthetic point of view, I would definitely want the background of the text area to be the same color as the background of the note when the note is being used as a simple sticky note. I'm not familiar enough with the textarea mark-up to know if this is easy or not. If it's just a matter of adding a color="yellow" parameter, I would put that in there for the default case. Having an invisible border would also be good (border="0"?), if that's possible.
Here's one last idea, which may or may not be a good one. It might be extremely useful to be able to edit the default Rich Sticky Note template so that whenever a user instantiates a note from the Insert --> Object dialog box, it looks a certain way. I may like the default to be something that looks like the original sticky note, but you may always want the notes on your server to be brainstorming templates or to have floral borders or to use a larger font and so on. A fairly easy way to do this is to have a control in the Configuration dialog to "apply to all sticky notes." While this is a nice feature, it is also a potentially dangerous operation which you might not want to make available to most end users. Perhaps a confirmation dialog explaining the impact of this change would do the trick. Or perhaps the user needs to enter the server administration password to make this change.
Thanks for taking the time to share your design idea!
Nicole.
This looks extremely useful! My main wish for the sticky note portion is to have some minimal formatting ability akin to what's available in the Thunderbird email program:
You can't do too much, but you can at least do some simple formatting without having to write HTML code. So when you take control, you get a control panel like this in the HUD. If you decide to go this route, you can add an item to this HUD panel to change the overall color of the note, which would allow you to eliminate the "Change color" context menu item.
On the subject of the context menu, I suggest changing the wording of the "Set Text..." context menu item to "Configure Note..." because you're really doing a lot more than just setting text.
Also, I continually want to be able to resize sticky notes. Perhaps you could add a checkbox in the configure note mode to indicate if the note is resizable or not. I would make resizable the default.
While I like your concept of putting instructional text in the note when you create one, I worry that this makes the Rich Sticky Note much less useful as an ordinary sticky note. I would instead suggest having the default behavior be the sticky note behavior. In others words, have all Rich Sticky Notes pre-configured so that they already include the html code for the textarea. This would serve two purposes. Users could add Rich Sticky Notes and use them as sticky notes without the need for any configuration. Second, for those who did want to configure the notes, they would already have some html code in there that could be modified, including the all-important textarea code. When I use posters, the first thing I do is type in the basic html tempate:
<html>
<body>
</html>
</body>
Having the template already in there would definitely come in handy.
As for the instructions, perhaps you could put up a transitory message in the HUD with the instructions? Alternately, you could add an "I" for information icon to the editing palette. I think most people will notice the option to configure the note when they select "Take Control" to add or edit text.
From an aesthetic point of view, I would definitely want the background of the text area to be the same color as the background of the note when the note is being used as a simple sticky note. I'm not familiar enough with the textarea mark-up to know if this is easy or not. If it's just a matter of adding a color="yellow" parameter, I would put that in there for the default case. Having an invisible border would also be good (border="0"?), if that's possible.
Here's one last idea, which may or may not be a good one. It might be extremely useful to be able to edit the default Rich Sticky Note template so that whenever a user instantiates a note from the Insert --> Object dialog box, it looks a certain way. I may like the default to be something that looks like the original sticky note, but you may always want the notes on your server to be brainstorming templates or to have floral borders or to use a larger font and so on. A fairly easy way to do this is to have a control in the Configuration dialog to "apply to all sticky notes." While this is a nice feature, it is also a potentially dangerous operation which you might not want to make available to most end users. Perhaps a confirmation dialog explaining the impact of this change would do the trick. Or perhaps the user needs to enter the server administration password to make this change.
Thanks for taking the time to share your design idea!
Nicole.
Margaret Leber
May 9, 2010, 1:03:19 AM5/9/10
to openwon...@googlegroups.com
On Sun, May 9, 2010 at 12:03 AM, Nicole Yankelovich
<nic...@yankelovich.ws> wrote:
> This looks extremely useful! My main wish for the sticky note portion is to have some minimal formatting ability akin to what's available in the > Thunderbird email program: You can't do too much, but you can at least do some simple formatting without having to write HTML code...
I agree it's cumbersome to write HTML by hand. Nicole's formatting
toolbar idea is great.
Not everybody will be in a position to take advantage of the somewhat
geeky tool I'm about to mention: it's called "zen coding"...check it
out:
http://code.google.com/p/zen-coding/
<nic...@yankelovich.ws> wrote:
> This looks extremely useful! My main wish for the sticky note portion is to have some minimal formatting ability akin to what's available in the > Thunderbird email program: You can't do too much, but you can at least do some simple formatting without having to write HTML code...
I agree it's cumbersome to write HTML by hand. Nicole's formatting
toolbar idea is great.
Not everybody will be in a position to take advantage of the somewhat
geeky tool I'm about to mention: it's called "zen coding"...check it
out:
http://code.google.com/p/zen-coding/
Josmas Flores
May 9, 2010, 2:28:17 PM5/9/10
to openwon...@googlegroups.com
this looks very cool!
would it also be interesting to have an 'Export' option in the menu? you can put together a lot of very valuable info in a collaborative way that you might want to use after the session. Maybe a menu item that allows you to 'save as html' into your hard drive, similar to what browsers do?
talking about browsers... has anyone tried to share firefox and edit in a wiki? it might be too intensive for the network/server but some of the ideas discussed above would be there already for free.
cheers,
Jos
Bern
May 10, 2010, 4:37:29 AM5/10/10
to Open Wonderland Forum
Matty
hey, nice idea. Just a caveat... from what I remember, the
implementation of the poster module _requires_ a preview. Non geeks
might want to skip the gory details:
The poster module uses a swing JLabel to render the html on to an
image, which is then used as the texture for the 3d poster. To render
a JLabel, AFAIK, you need to have a connection to AWT, which means
that the JLabel has to be a component in a swing JFrame that's
connected to a display. (Which is why there's some awkward code in the
poster that deals with updates from the server.)
cheers
Bernard
> http://docs.google.com/Doc?docid=0Aao7Mi2AKJ1PYWRqYmhxa2ZoMzdiXzExMWZ...
hey, nice idea. Just a caveat... from what I remember, the
implementation of the poster module _requires_ a preview. Non geeks
might want to skip the gory details:
The poster module uses a swing JLabel to render the html on to an
image, which is then used as the texture for the 3d poster. To render
a JLabel, AFAIK, you need to have a connection to AWT, which means
that the JLabel has to be a component in a swing JFrame that's
connected to a display. (Which is why there's some awkward code in the
poster that deals with updates from the server.)
cheers
Bernard
Morris Ford
May 10, 2010, 8:12:19 AM5/10/10
to openwon...@googlegroups.com
Just to add a little to the discussion:
Attached are the poster module code that has the scripting control extensions and a stickynote module that I made HUGE for use in classes to display logs/traces/etc.
Morris
Attached are the poster module code that has the scripting control extensions and a stickynote module that I made HUGE for use in classes to display logs/traces/etc.
Morris
Nussbaum-Jones, Nina
May 10, 2010, 8:47:40 AM5/10/10
to openwon...@googlegroups.com
Thanks Morris!!!
matty_x
May 11, 2010, 12:51:50 PM5/11/10
to Open Wonderland Forum
Thanks all for the feedback so far. I'll be incorporating this into a
revision towards the end of the week.
I will also be thinking about 2 new features, and wanted to get some
opinions/ideas before I try to incorporate them into the design:
pagination and theming.
Pagination:
Since the Rich Sticky Note will support graphics and styled text, it
could in theory be used to create multi-paged interactive content.
This would be in some ways similar to functionality of the PDF viewer
and/or PDF spreader. The primary difference would be that users could
add text to slides and edit them in world.
Theming:
Colors for sticky notes are great. But what about having pre-built
themes or skins for the sticky notes? I realize that adding a
background image may be possible with the current design, but what I'm
thinking would require no HTML. It would work similarly to the "change
slide color" option on the context menu... perhaps as a tab in the
color picker dialog.
Thoughts?
revision towards the end of the week.
I will also be thinking about 2 new features, and wanted to get some
opinions/ideas before I try to incorporate them into the design:
pagination and theming.
Pagination:
Since the Rich Sticky Note will support graphics and styled text, it
could in theory be used to create multi-paged interactive content.
This would be in some ways similar to functionality of the PDF viewer
and/or PDF spreader. The primary difference would be that users could
add text to slides and edit them in world.
Theming:
Colors for sticky notes are great. But what about having pre-built
themes or skins for the sticky notes? I realize that adding a
background image may be possible with the current design, but what I'm
thinking would require no HTML. It would work similarly to the "change
slide color" option on the context menu... perhaps as a tab in the
color picker dialog.
Thoughts?
Nicole Yankelovich
May 11, 2010, 4:24:34 PM5/11/10
to openwon...@googlegroups.com
Matty,
I think the Theming idea is an excellent one, particularly if there's a
way to add new themes, but I think the Pagination idea will add too much
complexity to the UI. That's getting into the realm of a whole different
type of application. Not that it's a bad idea at all, but I would keep
the concepts separate. A Rich Stick Note should stick to the idea of
being a sticky note. I would suggest creating a separate module that's a
Rich Text Document. This might share some of the same UI components as
the Rich Sticky Note, such as the tool palette and color picker, but it
seems like you are going to want quite a few more document-oriented
capabilities like page templates, headers, footers, etc.
Instead of pagination, I would suggest thinking along the lines of
aggregation. Jordan and Drew were working on some layout manager
concepts a while back. I'm not sure how much of that code is in Drew's
Presentation module (or if he's even released the new version yet), but
the concept was to have a few different types of layout managers for
collections of 2D objects so you could take a set of objects and
automatically arrange them in a line, in an NxN grid, in a semi-circle,
in a circle, or around a sphere. If this layout idea was made into a
container-like capability, then you could imagine easily creating things
like bulletin boards. Add a grid layout manager to a 3D model of a
bulletin board, drop sticky notes on the board, and have them auto
arrange into a grid layout. Or add a sphere layout manager to a floor
tile and have the notes surround you in 3D. You could then move the
whole board and collection of notes to another location. It would
clearly take some design work to figure out how to map the layouts onto
arbitrarily shaped objects, but I think that could be worked out. A
really nice extension to this would be to allow people to export the
contents of a grid container into spreadsheet format.
Another extension that fits in nicely with the sticky note concept is to
add some features which are useful for brainstorming, like the ability
to add color-coded stars to notes or some sort of voting scheme. Themes
could also be used for this type of thing. You could use themes to
correspond to individuals or to different types of ideas (eg,
fund-raising idea vs party idea vs software project idea).
Hope that helps,
Nicole.
I think the Theming idea is an excellent one, particularly if there's a
way to add new themes, but I think the Pagination idea will add too much
complexity to the UI. That's getting into the realm of a whole different
type of application. Not that it's a bad idea at all, but I would keep
the concepts separate. A Rich Stick Note should stick to the idea of
being a sticky note. I would suggest creating a separate module that's a
Rich Text Document. This might share some of the same UI components as
the Rich Sticky Note, such as the tool palette and color picker, but it
seems like you are going to want quite a few more document-oriented
capabilities like page templates, headers, footers, etc.
Instead of pagination, I would suggest thinking along the lines of
aggregation. Jordan and Drew were working on some layout manager
concepts a while back. I'm not sure how much of that code is in Drew's
Presentation module (or if he's even released the new version yet), but
the concept was to have a few different types of layout managers for
collections of 2D objects so you could take a set of objects and
automatically arrange them in a line, in an NxN grid, in a semi-circle,
in a circle, or around a sphere. If this layout idea was made into a
container-like capability, then you could imagine easily creating things
like bulletin boards. Add a grid layout manager to a 3D model of a
bulletin board, drop sticky notes on the board, and have them auto
arrange into a grid layout. Or add a sphere layout manager to a floor
tile and have the notes surround you in 3D. You could then move the
whole board and collection of notes to another location. It would
clearly take some design work to figure out how to map the layouts onto
arbitrarily shaped objects, but I think that could be worked out. A
really nice extension to this would be to allow people to export the
contents of a grid container into spreadsheet format.
Another extension that fits in nicely with the sticky note concept is to
add some features which are useful for brainstorming, like the ability
to add color-coded stars to notes or some sort of voting scheme. Themes
could also be used for this type of thing. You could use themes to
correspond to individuals or to different types of ideas (eg,
fund-raising idea vs party idea vs software project idea).
Hope that helps,
Nicole.
Reply all
Reply to author
Forward
0 new messages