31:[{"id":"b15ca55d0c3282cc944e550e4e1f47dddc1010c73d4e7505b21de2984c0bc817c797e65eb5151491f8ff55e984b436c26bd777a4b86ffe7bcdb86cd60e9ab728","href":"https://static.observableusercontent.com/files/b15ca55d0c3282cc944e550e4e1f47dddc1010c73d4e7505b21de2984c0bc817c797e65eb5151491f8ff55e984b436c26bd777a4b86ffe7bcdb86cd60e9ab728","name":"Screen Shot 2021-05-30 at 5.31.34 PM.png","type":"image/png","lastModified":1622421716242.185,"size":140371},{"id":"738162d3aaeb51c71eb4aa3c0ba7b85c1907a27b873b1446cfdac6fc7251cc777e450e16b925df75f63119f86286cff83602746759446b3bddc0e859eb1b195e","href":"https://static.observableusercontent.com/files/738162d3aaeb51c71eb4aa3c0ba7b85c1907a27b873b1446cfdac6fc7251cc777e450e16b925df75f63119f86286cff83602746759446b3bddc0e859eb1b195e","name":"logo_for_dark_background-ddcf4f045c365d80e51ecc5cd22d663185032b6b2919d27bd240035d017638f7.png","type":"image/png","lastModified":1622421560133.803,"size":10524},{"id":"15bca96334953db501baf70008e9f0e0f6bd559c666cd998c412923e905c5d00d29f822e62b6b5f8054096cafec433576373b0bc3f3ff3f61f6498b1913889a6","href":"https://static.observableusercontent.com/files/15bca96334953db501baf70008e9f0e0f6bd559c666cd998c412923e905c5d00d29f822e62b6b5f8054096cafec433576373b0bc3f3ff3f61f6498b1913889a6","name":"Screen Shot 2021-05-30 at 5.32.02 PM.png","type":"image/png","lastModified":1622421836300.76,"size":141624}] 2f:{"title":"SWD Synthesize Week 7: Brand Your Graph","cells":[{"id":0,"value":"# SWD Synthesize Week 7: Brand Your Graph\n\nFor the synthesize exercise for week seven the task was to \n- pick several recognizable brands, \n- write ten descriptive adjectives about them, \n- apply their colors to an existing chart or graph we made, \n- then evaluate how well those colors work or not with what our graphic is communicating. \n\nFor the graph/chart I chose to use my [choropleth map of internet access by U.S. counties](https://observablehq.com/@clhenrick/swd-declutter-and-focus?collection=@clhenrick/storytelling-with-data-course). \n\nFor the brands I chose \n- Democracy Now! \n- MasterCard\n- PayPal.\n","pinned":false,"hidden":false,"mode":"md"},{"id":90,"value":"## Democracy Now!\n\nThis map uses the dark grey, white, and red brutalist color scheme from the media organization [Democracy Now!](https://www.democracynow.org/). While the red is definitely eye catching, the dark grey lines distract a bit. I also experimented with drawing the map without the county borders to reduce the amount of dark grey, but I'm not convinced that I like it much better.","pinned":false,"hidden":false,"mode":"md"},{"id":146,"value":"Ten descriptive adjectives about this brand:\n1. Dangerous\n2. Notifying\n3. Serious\n4. Attention grabbing\n5. Fearful\n6. Powerful\n7. Bold\n8. Strong\n9. Rising\n10. Assertive","pinned":false,"hidden":false,"mode":"md"},{"id":101,"value":"html`

${await FileAttachment(\n \"logo_for_dark_background-ddcf4f045c365d80e51ecc5cd22d663185032b6b2919d27bd240035d017638f7.png\"\n).image()}

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":189,"value":"html`

${\"Where 32.5% or greater of households\".toUpperCase()} ${\"lack internet access\".toUpperCase()}

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":6,"value":"drawChoroplethMap({\n data,\n colorScale: colorScale1,\n tooltipContents,\n borderColorCounties: darkGrey,\n borderColorStates: darkGrey,\n colorNoData: \"#fff\",\n zoomEnabled: false,\n borderEnabled: false\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":37,"value":"{\n const l = legend({\n color: colorScale1,\n tickFormat: \".3f\",\n title: \"Ratio of households without internet access\",\n width: 210\n });\n d3.select(l).selectAll(\"rect\").attr(\"stroke\", darkGrey);\n return l;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":140,"value":"---","pinned":false,"hidden":false,"mode":"md"},{"id":111,"value":"## Master Card\n\nI chose the brand colors for Master Card next as I thought they might work well as a multi-hue sequential color scheme. While technically the colors are semantic (orange = low, red orange = medium, red = high), the map looks a little too much like candy for my preferance.","pinned":false,"hidden":false,"mode":"md"},{"id":156,"value":"10 descriptive adjectives about this brand\n1. bright\n2. sequential\n3. overlapping\n4. symmetrical\n5. corporate\n6. circular\n7. friendly\n8. sunny\n9. alerting\n10. recognizable","pinned":false,"hidden":false,"mode":"md"},{"id":116,"value":"FileAttachment(\"Screen Shot 2021-05-30 at 5.31.34 PM.png\").image()","pinned":false,"hidden":false,"mode":"ojs"},{"id":225,"value":"md`

Lack of Internet Access by County in the U.S.

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":51,"value":"drawChoroplethMap({\n data,\n colorScale: colorScale2,\n tooltipContents,\n // borderColorCounties: \"#fff\",\n // borderColorStates: \"#000\",\n // colorNoData: \"#fff\",\n zoomEnabled: false,\n borderEnabled: false\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":56,"value":"legend({\n color: colorScale2,\n tickFormat: \".3f\",\n title: \"Ratio of households without internet access\",\n width: 210\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":136,"value":"---","pinned":false,"hidden":false,"mode":"md"},{"id":121,"value":"## PayPal\n\nThe last brand colors I tried were PayPal's which also follow a multi-hue sequential color scheme. I thought it might work well on a dark background while reversing the semantics of the sequential color scheme. Perhaps this could be a version for users with \"dark mode\" enabled on their devices, but in a brightly lit space it might not work well and be more difficult to read. I do like how the light blue stands out and is easily eye catching.","pinned":false,"hidden":false,"mode":"md"},{"id":160,"value":"10 descriptive adjectives about this brand:\n1. corporate\n2. technical\n3. dualistic\n4. wealthy\n5. contrasting\n6. sleek\n7. friendly sounding\n8. on the move\n9. peter pan\n10. serious","pinned":false,"hidden":false,"mode":"md"},{"id":132,"value":"FileAttachment(\"Screen Shot 2021-05-30 at 5.32.02 PM.png\").image()","pinned":false,"hidden":false,"mode":"ojs"},{"id":229,"value":"html`

Lack of Internet Access by County in the U.S.

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":77,"value":"drawChoroplethMap({\n data,\n backgroundColor: \"#222\",\n colorScale: colorScale3,\n tooltipContents,\n borderColorCounties: \"#222\",\n borderColorStates: \"#222\",\n colorNoData: \"#222\",\n zoomEnabled: false,\n borderEnabled: false\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":84,"value":"legend({\n color: colorScale3,\n tickFormat: \".3f\",\n title: \"Ratio of households without internet access\",\n width: 210\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":173,"value":"---","pinned":false,"hidden":false,"mode":"md"},{"id":63,"value":"md`## Configuration`","pinned":false,"hidden":false,"mode":"ojs"},{"id":16,"value":"scheme1 = [\"#fff\", \"#c42126\"]","pinned":true,"hidden":false,"mode":"ojs"},{"id":45,"value":"scheme2 = [\"#eb001b\", \"#ff5f00\", \"#f79e1b\"].reverse()","pinned":true,"hidden":false,"mode":"ojs"},{"id":73,"value":"scheme3 = [\"#012169\", \"#253b80\", \"#169bd7\"]","pinned":true,"hidden":false,"mode":"ojs"},{"id":183,"value":"darkGrey = \"rgb(25, 31, 36)\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":10,"value":"colorScale1 = d3.scaleThreshold().domain([high]).range(scheme1)","pinned":true,"hidden":false,"mode":"ojs"},{"id":48,"value":"colorScale2 = d3.scaleThreshold().domain([low, high]).range(scheme2)","pinned":true,"hidden":false,"mode":"ojs"},{"id":75,"value":"colorScale3 = d3.scaleThreshold().domain([low, high]).range(scheme3)","pinned":true,"hidden":false,"mode":"ojs"},{"id":66,"value":"md`## Dependencies`","pinned":false,"hidden":false,"mode":"ojs"},{"id":179,"value":"fonts = html``","pinned":true,"hidden":false,"mode":"ojs"},{"id":25,"value":"import { drawChoroplethMap } from \"@clhenrick/reusable-choropleth-map\";","pinned":true,"hidden":false,"mode":"ojs"},{"id":4,"value":"import {\n low,\n high,\n data,\n tooltipContents\n} from \"@clhenrick/swd-declutter-and-focus\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":35,"value":"import { legend } from \"@d3/color-legend\"","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}