As a visitor to the home page, I need to be able to understand what resources (data) are available

[meiqimichelle]

We have lots of great content coming our way to flesh out the story of extractive industries in the US (and also meet the requirements of international EITI). The site as it stands will need to expand to hold all this greatness while still keep our user personas in mind.

I've started brainstorming around what this might look like, with input from several members of the 18F design and content team (thanks!), our USEITI contextual narrative working group, and our new contextual narrative writing/analysis partners at Deloitte.

inspiration

• http://apps.npr.org/lookatthis/posts/colors/
  • fact-based sharing as you go through
• http://apps.npr.org/borderland/#_
  • this one has stories you can choose from
  • some stories incorporate maps, some don't — they use whatever tool is most appropriate to the content
• http://projects.propublica.org/louisiana/
  • map-and-data-heavy story. This could be cleaner, but shows how you can add lots of types of content on an interactive map
• http://www.nytimes.com/interactive/2014/03/09/us/the-boys-in-the-bunkhouse.html
  • nice use of pictures and video sprinkled throughout text.
  • could envision similar use of charts??

What's in my mind's eye right now is perhaps something between the journalistic-slide-type layout of the NPR work and the data-map-heavy Propublica work. So, maybe there are several 'stories'* to choose from (similar to the way you can scroll to different visualizations now). Each 'story' has slides that walk you through interactive maps, or slides that just explain things (whatever works best for that content). This way, we have more space than one viz to tell a story like 'where the money goes' and can perhaps more clearly and cleanly add more of the content that's coming to us.

• To explain: I mean 'story' in the sense of 'content explained engagingly and logically.' I do not mean that we should create opinionated content, but that we'll make something that serves as a baseline of data and info about this space for others to build on (and create stories of their own).

Note from team feedback: could also explore leaving the scroll action in place, but adding left-right interaction to give each block more space.

Also: another idea is the increasingly popular expanding sidebar. It could start out expanded, then collapse when you choose a section or scroll

content

We have a lot of new content to integrate and filter into something appropriate for our users. Here are the sections of requirements from the international EITI board 

whiteboard

The pink/red stuff is my first attempt at linking some of the new content to sections. You might notice that the 'story' chunks match in part to the existing sections of useiti.doi.gov.

[meiqimichelle]

Live prototype of potential interactions here

Looks like:

[shawnbot]

I really like NPR's Borderland and ProPublica's Losing Ground piece on Louisiana. Borderland does a really nice job of being responsive, and I like how the Louisiana piece moves seamlessly across the map when you switch sites.

[meiqimichelle]

@ericronne is taking the next iteration of this work. His latest draft after many musings on the theme:

Some notes on this version:

• @ericronne noted that a major piece of what USEITI is trying to do in the US context is create dialogue in and about the extractive industries in the US. He noted that many of our original designs (his iterations included) felt more like presentations and less like something a person could engage with. This design tries to open the dialogue space by moving to a cleaner, less background-image-heavy design. Forward-leaning rather than sit-back-and-watch-the-show.
• This design includes an improved glossary feature. Instead of the current tooltip, a click on unknown terms would reveal a definition and other info in the drawer on the right. This would also be browsable, perhaps by alphabet as shown here. This allows us much more flexibility in explaining complex terms or US policies than our current tooltips (which are super tiny!).
• The design is flexible to allow for as many content blocks as necessary to meet USEITI contextual narrative requirements in a way that also meets user needs. More (or fewer) topic headings could go in the right drawer, and clicking on each could pull up summary info with an image in the main content area. For example, you can imagine the initial map module that @shawnbot is starting to prototype in issue #467 for content topic "Where is extraction happening" could be one of those modules.

FYI, the idea is that the drawer on the right could be minimized to something like:

[meiqimichelle]

Clickable prototype with initial content here: http://invis.io/NX2JGZN49 .

Will learn from this and incorporate in next drafts.

[meiqimichelle]

Work continuing in #495