search

codeforboston / maple

MAPLE makes it easy for anyone to view and submit testimony to the Massachusetts Legislature about the bills that will shape our future.
https://mapletestimony.org
MIT License
44 stars 118 forks source link

Legislative Process Visual #554

Open jamesvas5307 opened 2 years ago

jamesvas5307 commented 2 years ago

Requirements Create a visual, animation, UI element to show the "typical" process of bill become a law for Massachusetts.

Design will need: some content we will need to use for UI. As well as input on how to actual demonstrate that based on UX best practices and most value to our users: is it a modal, a one sheeter, a progress bar associated with a policies particular status, etc.

jamesvas5307 commented 2 years ago

Tagging some people who might be able to get the content going for this.

For this ticket and dev work: we should design and figure out how this will be displayed and then design will work on how this will be incorporated into the project. @sammymyi will be designing, @jkoren if you want to suggest some bootstrap UI that is easy implement, we can figure out a strong low implement, high impact approach of this UI.

jkoren commented 2 years ago

Hi @jamesvas5307 @sashamaryl has been doing a really nice job working to clarify this fairly complex process. @sashamaryl can you add to the nice diagram you showed on the last meeting. As I remember, the diagram is broken up into about 6 major phases. One thought is to have 6 versions of the diagram, each with a different phase highlighted and show the appropriate diagram version in the status box depending on where the bill is in the process. See current status modal screen shot.

image

The diagram as a whole with no section highlighted could be in the learn/legprocess section. image

Maybe as a stretch goal at some point we can make a 30-60 second video showing the diagram and explaining the process, and in the short term a diagram would go a long way as an explanation.

jkoren commented 2 years ago

@jamesvas5307 if you want me to review bootstrap for some components let me know.

jamesvas5307 commented 2 years ago

@jkoren I'd love to see the content that @sashamaryl is going to provide. This is going to be for @sammymyi to decide over UX which we discuss yesterday on a call. I would like the content to dictate the UI but ultimately, how I imagine this being useful to a user is showing a form of "progress state" for a particular policy in either a flow chart or if it's more linear (which I doubt) a "domino's tracker style."

I would say once we figure that out, it would be nice to try to respect the bootstrap framework and try to use existing components (skinned with our branding) to try to make this easier to implement. (And then with some user input, we can establish value and scale up the UI)

So long story short, I'd like to see content first.

sashamaryl commented 2 years ago

Hey y'all! It would be best to meet to show you what I have so far. I don't think the diagram on its own as it stands will give you the information you need, but I do think the seeds are there, and if we shake the branches we can catch some whirligigs. I'll start a slack thread for scheduling!

mvictor55 commented 2 years ago

Must haves 1) building an accessible tracker-diagram, likely with 4-8 steps. I'll post some links to other states' attempts at the diagram 2) ensuring that we are getting and understanding the relevant indicators from the data feed so that we can accurately "light up" the tracker as a bill moves the process. 3) understanding who a constituent should contact (committe rep, their own rep, etc) as a bill moves through the process

Nice-to-haves

To the extent building the detailed diagram helps us accomplish the must-haves, I think its a good approach - but lets try to keep that goal in mind

Finally - this seems like a good opportunity to dig into the api data. There are a couple issues that I think the data might solve - so we should keep these in mind: 1) "companion bills" - ie. when the same bill is intro'd in house + senate ( or very similar versions). We'd like to link these pages... could look cool on the tracker too tbh ("oh it seems the Senate is moving faster than than the House....again..") 2) When a bill moves through the process, it can be added into a different bill #, have other bill# added to it, etc. We should try to capture this. Ie. I provide testimony #1 on a pro-privacy bill H.123; it enters committee; committee makes it an anti-privacy bill H.234; I provide testimony #2. It would be amazing to be able to 1) effectively link the bill #s so that the bill info + testimonies are both captured, and/or 2) track changes on the bill text 3) previous versions of the same bill (or similar). Ie. we receive testimony in Sept for bill H.123, and then its intro'd again during Jans new session as H.234. Would like to link these

Maryland: https://mgaleg.maryland.gov/mgawebsite/Legislation/Details/SB0007?ys=2021RS

image

Ohio: https://ohiohouse.gov/legislation/134/sb1

image
sashamaryl commented 2 years ago

a few more thoughts on the content development... While there is already a lot to show with the content, we still have a ways to go:

Ooops, this is a little redundant with what Matt just posted above, but since it's from the perspective of just our process and where these things are feeding from I think important to keep in mind.

alexjball commented 1 year ago

@sashamaryl is getting started on the frontend for the vertical 6 step tracker here in figma. This links to a specific version of the design file.

For now, we will focus on the steps and omit the details as this simplifies analysis. The frontend will be driven by a new firestore collection that contains the output of our analysis algorithms. This should let us iterate on analysis separately from the frontend work.