Meeting minutes
What needs to happen to finish the V2 pattern about interactive controls
<julierawe> We'll focus on illustrations today and save the testing section until after Lisa reworks it.
"Do" example of contact form with standard, platform-specific designs
julierawe we have 2 options - one with only a submit button and another with a submit button and a back button.
Gareth - if it's a contact form it is unlikely to need a back or close button. If it's in a process flow (journey) it might need it.
Len - taken out of context the back button does look a little weird. Since we can't see the whole page or flow it looks like it doesn't belong.
Gareth - I added them in because of the text around the example. Not specifically becuase the images themselves make the best examples on their own.
Is their an advocate for keeping back button?
kirkwood my first thoughts were to not have it. There are some contexts where it might be needed.
Jan does it appear in a modal? if so, we should have an close button of some sort.
Gareth, are we tackling too much in this one section?
julierawe I think some people are going to wonder how to get out of the form (I did at first). If we add the 'x' to close it it could help people stay focused on our point and not get distracted by not seeing something they expect.
Jan Agree. From a Design perspective there needs to be a way out of the form.
julierawe if keep the back button, we need to talk about including the triangle. Or we could remove the back button, we could add the 'x' instead.
Gareth - if we can clearly identify the context (whether it is on a journey where a back button makes sense, where the 'x' makes sense modal).
Jan these are design considerations for what is happening on the page. But, it is OK to have multiple ays.
kirkwood described how people would describe their actions. Imagine telling someone you hit the back button - they may not know if it was the button on the page or in the browser.
julierawe how about we make this a modal?
We agreed that it would simplify the images and meet the text where it is working.
julierawe we can update the caption to reflect this decision and clarify what people are looking at.
julierawe reviewed the contents of the rest of this section so that we could update the text appropriately.
Jan important that your design patterns to allow for multiple methods.
<Jan> Here's the WCAG requirement: https://
ACTION: item: Gareth to add a "X" symbol in upper right for closing the modal.
julierawe pinning the idea of design patterns allowing multiple methods for a minute. Feels like a bigger subject that needs to be handled in more than just a caption update.
Accordion illustrations (Possible Do's, Don't's, and Warning)
julierawe is the current example sufficient? do we need a second one that shows caret with text and another example to show another nuance?
… we will have a don't example that will show a text only options lacking enough visual affordance
… also considering a 'warning' example using symbols (+ and -)
<Jan> I vote for one - best, most accessible way.
Gareth - at a minimum the chevrons are good, but adding open or close might be more helpful.
julierawe is checking our labels section to make sure we're not overlapping these sections in unhelpful ways.
Gareth - FAQ example of click to open, read, click to close could be a cognitive load for people. Do we need a 'use this carefully' message?
Group continued to talkabout how Apple's HIG and Material have specific meanings for + and -. Those could be used in our warning examples, but there isn't a specific study or spec for web usage.
julierawe these two patterns are intertwined. Need to find a way to keep them distinct.
<kirkwood> it really depnds on design patern of site too, no?
julierawe becuase we have another pattern with text and labels do we address them here or in the next pattern?
Jan if we don't address labels here we could encourage bad habits. She went on to desribe other experience modalities (speech to text and keyboard) and how making it part of this example would be beneficial.
julierawe we could include the tooltip text on the chevron.
group had a conversation about what the text would be and would it makes sense for people. The conversation got trickier and trickier as we talked about zoom users, voice control users and understanding icons.
julierawe do we put a tooltip on it so that it shows the whole row is active?
LenB placing pointer icon between the chevron and text to show the tooltp is good.
kirkwood but that doesn't represent the keyboard or mobile device experience.
Gareth this is why I prefer seeing the visual labels.
julierawe I hear you advocating for it to not be a hove example, but rahter seeing the word expand. The challenge is that we have another pattern for text and labels. We may have to work out this issue in this next patterns.
<Jan> Hi everyone - my apologies, but I have to drop. It’s exciting to see this work! Thanks for all you’re doing on this.
julierawe we need to figure out where the action is.
julierawe Len can you take a look at the text label example between now and our next meeting?
LenB I'll take a look.
julierawe do we want to extend this conversation to the AG chairs to talk about our caret direction thinking?
LenB I'll reach out to AG chairs and learn what the logic is.
Decision: we don't need the 'don't' example. We can just use the warning example.
<julierawe> To clarify: We do not need an additional "don't" example about an accordion.
<kirkwood> arrow should indicate direction of action
kirkwood I was using AI during this call and the answers I got back are inline with the our conversation about 1) the direction of the action matching the arrow and 2) using carets and not + or -.
<julierawe> LenB and julierawe discussed moving the accordion example into the next pattern and (about visible labels) so we avoid overlap between these two patterns.
<julierawe> julierawe pointed out previous discussions in this subgroup about whether to keep the two patterns separate or to combine them. Rain advised keeping them separate so we can call attention to the importance of visible labels. If we put too much stuff in one patterns, users may not see the information if they are mainly skimming the pattern names.