2d:null 2e:["$","title",null,{"children":"Susie Lu | cbudamagunta1 | Observable"}] 33:[{"id":"bb3978de8264e3fb1784352b638898dd611a91ecbf96a943e9cbcde2c474bd400e0676d33b66c628121bd9a16f502c4ac161625d06435b70c61bd99d4e1fef5a","href":"https://static.observableusercontent.com/files/bb3978de8264e3fb1784352b638898dd611a91ecbf96a943e9cbcde2c474bd400e0676d33b66c628121bd9a16f502c4ac161625d06435b70c61bd99d4e1fef5a","name":"image@1.png","type":"image/png","lastModified":1585626314189.62,"size":21985},{"id":"581eca694e36dcf9efaeff90f47a75a8ec4a1f48daeaac672cbb4ec599c17aaac408aeeb821b2d4735b3fc0dcceff1979c6de63a4feb7f05ceee3b924e190547","href":"https://static.observableusercontent.com/files/581eca694e36dcf9efaeff90f47a75a8ec4a1f48daeaac672cbb4ec599c17aaac408aeeb821b2d4735b3fc0dcceff1979c6de63a4feb7f05ceee3b924e190547","name":"image@2.png","type":"image/png","lastModified":1585629891833.803,"size":219424},{"id":"ffe40b1ac4531204ff7036e7b07446ba516a108084e339e315da51d64beb5798c72383ff6051fa77f894493c3724b67756bb175a11a26dac7f8521947f389b75","href":"https://static.observableusercontent.com/files/ffe40b1ac4531204ff7036e7b07446ba516a108084e339e315da51d64beb5798c72383ff6051fa77f894493c3724b67756bb175a11a26dac7f8521947f389b75","name":"image@5.png","type":"image/png","lastModified":1585630558171.122,"size":175675},{"id":"581eca694e36dcf9efaeff90f47a75a8ec4a1f48daeaac672cbb4ec599c17aaac408aeeb821b2d4735b3fc0dcceff1979c6de63a4feb7f05ceee3b924e190547","href":"https://static.observableusercontent.com/files/581eca694e36dcf9efaeff90f47a75a8ec4a1f48daeaac672cbb4ec599c17aaac408aeeb821b2d4735b3fc0dcceff1979c6de63a4feb7f05ceee3b924e190547","name":"image@6.png","type":"image/png","lastModified":1585631906016.241,"size":219424},{"id":"f2cb4437874e1407d88bc6de8b0353b60bc519dba3eb7bd17b7b3ad681f944f21bb1a8067895a1c9c7359ff0e6b293ef0b469481a58d1f25bec7004c9d7fd7e8","href":"https://static.observableusercontent.com/files/f2cb4437874e1407d88bc6de8b0353b60bc519dba3eb7bd17b7b3ad681f944f21bb1a8067895a1c9c7359ff0e6b293ef0b469481a58d1f25bec7004c9d7fd7e8","name":"image@4.png","type":"image/png","lastModified":1585630137396.218,"size":117205}] 31:{"id":"45fd73fb4a4232f9","slug":"susie-lu","title":"Susie Lu","thumbnail":"d73aad5427e0872a04ec142f4988da6b506fb6d3ead9e6fbfdbfa6accda64858","access_level":"public","create_time":"$D2020-03-30T23:03:10.601Z","update_time":"$D2020-03-31T05:30:41.582Z","view_time":null,"first_public_time":"$D2020-03-31T05:14:56.089Z","has_unpublished_edits":null,"fork":false,"stars":3,"starred":false,"owner":{"type":"team","id":"6f5f7aaf393148ad","login":"cbudamagunta1","name":"","avatar_url":"https://avatars-next.observableusercontent.com/a0245746acd21641cdb6c65f6a6790525c36b904921271979b970bdff873ac2d","tier":"starter_2024"},"version":168,"publish_version":168,"role":null,"authored":false,"authors":[{"type":"individual","id":"fceb4a552fb7005e","login":"cbudamagunta1","name":"","avatar_url":"https://avatars-next.observableusercontent.com/a0245746acd21641cdb6c65f6a6790525c36b904921271979b970bdff873ac2d","tier":null}],"members":[{"type":"individual","id":"fceb4a552fb7005e","login":"cbudamagunta1","name":"","avatar_url":"https://avatars-next.observableusercontent.com/a0245746acd21641cdb6c65f6a6790525c36b904921271979b970bdff873ac2d","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Susie Lu","cells":[{"id":0,"value":"html`

Susie Lu

\n\n

Contributions to Data Visualization

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"html`

Introduction

\n\n

Susie Lu is an expert in data visualization and design, and has contributed multiple new tools to the field that enhance our ability to create interesting and well-built visualizations. The three specific tools that I will focus on are d3-annotation, viz palette, and d3 Legend.

\n\n

She currently works as a Senior Data Visualization Engineer at Netflix, and regularly posts artwork on her two instagram accounts.

\n\n

Website: Susie Lu
\nInstagram: @susie_draws and @susie_paints
\nTwitter: @DataToViz

\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":28,"value":"html`

d3-annotation

\n\n

The d3-annotation library was created as a way to make the implementation of annotations in d3 easier, and therefore encourage their use in more visualizations. Annotations provide context and allow us to direct users towards specifics in visualizations.

\n\n

There are three foundational blocks in this library that make up all annotations:\n

note
connector
subject

\n\n

This image from the documentation page highlights what each of these parts refer to:

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":84,"value":"blockExample = FileAttachment(\"image@1.png\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":128,"value":"html`\n

Each one of these blocks can be customized.

\n\n

\n ${await FileAttachment(\"image@4.png\").image()}\n

Image: Example Without Scales from Susie's bl.ocks

\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":88,"value":"html `\n

This library makes it simple to add annotations to any visualization, which allows us to create more insightful visualizations that are more contextually grounded.

\n\n

The library was also updated to make it easier to use. It now includes built in custom stying and some changes to the Badge type annotation.

\n\n

Documentation and Usage
\nUpdate Documentation

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"html`

Viz Palette

\n\n

This project was co-created by Susie Lu and Elijah Meeks

As Lu writes, this project was \"born out of a frustration with picking colors for data visualizations.\"

\n\n

The tool allows you to test different color palettes in diffrent formats, and allows for color blindness testing. It's optimized to allow for easy testing and picking of colors, and pasting in and out of JavaScript.

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":115,"value":"vizImage = FileAttachment(\"image@6.png\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":139,"value":"html`\n

This sort of tool really makes a difference for anyone working with color, as it provides a way to equalize the way people experience color a bit, to allow for more informed color decisions.

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":111,"value":"html`\n

Project Page
\nFastCompany article talking about the tool

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"html`

d3 Legend

\n\n

This tool is one that was used in our Data Vizualization class, and has proved very handy. This d3 Legend library allows for an easy way to create unique legends in d3 visualizations. These include size legends, color legends, and symbol legends.

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":148,"value":"legendImage = FileAttachment(\"image@5.png\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":152,"value":"html`\n

She provides detailed documentation for the various types of legends, and showcases the various customizations that can be made.

\n\n

This package makes it much easier to build previously tedious legends, to provide greater context and readability to visualizations.

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":143,"value":"html`\n

Documentation

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":161,"value":"html`

Other Works

\n\n

Susie Lu has been the lead data visualization expert on many projects, from Basketball Records to Rock and Roll History, to Gerrymandering.

\n\n

She also has a strong artistic presence, and posts regular drawings and paintings, as well as cartoons on her social medias.

\n\n

She uses her artistic skills and perspective to inform and enhace her data visualization, to produce more meaninful visualizations overall.

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":67,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"html`\n\n

Author Information

\n\n

Chaitrika Budamagunta
\nGraduation Date: May 2020
\nDegree: B.S. in Computer Science

\n\n

My name is Chay, I am a computer science major and a theater minor, and I love finding ways to blend tech and art.

\n\n

I chose to focus on the work of Susie Lu because I am always interested in highlighting the work of other women in tech related fields, and after using one of Lu's tools in our data visualization class I was excited to learn more about her contributions! She finds ways to use her artistic skills to enhance her work in data visualization, which directly speaks to my interests.

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 32:"$31:body"