Create table of contents/agenda page template

[AvivaOskow]

For longer decks or workshops, it's been helpful to have an agenda at the beginning, but this doesn't exist in the current template.

Some varying examples:

Page 3: https://docs.google.com/presentation/d/1jCgidxwYvJfa-v7HNe23HGumIk3NCd0mRzAmebKhwQU/edit#slide=id.g4650f1bd88_3_7

Page 2: https://docs.google.com/presentation/d/1pqeP60G1mSLfHpn1scK-Csg1LklPoxbjklP1Ytlv5L8/edit#slide=id.g4ba2e3caf4_0_16

Page 2: https://docs.google.com/presentation/d/1v77ZpYEBzDzYV9apJUOi_TcavEfKdQIokVIxeHQd7B4/edit#slide=id.g4ff040c573_3_28

[cmajel]

Adding additional examples:

Page 7 https://docs.google.com/presentation/d/1N2NekWZfp5ermL2grAK4uEo2bRksZLUXUFHn8UNH4Rs/edit#slide=id.g4fdd0b3568_0_0

Page 6-8, example of a multi day https://docs.google.com/presentation/d/16q2G1lcXfXSZpdOzgQDG8MsoSnZ6wd5-z1k4EOkR1qo/edit#slide=id.g14dea889ae_0_251

[Dahianna]

Sent to the design lab for support

[cmajel]

@margaretmildrew will be taking look at this over the next sprint. Here's the issue we had discussed during planning.

[margaretmildrew]

https://docs.google.com/presentation/d/1-gvwYQTHDRkT0NZdFd5U1eYPNkrpZ4dsRRbFgwjBrCQ/edit?usp=sharing

@cmajel @Dahianna here are a few drafts of the agenda/table of contents slide- I made a few versions. Let me know if I should change anything!

[cmajel]

@margaretmildrew thanks for this! Adding in our notes from our email exchange:

• Could you try testing this with a few different examples of agendas (long vs short). This will help us see if it works well for different needs / scenarios.
• The alignment still feels a little off. Can you confirm that the title and the text box for the agenda details are aligned and the same width as other slide elements? The thing that sticks out to me is the narrow margin for the agenda details on the right.
• I would recommend aligning the time slots with the headline to keep a clean line on the left.
• How do you think the white circles help with this design? Currently I am wondering if they would be better smaller or removed entirely, but am curious of your thoughts.

[margaretmildrew]

https://docs.google.com/presentation/d/1-gvwYQTHDRkT0NZdFd5U1eYPNkrpZ4dsRRbFgwjBrCQ/edit?usp=sharing Here is the link to an editable version of the agenda slide-- I'll start working on the other edits (alignment/circle) issue. So far, I have used the content from a sample 18F slide to fill in the agenda, which helps give a better idea of what it would potentially look like. I'll start creating a few more examples to help give an idea of what it would look like in other scenarios. Please let me know what else I can do on this slide to edit it!

[Dahianna]

@margaretmildrew will look at margins and create example of no bullets and numbered slides

[cmajel]

@margaretmildrew @Dahianna I had some time this morning to work on these a bit.

Using your original deck for inspiration, I've spun up this new deck with a few edits.

Some of the edits are to better match our theme, including:

• Adjusting the alignment to match @Dahianna's new values
• Adjusted colors to use our theme palette
• Adjusting font weights so everything is Helvetica Neue, with the default size at 18px for body copy and 26px for titles
• Avoiding the white on bright blue color combo, which is not color accessible

And, I also experimented with a few things:

• Laying this out in a table. Having it in a table makes it easier to keep the text of the times/counts aligned to the description.
• Different color options. Looking at the examples above, I see a lot of folks using the dark blue slides for dividers/agendas/pull outs, and I think it is a bit easier to read than the bright blue when there is a lot of text.

Would love thoughts on this direction!

Preview

Recommended direction

[margaretmildrew]

@cmajel I agree, I think this color theme is a lot easier to read and looks great with the 18F theme. Thank you for adding more to this- I like this version much better!

[cmajel]

@margaretmildrew thank you for all your help with this!

I've updated the demo deck with the two styles I'd recommend - the dark blue bg and the white bg. https://docs.google.com/presentation/d/1G_ooJoYCzxIcU4TOzAIWccLwA3401OmNeIobrLdYOnU/edit#slide=id.g5ca767afc2_0_200

@Dahianna going to pass to you for an alignment check and to be wrapped into your theme updates next week.

[Dahianna]

Asked for access to the deck. Once I'm in I'll copy and add them to master

[Dahianna]

@cmajel will look at duplicating the deck and adding the featherly icons to see how they look