Fw: SVG charts

All,

I talked with James Jackson (MSU) after his CSUN talk and he volunteered to
review some SVG graphics and make suggestions that would help with SVG
usability.  I've attached our email thread below. Please let us (the SVG
accessibility task force) know whether you agree with his observations and
the "requirements" (desired features)  I pulled from them.

                                                              
                                                              
                    Regards,                     Fred         
                                                              
                   Fred Esch                                  
       Accessibility, Watson Innovations                      
    AARB Complex Visualization Working Group                  
                     Chair                                    
        W3C SVG Accessibility Task Force                      
                   IBM Watson                                 
                                                              
                                                              



----- Forwarded by Fred Esch/Arlington/IBM on 05/12/2015 04:23 PM -----

From:	Fred Esch/Arlington/IBM
To:	James Jackson <jamesedj@msu.edu>
Cc:	"SVG-A11y TF" <public-svg-a11y@w3.org>
Date:	03/16/2015 12:01 PM
Subject:	Re: SVG charts


James,

Thanks for the feedback. May I share the feedback with the W3C
accessibility task force? Your feedback would be on the public mailing
list, so anyone could see it. If you would be willing, it would be nice to
have you post a clean email (no history) with you feedback to the mailing
list public-svg-a11y@w3.org and attach the zip file of svg so everything is
together. You can leave on the "Hi Fred, Over the weekend" ... stuff if you
wish or you could simply say, something like - I reviewed the attached
charts for usability... (or whatever works for you) so all the members of
the task force know what the subject of the email is.

Here are the SVG accessibility requirements I pulled out of your
observations.  Note, in this phase of  the task force our "requirements"
are not normative (have to do), rather we are trying to to define would be
nice to have available and some stuff may end up in browser polyfills.

   Be able to view an individual item (with semantic meaning) by subduing
   (graying out) competing parts of the same feature. A competing part of
   the same feature would refer to other lines in a line chart, other
   points in a scatter plot, etc.
   Be able to highlight a label associated with an item.
   Be able to extract data values associated with an item, via labels, tool
   tips or other means.
   Be able to highlight connectors/relationships.

Please add on any missing requirements and edit the requirements as you see
fit.  We will be talking about these requirements this Friday, so if you
could provide feedback before then, I will be able to update the Wiki
before we start the discussion.  Thanks for your help. These are really
cool ideas that will help lots of folks.
                                                              
                                                              
                    Regards,                     Fred         
                                                              
                   Fred Esch                                  
       Accessibility, Watson Innovations                      
    AARB Complex Visualization Working Group                  
                     Chair                                    
        W3C SVG Accessibility Task Force                      
                   IBM Watson                                 
                                                              
                                                              






From:	James Jackson <jamesedj@msu.edu>
To:	Fred Esch/Arlington/IBM@IBMUS
Date:	03/16/2015 10:26 AM
Subject:	Re: SVG charts



Hi Fred,

Over the weekend I got the chance to look at the SVGs you sent me, and here
is my feedback.

The biggest difficulties that people with dyslexia might have when using
charts relate to difficulties with visual search (such as finding a
specific point on a graph and then seeing which value it lines up with) and
issues of cognitive load and short term memory especially for names and
numbers.

When looking at these charts, and especially when thinking about the
potential that comes up because they are SVGs, the recommendation that I
could make that would address all of these issues would be providing ways
to highlight specific parts of charts. We talked about this a bit at CSUN,
but here are some more detailed thoughts.

For example on a line graph, like in the line.svg file, if a user hovers
over the red "Store D" line, that line and its associated label in the
legend could remain full color while the other lines and labels could
become grayed out. This would make it easier for the user to see the full
shape of that line, which points are a part of it, and the text label it is
associated with could be identified without having to rely on working
memory (to use Nielsen's heuristic, it would be better for recognition
rather than recall). Also if the label were hovered over then the line
could be highlighted, again supporting recognition over recall.
Highlighting could also make it easier to see which values are attached to
a specific point on. For instance on
the polarPointsWithVaringTickSpacing.svg file, the labels are very close
together, making it really difficult to see which values are attached to
specific points, but if these values where highlighted when the point is
hovered over, it would become much easier.

I think applying the same principle can work for other charts too, and even
improve usability and information density. For instance on the Chord.svg
file, if hovering over the red "severe" label or chords highlighted those
chords, it would probably be easier for all users to compare the width of
each "severe" chord across the different "release numbers", and in the
processFlow.svg if a specific step in the process is hovered over, a
relevant subset of steps and paths could be highlighted (such as all the
paths and steps that would necessarily precede the highlighted step),
making it easier for everyone to analyze the process. Or on the org chart
(org.svg) if a position is hovered over, then all its parents (but not its
parent's siblings) could be highlighted making it easier to see which
positions work directly with the selected position.

If this kind of functionality was made keyboard accessible and if it
communicated these state changes to AT (e.g., through aria-hidden), it
might be helpful to screen reader users as well, because it could reduce
clutter and cognitive load when exploring charts linearly (e.g., if I am
interested in one line on the line.svg chart, I could filter out all the
others and not have to sort through them).

Anyway, I hope this feedback is helpful, and if you would like me to look
at any specific chart more closely or comment on different chart features,
I would be happy to.

James


On Thu, Mar 5, 2015 at 6:58 PM, Fred Esch <fesch@us.ibm.com> wrote:
  James,

  I enjoyed your talk.  Here is the zip of SVG charts. Please let me know
  whether they can be made more usable.  The researcher I mentioned is Lisa
  Seeman. Lisa is dyslexic.

  As a reminder Doug's talk is on Describler at 8 am. My talks are at 10 am
  (Accessible Charts for the Blind). And at 1:20 pm (accommodations for low
  vision and color blind users). I would be interested to know whether you
  think the low vision techniques would be useful for dyslexic users.

   (See attached file: IbmCharts.zip)






                                                      
              Regards,                    Fred        
                                                      
             Fred Esch                                
 Accessibility, Watson Innovations                    
 AARB Complex Visualization Working                   
            Group Chair                               
  W3C SVG Accessibility Task Force                    
             IBM Watson                               
                                                      








--
James Jackson
User Experience Researcher
Usability/Accessibility Research and Consulting
219 S. Harrison Road, Room 94, East Lansing, MI 48824
517-884-1420

Received on Tuesday, 12 May 2015 20:33:14 UTC