New keyboard accessibility plugin demo - Image Viewer design

Mon Oct 25 20:16:10 UTC 2010

Hi everyone,

After starting work on the demo markup and thinking of actual
implementation, we have discovered that the implementation of a horizontal
scroller for the image thumbnail requires either:

1. A fixed / absolute layout, or
2. A Javascript scroller to handle the interaction.

There are disadvantages to both these approaches. Option 1 will have reduced
accessibility and reduced personal customization if the demo is in a fixed
layout. Option 2, though a common approach, adds more Javascript to the demo
and requires integration between the keyboard plugin and the Javascript
scroller.

I don't think either of these options are desirable at the moment given that
we want this demo to be a clear, inclusive example of the keyboard plugin.

What I propose is that the design of this demo be changed slightly to use a
grid of image thumbnails instead of a horizontal scroller. This still
accomplishes what we want for the demo while maintaining good accessibility.

We will use a small number of thumbnails to reduce the amount of vertical
scrolling, and the revisit the Javascript horizontal scroller / keyboard
plugin integration as a future iteration.

Does this sound like a reasonable approach? Thoughts and comments
appreciated!

- Jonathan.

---
Jonathan Hung / jhung at ocad.ca <jhung.utoronto at gmail.com>
IDRC - Interaction Designer / Researcher
Tel: (416) 977-6000 x3959
Fax: (416) 977-9844

On Fri, Oct 22, 2010 at 3:44 PM, Jonathan Hung <jhung at ocad.ca> wrote:

> Now it's the question if having hotkeys makes sense. I can foresee possible
> confusion:
>
> - By pressing 1, does the user expect the star rating to change, or for the
> selection will jump back to the first image?
>
> - If an image has focus, but not selected to be the image in the main
> viewer, does pressing the hotkey change the rating for the image in the main
> viewer, or the image that has the focus? (there is separate focus and
> selection because we wanted to demonstrate keyboard navigation and handling
> actions).
>
> - Since keyboard focus can be shifted around the interface, will the user
> ever be uncertain about what the hotkey will do?
>
> While I think having hotkeys for the stars is a good idea, I want to make
> sure it makes sense before incorporating it into the demo.
>
> I have my own thoughts on this matter, but would like to hear what others
> think as well.
>
> - Jonathan.
>
> ---
> Jonathan Hung / jhung at ocad.ca <jhung.utoronto at gmail.com>
> IDRC - Interaction Designer / Researcher
> Tel: (416) 977-6000 x3959
> Fax: (416) 977-9844
>
>
>
> On Fri, Oct 22, 2010 at 1:25 PM, Colin Clark <colinbdclark at gmail.com>wrote:
>
>> The keyboard plugin does indeed support arbitrary (and configurable) key
>> bindings for activating elements. Supporting Jan's "1, 2, 3" shortcuts
>> should be no problem, assuming it makes for a good, clear demo.
>>
>> Colin
>>
>>
>> On 2010-10-22, at 9:25 AM, Jonathan Hung <jhung at ocad.ca> wrote:
>>
>> Hi Jan,
>>
>> That's an excellent suggestion, but I don't think the keyboard plugin
>> supports hotkeys at the moment. We can add hotkeys separately, but may risk
>> confusing it with the functionality of the keyboard plugin. I think there
>> was some talk about hotkeys, but I'm not sure if that is a feature that is
>> planned. I would support the idea of adding hotkey support to the keyboard
>> plugin - it seems logical.
>>
>> I think we should leave hotkeys out of the demo for now.
>>
>> ---
>> Jonathan Hung / <jhung.utoronto at gmail.com>jhung at ocad.ca
>> IDRC - Interaction Designer / Researcher
>> Tel: (416) 977-6000 x3959
>> Fax: (416) 977-9844
>>
>>
>>
>> On Thu, Oct 21, 2010 at 3:59 PM, Richards, Jan < <jrichards at ocad.ca>
>> jrichards at ocad.ca> wrote:
>>
>>>  For the star setting, maybe also allow pressing “1”, “2”...?
>>>
>>>
>>>
>>> Cheers,
>>>
>>> Jan
>>>
>>>
>>>
>>> --
>>>
>>> (Mr) Jan Richards, M.Sc.
>>>
>>> <jrichards at ocad.ca>jrichards at ocad.ca | 416-977-6000 ext. 3957 | fax:
>>> 416-977-9844
>>>
>>> Inclusive Design Research Centre (IDRC) | <http://inclusivedesign.ca/>
>>> http://inclusivedesign.ca/
>>>
>>> Faculty of Design | OCAD University
>>>
>>>
>>>
>>> *From:* <fluid-work-bounces at fluidproject.org>
>>> fluid-work-bounces at fluidproject.org [mailto:<fluid-work-bounces at fluidproject.org>
>>> fluid-work-bounces at fluidproject.org] *On Behalf Of *Jonathan Hung
>>> *Sent:* October 21, 2010 3:37 PM
>>> *To:* Fluid Work
>>> *Subject:* Re: New keyboard accessibility plugin demo - Image Viewer
>>> design
>>>
>>>
>>>
>>> Hi everyone,
>>>
>>> Attached is an updated wireframe for the keyboard plugin demo. The design
>>> is essentially the same, but with a notable reduction in use of context
>>> messages which now only appear for the 5-star widget and the keyboard
>>> instructions.
>>>
>>> Please take a look at the design and let me know your thoughts!
>>>
>>> - Jonathan.
>>>
>>> ---
>>> Jonathan Hung / <jhung.utoronto at gmail.com>jhung at ocad.ca
>>> IDRC - Interaction Designer / Researcher
>>> Tel: (416) 977-6000 x3959
>>> Fax: (416) 977-9844
>>>
>>>
>>>  On Wed, Oct 20, 2010 at 12:01 PM, Jonathan Hung < <jhung at ocad.ca>
>>> jhung at ocad.ca> wrote:
>>>
>>> Hi everyone,
>>>
>>> With the date of the 1.3 release pushed back (Justin is going to send an
>>> email about this shortly), we now have time to implement a new demo for the
>>> keyboard accessibility plugin.
>>>
>>> If following this email thread, this would be Option #1 mentioned in
>>> Anastasia's email sent on October 18.
>>>
>>> I will be updating the wireframes and will send the latest version to
>>> this mailing list for feedback.
>>>
>>> Thanks!
>>>
>>>
>>>
>>> - Jonathan.
>>> ---
>>> Jonathan Hung / <jhung.utoronto at gmail.com>jhung at ocad.ca
>>> IDRC - Interaction Designer / Researcher
>>> Tel: (416) 977-6000 x3959
>>> Fax: (416) 977-9844
>>>
>>>
>>>    On Tue, Oct 19, 2010 at 4:38 PM, Jess Mitchell <<jessmitchell at gmail.com>
>>> jessmitchell at gmail.com> wrote:
>>>
>>> Nice!  I like the example.  And thanks AC for the link ;)
>>>
>>> Jon, are you imagining if we go the direction of '2b' that we'd tighten
>>> the example up a bit -- for instance, there is a lot of text on those pages
>>> that isn't necessarily necessary for demonstrating the tab keyboard piece.
>>>  Or perhaps I'm assuming it's just the interactions among the tabs that is
>>> particularly interesting...
>>>
>>> ?
>>>
>>> J
>>>
>>>
>>>
>>>
>>> On Oct 19, 2010, at 9:37 AM, Jonathan Hung wrote:
>>>
>>> > Hi Anastasia,
>>> >
>>> > I'm good with Option 2b and cleaning up the example where needed.
>>> >
>>> > - Jonathan.
>>> >
>>> > ---
>>> > Jonathan Hung / <jhung at ocad.ca>jhung at ocad.ca
>>> > IDRC - Interaction Designer / Researcher
>>> > Tel: (416) 977-6000 x3959
>>> > Fax: (416) 977-9844
>>> >
>>> >
>>> >
>>> > On Mon, Oct 18, 2010 at 2:23 PM, Cheetham, Anastasia <<acheetham at ocad.ca>
>>> acheetham at ocad.ca> wrote:
>>> >
>>> > Jon and I reviewed his Gallery Viewer mock-up this afternoon and
>>> discussed some tweaks to the keyboard interaction. I think this will be a
>>> good demo of the keyboard accessibility plug-in.
>>> >
>>> > Our question now is with the timeframe for implementing it. Justin's
>>> goal for code freeze is Wednesday this week i.e. two days. That's a bit
>>> tight to implement an exemplary demo from scratch. Justin favours postponing
>>> it to 1.4, but then that leaves us with the question of what to do for a
>>> keyboard-a11y plug-in demo for 1.3 (since the current portal demo is
>>> broken).
>>> >
>>> > So our options seem to be:
>>> >
>>> > 1) Focus on implementing an all-new demo, and get something completed
>>> in time for code freeze.
>>> >
>>> > 2) Postpone the new demo 'til the next release, and either
>>> >
>>> >  a) remove the current not-working portal demo (and put in a "Coming
>>> Soon" sign), or
>>> >
>>> >  b) use Colin and James' Philosophy Lesson demo as a temporary portal
>>> demo for 1.3, to be replaced in 1.4 with the Gallery Viewer.
>>> >
>>> > Personally, I favour option 2b, but I'm wondering what other people
>>> think.
>>> >
>>> > --
>>> > Anastasia Cheetham     Inclusive Design Research Centre
>>> > <acheetham at ocad.ca>acheetham at ocad.ca            Inclusive Design
>>> Institute
>>> >                                        OCAD University
>>> >
>>> >
>>>
>>> > _______________________________________________________
>>> > fluid-work mailing list - <fluid-work at fluidproject.org>
>>> fluid-work at fluidproject.org
>>> > To unsubscribe, change settings or access archives,
>>> > see <http://fluidproject.org/mailman/listinfo/fluid-work>
>>> http://fluidproject.org/mailman/listinfo/fluid-work
>>>
>>>
>>>
>>>
>>>
>>
>> _______________________________________________________
>> fluid-work mailing list - <fluid-work at fluidproject.org>
>> fluid-work at fluidproject.org
>> To unsubscribe, change settings or access archives,
>> see <http://fluidproject.org/mailman/listinfo/fluid-work>
>> http://fluidproject.org/mailman/listinfo/fluid-work
>>
>>
>> _______________________________________________________
>> fluid-work mailing list - fluid-work at fluidproject.org
>> To unsubscribe, change settings or access archives,
>> see http://fluidproject.org/mailman/listinfo/fluid-work
>>
>>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://lists.idrc.ocad.ca/pipermail/fluid-work/attachments/20101025/e0270e96/attachment.htm>