open-austin / budgetparty Goto Github PK

• Click event on component
• Action creator & reducer case

Thinking we want to highlight the 4-5 most significant changes the user made here.

This could be by percentage change or dollar amount.

We also want to display Miles' upArrow or downArrow svgs here

• Rounding off numbers
  Ok to do this to the $1,000 mark?
• realtime feedback for user while incrementing amount for department
  • show percentage change from last year?
  • so amount in red when it is below last year, green when more?
• Learn More
  • print outs? can we remove this link for now?
• Domain & hosting
  • working on getting buildabudget.open-austin.org setup.
  • got delayed bc of broader DNS changes for our OA hosting.
  • I also bought austinbudget.party for $1.06 because I thought it was funny.
• Language/Copy
  • confirm values for department spending last year
  • confirm descriptions of service groups & individual departments
  • other?

We're trying to work on the options for what people do with money left over:
We can lower:
property taxes
utility transfers (Austin Energy/Austin Water)
Transportation User Fee

We could also just say: you have XXX amount of surplus.

I was using React-Router's browserHistory for the history features but it wasn't working well with gh-pages.

So the easiest fix was to use hashHistory instead.

Now urls are ugly. We should fix this one day.

🐻

Currently, we have "close" and "Back to Services" as buttons. They both do the same action, take the user back to the previous Service page. I believe this is oversight from when we simplified the service section pages.

For now, we should delete the "close" link and move the "back to services" link to the right hand side.

Currently the footer covers up the text. It would be great if we could add a little space.

i was lazy...

i should go back and add this.

We have home-background.png we can use for the Welcome page.

• Is this the best name for an app? The word "hack" can have a negative connotation for the general public. I propose we spend some time post Aug 16 event thinking about the branding of this app that is friendly and accessible for the "general public"

The email is [email protected]

More language stuff. For clarity sake we should consider changing "Edit Services" to -> "Edit Your Service Spending" on the reports page.

Trying to create a /dist directory so I can push something up to gh-pages.

Tried npm build, which seems to use the webpack.production.config but nothing happens in my terminal. No errors, no new folders.

Tried to 👀 how webpack.production.config is different from webpack.config, but not sure.

Any suggestions @syousif94 or @luqmaan?

thx

The section at the top:

We want this app to have a friendly and approachable aesthetic. Trying to run the City is a hard and heady problem. Let's not make this hard to look at too.

• fonts & typography
• colors
• hack the budget branding ( see #9 )
• icons ( see #7 & #20 )

This is going to be Single page app (SPA) using React + Redux because that's what I'm learning at work and want to improve at.

If anyone has a good boilerplate that want to use to help lay the foundation, that would be great.

We are also going to design this to work for mobile as first priority, so I can see benefit to using a Bootstrap like library to give us some out of the box system for CSS grid classes.

• need to add a list of all the departments.

Right now, I just have text. I think we will want icons for:

• Home
• Taxes
• Services
• Report

related to #13

Just starting a new issue for various design assets and handoff.

Services icons

• Public safety
• Development
• Infrastructure & transport
• Community services

Tab bar icons

• Home
• Revenue
• Services
• Report

Misc icons

• Up arrow
• Down arrow
• Save & Submit
• Your Budget

We should delete the periods in these 3 places. They aren't really needed and I'm being nitpicky 📝

Starting with Grace, then me, and now Vickie, we've iterated on user flows and wireframes for a bit.

Most of this back and forth on the Slack channel.

Would like to finalize some aspects of what we have and chat IRL so we can comfortably start coding it out.

• Inclusive to renters
  • home value isn't value isn't the first question asked
• Friendlier language & interface
  • we want this to be fun, not scary
• Mobile first design
• Community built and maintained
  • built and designed by local folks
  • built with Austin's in mind, not a blanket platform for any budgeting process.
• More realistically reflect the impact and tradeoffs

• Have department performance reports as a print-outs to support "learn more".
• Link out "learn more" link by service groups if possibly instead of by specific departments
• ...or just remove them

need a lil baby image for browser tabs

This round we won't be going deeper into funds stuff but will let people know they have a surplus and that it could go to lowering....something.

Grace, we need some text to explain what they could do with that money.

Below is a quick idea of the card we are working with. It will be on the report page.

custom, or just gather from free sources.

At first (during prototyping) it won't be so important, but eventually we need to think about what we do with the data the user has given us.

Do we save it somewhere? Maybe something lite like Firebase at first?

Do we send it to the user in some sort of report? via email?

• show percentage change from last year
• show amount in red when it is below last year, green when more

This applies to the Department Cards

https://docs.google.com/spreadsheets/d/1MqtWpmFJMVvEgEPVLx_dyKxkDjyiCp9CFfO3J9pwU7s/edit#gid=1498354466

In the current gameplay the impact of increasing the Department's budget by $1k could mean nothing, or it could mean a lot.

This is because the values that each department gets can vary so widely.

I also think percent changes are easier to conceptualize than a dollar amount.

If the user gets feedback as they click an amount how much the percent change is in Dollars, this could be a better approach than incrementing by fixed dollar amounts.

We need to drop in saveAndSubmit.svg & yourBudget.svg into their places on the Report page.

Punted on this for tonight bc I couldn't resize the SVGs nicely as <img> tags. It also seems like inline svgs would be good, and I found this CSS-Tricks article, but that involved some setup.

@VictoriaODell, would it be quick for you to convert the SVG to .gif the way you did with the service icons? Is there a good reason to stick with .gif over .svg?

View and interact with a live prototype
https://invis.io/BG7ZR8BZE

Get it on your phone
https://invis.io/BG7ZR8BZE#/174777798_HacktheBudget-pdf_1

The city's revenue from last year was $911 million, so I was just going off that until this year's budget proposal cam out, so the new revenue/General Fund budget is 969.2

At the very least it should link to github

Tried to do something like this in webpack.production.config but it was working.

For now, just copy pasting the images folder after running npm run build

we should give the user an indication of what page they are on.

• comparison of user's budget to previous year
• unused funds
• Icons #35
• submit form #19
• Services Summary #34