Design and style template for meeting agendas

[jenniferthibault]

Open meetings (findable through the calendar) all have agendas that are put out before the meeting, and are retained afterwards. These agendas are linked to from the calendar event (and probably elsewhere).

Design a page template in the betaFEC style for these meeting agendas.

• This will probably involve light interaction design improvements, but will primarily be focused on styling.

[jenniferthibault]

Context for getting to these agendas in the wild:

Currently, in the calendar. all links say Learn more for both events that have an agenda and those that don't. This could be an opportunity to help clarify that.

Current:

• both say "Learn more" One links to agenda, one links to "coming soon" page

Proposal:

• If an agenda exists, link directly to it, using specific language.
• If an agenda link does not exist, do not link anywhere else. State that no agenda exists, and do not provide a deeper link.

Dev: @noahmanger is something like this possible? Interaction: @nickykrause / @onezerojeremy whaddya think?

Template design

For the page styling itself, here's my first pass which follows the same structure as the Latest Updates page templates:

A couple specific places I'd like feedback:

Content design:

• I tried my hand at placing some useful information about public meetings that had previously been on the agenda index page at the top of the agenda template.
• It also seems helpful to tell interested people how to attend this meeting right on that page, so I have placeholder for that.

• I restructured the way some of the elements are styled. This is for visual information flow purposes, but also overlaps content design
  • Before:
  • 
  • Proposed update:
  • 

@emileighoutlaw what do you think?

UX design

A big open question for me is what kind of information would be most useful for someone to find from an agenda like this. I've proposed the most recent draft & approved minutes, as well as a card that would link to the calendar, filtered to meetings.

@onezerojeremy / @nickykrause what do you think? I know (probably?) we don't have data here, but would this be a workable first draft, or is there a different concept you'd like to try?

[jenniferthibault]

I forgot one piece of content design:

With the new content up front, it felt like there was a header missing to start off the actual agenda. I added Items for discussion: to help fill this transition, but would love @emileighoutlaw 's thoughts

[nickykrause]

@jenniferthibault

First, I am so glad that "Learn More" will become something more concrete: "View Agenda." +100 to that and to noting that there is no agenda, if no file exists.

Second, I don't have any additional information about what a person would be interested in reading after reading a meeting agenda, but I think that what you've chosen is logical in the abstract. Viewing the draft and approved notes from a previous session would be useful in multiple ways, I imagine...for example, (a) trying to remember what was discussed last time, for continuity, or (b) reviewing an example of the types of things discussed in meetings like these, for those who are new to them.

At first glance, I can't think of something else I would try instead, so it seems like a workable first draft to me.

[emileighoutlaw]

I just did some content auditing of agendas, and my take is:

1. There are no well-written agendas in the world (no surprise)
2. You're on a great path already (no surprise)

I like your proposed edits to how visual elements are styled. It clarifies the parent-child relationship, and I think it makes it easier to read.

As a header, I'm crazy about "Items for discussion." Succinct, clear, to the point.

Let me know if I can do anything more helpful than give you all my 👍

[nickykrause]

There are no well-written agendas in the world (no surprise)

😆

You're on a great path already (no surprise)

💯

[jenniferthibault]

Heh, thanks all.

KK, last bits to wrap this up & move it along.

• @emileighoutlaw do you want to hunt down/write the "how to attend this meeting" info and copy, or should I give it a go?
• @noahmanger how possible is it to do the changes to the "Learn more" links to the agendas on the calendar? Also @noahmanger : How would you like to integrate this work with the PR in https://github.com/18F/fec-cms/pull/490 ?

[johnnyporkchops]

If at some point you want to find out more about user possible user-stories for the agenda pages, Shawn Woodhead Johnson, the Commission Secretary would be a good person to query, but it looks like you've got it pretty well figured out now.

[emileighoutlaw]

I'm :face-palm: right now, because I completely missed the section where you kindly and specifically asked for content design help. Abject apologies, @jenniferthibault .

Open meetings agenda

Open meetings are public meetings in which the Commissioners adopt new regulations, issue advisory opinions, approve audit reports concerning political committees. Open meetings typically are held twice a month, at 10:00 a.m. on Thursdays.

Members of the public can attend an open meeting or hearing at the FEC. Please bring a photo ID and be prepared to go through a security check. You will then be escorted to the Commission's hearing room on the ninth floor.

This is what we're using in the Press section, so it seems nice from a consistency standpoint, if it looks good to you.

[jenniferthibault]

Here's an updated screenshot with that new content in place. I also noticed one small formatting change that could bring the date and time position more in line with existing press templates.

@johnnyporkchops - is this an ok adjustment to make in your pull request?

I was chatting with @johnnyporkchops as he's been working on https://github.com/18F/fec-cms/pull/490 to implement this, and we wanted to raise a content formatting question. @emileighoutlaw are you interested in opening a conversation about moving from Roman numerals to another format (Arabic numerals 1, 2, 3, or other?) based on any best practices or readability research you know of? This popped up because using roman numerals prompted an addition to the fec-style repo, because out of the box, it defaults to Arabic numerals. So, there is sort of a dev advantage to not using roman. If there are also readability or stylistic advantages, we may want to open the conversation.

[emileighoutlaw]

I am interested in discussing a move to Arabic numerals— I have a hunch Arabic numerals are easier for readers to scan and parse.

In an initial hunt, I had trouble tracking down statistics that support my hunch. That said, I did find many articles explaining how to read Roman numerals (and people asking how to read them) and none explaining Arabic numerals. That in itself seems to be a good case for Arabic.

I'd like to tag in @AmyKort here— I wonder who actually writes the agendas and if you have any gut sense about how contentious a move to Arabic numerals would be?

[AmyKort]

The agendas are generated by our Office of the Commission Secretary. I'm happy to see what folks think about numerals, Arabic and otherwise.

[jenniferthibault]

I should probably say that it's a pretty small change to fec-style, so it would be ok to leave them as roman numerals if there aren't readability or stylistic advantages from a content strategy perspective.

[emileighoutlaw]

I think there is a small-medium content strategy advantage. But nothing worth having a big struggle over. So we'll let Amy check temperatures and go from there. <3 to Amy, as always

[emileighoutlaw]

p.s. We're using arabic numerals in other sections of our site, so there are also consistency advantages. But again, these are small to medium :)

[johnnyporkchops]

I think the argument that we are already using arabic has a lot of weight. I tend to think Roman is just a stylistic thing that makes sense if the sub-items and their sub-items have numbering, but ours agendas' do not. I ran it by the person who is the content owner (for all intents and purposes) of these pages and she has no problem with changing it if we want to, but I know Amy is still to get back to us.

[johnnyporkchops]

So just to confirm, we have the go-ahead to use Arabic numbering for the agenda pages. I make update the PR for that. Good news: no changes to fec-style at this time.

[AmyKort]

Also, @johnnyporkchops is awesome. He forgot to mention that in his comment above. :)

[jenniferthibault]

Nice work everyone!

Bonus fun facts: This sent me into a research rabbit hole to find out why I was calling them "Arabic numerals" . Turns out the full, complete, historically accurate name would be "Hindu-Arabic numerals" since they were introduced by those mathematic placement systems. But seems like people also call them "Modern" numerals.

So there we go. Modern / Hindu-Arabic numerals it is! Thank you @johnnyporkchops . I'm going to close out this issue, since all design questions are resolved.

Officially moving to implementation and wrapping up in https://github.com/18F/fec-cms/pull/490

[emileighoutlaw]

That is fascinating! Thanks for all the hard work @johnnyporkchops !

[johnnyporkchops]

In terms of the Hindu-Numeric numerals, as I realized after we closed this: CSS would default to this style for an OL normally, but most global or reset stylesheets will reset that to list-style-type:none, as does ours. So if I can find an instance where we are presently using a class to set that to Hindu-Arabic numerals, then I can reuse that style. I could not find one where the numbering was rendered via a list-style-type declaration. Does anyone know where on the beta this exists? I will try to scan stylesheets as well.

[noahmanger]

@johnnyporkchops we use .list--numbered for that.