One way is to have all sections open when the web page loads, but put only the most expected/appreciated content into them. The rest of the content opens by clicking a "More..." link at the bottom of the section; and the next header slides down revealing the extra options.
With this pattern it's important to not make the section header rows look like they were following the typical accordion design pattern (filled background color), because they aren't. Instead, make them look like normal headers. The only difference is the link to reveal more content between the headers.
Also, when the user clicks the link, the bottom of the page must scroll down to reveal the content, but everything above must stay still. If everything moves when only small interaction was expected, there will be a #WFT moment.
If you carefully consider the sections and their contents, you may find that out of five sections, only 1-2 will have a variable content height to the extent that such interaction is even necessary. Most sections would have all of their contents always visible, and the rest would have a "More..." link to reveal more. That's quite often the case.
Hopefully this helps.
- Petteri
(My message didn't appear through a regular reply, so I copy-pasted it in the site. I'm sorry if this is a repeated message.)
Thanks for the input! I have contemplated using something similar to the "more" link to hide some of the information that isn't as crucial to the workflow but I think it will only solve part of the problem. I'm not sure what faceting is. Patricia, can you explain a little more?
One way I have dealt with this is to use psuedo-accordians (i.e. panels that can remain open if the user desires). In this case only one panel open at a time is the default behavior, but the user can over-ride the close action by checking a "keep panel open" option if they want to view more than one panel at a time. In other words, they can open and close panels at will. While this does contradict the expected behavior of panels, I predict that the expected behavior will change because this is a more useful and flexible way to utilizing the benefits of panels.
This person modified the typical accordion behavior (modifying jQuery UIs implementation), so they act more as toggles per section, versus one section at a time.
One way is to have all sections open when the web page loads, but put only the most expected/appreciated content into them. The rest of the content opens by clicking a "More..." link at the bottom of the section; and the next header slides down revealing the extra options.
With this pattern it's important to not make the section header rows look like they were following the typical accordion design pattern (filled background color), because they aren't. Instead, make them look like normal headers. The only difference is the link to reveal more content between the headers.
Also, when the user clicks the link, the bottom of the page must scroll down to reveal the content, but everything above must stay still. If everything moves when only small interaction was expected, there will be a #WFT moment.
If you carefully consider the sections and their contents, you may find that out of five sections, only 1-2 will have a variable content height to the extent that such interaction is even necessary. Most sections would have all of their contents always visible, and the rest would have a "More..." link to reveal more. That's quite often the case.
"People don't resist change, they resist being changed."
- Peter Scholtes
On 6.3.2010, at 1.55, jennfish40 wrote:
> Can anyone suggest an alternative to accordions that breaks a workflow into chunks but still allows the user to have multiple sections open at a time?
>
> (
Technically an accordion interface only has one section open at a time, so it sounds like that isn't what you're looking for. You can simply divide the workflow into sections which can be hidden/revealed on demand.
As Patricia said, more information regarding the problem that you are trying to solve would be helpful.
On Fri, Mar 5, 2010 at 4:45 PM, jennfish40 <contact@ixda.org> wrote:
Can anyone suggest an alternative to accordions that breaks a workflow into chunks but still allows the user to have multiple sections open at a time?
Get the feed
Comments
A concertina?
But seriously folks... sounds like faceting might work, but without more detail, I'm not sure what you're trying to achieve.
Hi Jennfish,
One way is to have all sections open when the web page loads, but put only the most expected/appreciated content into them. The rest of the content opens by clicking a "More..." link at the bottom of the section; and the next header slides down revealing the extra options.
With this pattern it's important to not make the section header rows look like they were following the typical accordion design pattern (filled background color), because they aren't. Instead, make them look like normal headers. The only difference is the link to reveal more content between the headers.
Also, when the user clicks the link, the bottom of the page must scroll down to reveal the content, but everything above must stay still. If everything moves when only small interaction was expected, there will be a #WFT moment.
If you carefully consider the sections and their contents, you may find that out of five sections, only 1-2 will have a variable content height to the extent that such interaction is even necessary. Most sections would have all of their contents always visible, and the rest would have a "More..." link to reveal more. That's quite often the case.
Hopefully this helps.
- Petteri
(My message didn't appear through a regular reply, so I copy-pasted it in the site. I'm sorry if this is a repeated message.)
Thanks for the input! I have contemplated using something similar to the "more" link to hide some of the information that isn't as crucial to the workflow but I think it will only solve part of the problem. I'm not sure what faceting is. Patricia, can you explain a little more?
One way I have dealt with this is to use psuedo-accordians (i.e. panels that can remain open if the user desires). In this case only one panel open at a time is the default behavior, but the user can over-ride the close action by checking a "keep panel open" option if they want to view more than one panel at a time. In other words, they can open and close panels at will. While this does contradict the expected behavior of panels, I predict that the expected behavior will change because this is a more useful and flexible way to utilizing the benefits of panels.
-- Laura
Jennfish,
This person modified the typical accordion behavior (modifying jQuery UIs implementation), so they act more as toggles per section, versus one section at a time.
http://www.michaelkeck.de/projects/jquery/
Josh
Hi Jennfish,
One way is to have all sections open when the web page loads, but put only the most expected/appreciated content into them. The rest of the content opens by clicking a "More..." link at the bottom of the section; and the next header slides down revealing the extra options.
With this pattern it's important to not make the section header rows look like they were following the typical accordion design pattern (filled background color), because they aren't. Instead, make them look like normal headers. The only difference is the link to reveal more content between the headers.
Also, when the user clicks the link, the bottom of the page must scroll down to reveal the content, but everything above must stay still. If everything moves when only small interaction was expected, there will be a #WFT moment.
If you carefully consider the sections and their contents, you may find that out of five sections, only 1-2 will have a variable content height to the extent that such interaction is even necessary. Most sections would have all of their contents always visible, and the rest would have a "More..." link to reveal more. That's quite often the case.
Hopefully this helps.
-- Petteri Hiisilä Senior Interaction Designer, owner / iXDesign
Mobile: (408) 256-0430 (USA), +358505050123 (FIN) Twitter: http://bit.ly/aDaP8R LinkedIn: http://bit.ly/1n1zTR
"People don't resist change, they resist being changed." - Peter Scholtes
On 6.3.2010, at 1.55, jennfish40 wrote:
> Can anyone suggest an alternative to accordions that breaks a workflow into chunks but still allows the user to have multiple sections open at a time? > > (
Technically an accordion interface only has one section open at a time, so it sounds like that isn't what you're looking for. You can simply divide the workflow into sections which can be hidden/revealed on demand.
As Patricia said, more information regarding the problem that you are trying to solve would be helpful.
On Fri, Mar 5, 2010 at 4:45 PM, jennfish40 <contact@ixda.org> wrote:
Use windowshade component in FLEX
http://dougmccune.com/blog/2008/02/09/windowshade-component-added-to-flexlib/
On Fri, Mar 5, 2010 at 7:08 PM, jennfish40 <contact@ixda.org> wrote: