May 20th, 2021
Co-authored by Martin Glick, Kevin Pham, Joanne Ramadani, and Eva Sibinga
1. Team
Eva Sibinga (Developer + research/text analysis) is in her final semester of the Grad Center’s Data Analysis & Visualization program. Her research interests include data ethics, the intersection of race and technology, and the application of feminist theory to contemporary data questions. With a background in English Literature and Visual Art, her approach to data analysis and visualization is motivated by a desire to expand the way we tell stories and understand the world through our own eyes and others’. Eva is one half of Freedom of Speech*’s core data and developer team, focusing on the statistical topic model and… a lot… of web development.
Joanne Ramadani (Developer + research/text analysis) is an information designer, data analyst, and web developer. She is currently a candidate for a Master’s degree in Data Analytics & Visualization at the CUNY Graduate Center. A “reformed” law nerd, she majored in English and Political Science in undergrad, training her attention to detail and developing her logic skills, which she now uses to scrutinize data and create fun visualizations that seek the best way to deliver information to as many people as possible. As the other half of the core data and developer team on Freedom of Speech*, Joanne’s responsibilities include cleaning and processing legal data, ideating visualizations on the design end, and co-building the code structure of the website, including the technical aspect of visualizing content.
Kevin Pham (UX/UI lead + research/text analysis) is a first-year MA in Digital Humanities student, and holds a B.A. in Interdisciplinary Studies from UC Berkeley. Kevin leads Freedom of Speech*’s design team, and is also a part of the research team. He primarily leads design ideation, produces high-fidelity wireframes for the website, and creates the project’s key pieces of branding. Kevin’s personal research generally sits at the intersection of race, critical theory, and the history of digital culture and media, with hopes of exploring theoretical interventions within the Digital Humanities.
Martin Glick (Project Manager + research/text analysis) is a Graduate Student at the CUNY Graduate Center pursuing an M.A. in Digital Humanities. He has a B.A. in Philosophy from City College (CUNY), an M.A. in Philosophy at Birkbeck College (University of London), and conducted independent research at the University of Göttingen from 2013-2017. His favorite movie is Alien, and he wrote a chapter about it in a volume for the Blackwell Philosophy and Pop Culture series. He is the project manager and contributes to the Outreach program.
2. Project Narrative
The Freedom of Speech Project emerged in response to the many factors that prevent the average reasonable person from understanding what “freedom of speech” actually means. Legal language is often inaccessible, case structures are arcane, verdicts are littered with potentially confusing and unfamiliar terms, and context is key to understanding the significance of most Court decisions. Most of the general public is unfamiliar with how the law works, not realizing that legislation and/or the Constitution is really just the beginning in determining what is considered “legal.” Indeed, while the First Amendment may be understood as a determining, theoretical base for freedom of speech protection, individual cases and case law determine how the freedom of speech is actually practiced and shaped.
The intentional limiting of scope and dynamic presentation of a thesis are the two major ways in which the Freedom of Speech* Project addresses these conventional barriers to understanding Court verdicts, while still keeping site users close to the Court’s original language.
When a user arrives at our landing page, or on the Explore or Guided modes of the Freedom of Speech* website, that person has already bypassed a mountain of obstacles that stand between the average internet denizen and a coherent understanding of Supreme Court verdicts on free speech. For one (very important) thing, cases on the Freedom of Speech* website are pre-filtered. Thanks to lots of coded and manual data work by Martin and Joanne, the cases on the site are only those that relate to the First Amendment freedom of speech protection, not “all cases” or even “all First Amendment cases.” The site has a narrower scope than say, the Supreme Court Database or Oyez.org, and in that directed purpose lies one of its greatest merits in the sometimes overwhelming field of court verdict databases.
Furthermore, our site is not only a database. It offers the user a thesis: freedom of speech protection is not static or limitless, but rather constantly changing in response to American values and anxieties. It’s not a partisan statement, just an observation of the tension between free speech in the Constitution and in case law. This comes implicitly through the option to filter by speech protection status, and explicitly through the Guided eras that lay out the stakes of free speech in different time periods. The site provides a critical intervention in the largely uncritical public “discussion” of the freedom of speech, pointing out both the very few words actually used in the Constitution’s oft-cited protection, and the many cases in which the Court put legal restrictions on the freedom of speech and an individual’s or group’s speech was not protected.
One category of similar websites are incredible resources for court cases, but much broader in scope than the Freedom of Speech* Project. Justia.org, where users may read full cases, is an amazing website for those who already know what they’re looking for and who have enough of a foundation with legal language to parse the language of court verdicts. (In fact, Justia was the publicly available source of the court rulings in our dataset!) Oyez.org is another excellent resource, which writes legal verdicts in more accessible language and even links each case writeup to the full case text on Justia’s website. Both of these sites aim to provide access to the full range of court cases, and function best as searchable databases. Wash U’s Supreme Court Database likewise provides an impressive database of metadata for each case. Again, its lack of guidance and specific purpose can provide a potential challenge to less-initiated users.
Another category of similar websites are those relating to free speech. Unlike the databases referenced above, most take the form of static lists. This page from the United States Courts’ website provides a simple but nuanced answer to the question, “What does free speech mean?” by pointing to different examples of protected and unprotected speech. It’s a helpful starting point, but not at all interactive or dynamic. It provides case numbers and citations but doesn’t link to any cases or further language from the cases. This general list of landmark free speech cases from the Bill of Rights Institute provides a similar list and links each case back to Oyez, but its purpose is not to be an interactive database, just a list of information. The National Constitution Center likewise provides content that lays out some of the basic ways in which First Amendment speech protections can legally be limited, but again, isn’t dynamic or interactive.
To another important point, any curated list should prompt the questions: who made it, and to what end? As the National Constitution Center’s name might suggest, they’re pretty enamored of the Constitution, unreservedly calling it “the greatest vision of human freedom in history.” Given that they also gloss over the unprotected speech verdicts of the last century with “Today, the legal protection offered by the First Amendment is stronger than ever before in our history,” it’s hard to think that the organization is interested in letting users come to independent conclusions about the sticky relationship between case law and constitutional law. The Bill of Rights Institute uses generally clear, neutral language in its list, and links to Oyez for more information, but on closer inspection… the organization was founded and continues to be funded in part by Charles Koch, notable Libertarian. The site is still full of good information, but, as with any organization financially connected to a politically active billionaire, it behooves us to consider what is and isn’t included in their curation of the subject.
The Freedom of Speech* Project tried to avoid some of these foibles in our two-pronged approach. There’s relatively little curation to the Explore page, inviting users to explore free speech cases within whichever filters or parameters interest them most, and in the full context of 500+ cases that relate to free speech (as per the WUSTL metadata and our generous manual categorization of edge cases). The Guided page gives users a curated experience, openly acknowledging that this route provides more narrative in its presentation of the facts. We of course don’t claim to be free from bias, but our biases hopefully lean towards questioning the Court’s decisions and the way those are generally presented. (And if anyone knows any billionaires looking for a pet project, we might be interested.)
3. Audience
To cast the widest possible net when reaching potential audiences, we incorporated design and content elements that would speak directly to them. There were four general categories of people that we intended to speak to with our project; each with their own degree of educational impact.
The first is a younger audience: Grade to High School learners. Our intent is to introduce them to the concepts and terminology of legal studies. Adopting cartoon characters as “help” icons throughout the different pages endears the user to the content and humanizes the otherwise weighty subject matter. They might not come away from the web page with a comprehensive understanding of case law, but at least they can use the interactive elements to appreciate that the history of free speech in the U.S. interacts with ideas like race, communism, and obscenity.
The second is the adult learner who might have heard of landmark cases from the newspapers they read or podcasts they listen to, but is curious about delving further into the topic of freedom of speech. They might hear it thrown around in articles they read, but are unaware of how completely embroiled this aspect of the First Amendment has been in U.S. history. They are not particularly zealous about First Amendment rights but rather the curious mind who would appreciate the chance to delve into topics that interest them, like campaign finance or religion, and read the content of Case Laws. Our website invites them to navigate the concept of Freedom of Speech by first engaging them with their desire to educate themselves. Our Guided Experience also provides a way of looking at Landmark Cases through the lens of historical context which appeals to the history buff in them.
The third is the Law or Legal Studies student. They come to the website with an exhaustive knowledge of these rules and the precedent they set. They might be well versed in Constitutional Law as well. Our website offers an alternative way of looking at these cases which have drummed into their heads ad nauseam. We thought it useful to offer a place to explore legal history using keywords plucked from the text of the case. Our division and grouping by topic was informed by phrases from the text, then hand-picked by our team according to what we thought was most relevant. Although this way of approaching legal studies is subjective, it isn’t without merit. It is our belief that for the Law student our webpage offers an alternative way of approaching the daunting amount of cases which deal with Freedom of Speech. In a way we have humanized the case method in legal education. To better understand how principles or doctrines are furthered it is vital to see the relation between the thematic elements. Our webpage pinpoints these by Topic which gives the Law student the option to browse cases in a more intuitive way.
Finally, there are the #freedomofspeech internet advocates from both sides of party lines who would do well to become immersed in the history of the subject before parading its use all over the internet. This set of chronically online people are frequent users of Twitter and online discussion boards where hashtags related to First Amendment Rights will be able to consolidate a lot of the information they’ve been reading in piecemeal about the First Amendment from scattered articles. Our website demonstrates that Freedom of Speech has not necessarily privileged one political party over the other, and in fact many of our contemporary conflicts over what we are allowed to say in public, or the slogans we wear on our clothing have been dealt with decades ago. Cementing these disputes in history, and revealing that they don’t arise ex nihilo allows for a studied response rather than imagining we are confronted with arbitrary affronts on Free Speech. The historical precedent is crucial here and points to the worthiness of our Topic Modeling which allows people to use common phrases they might find on Twitter or newspaper articles to see how others before them have dealt with similar issues. From flag-burning to accusations of Socialism, there is precedent that should be studied before going online to hurl flippant insults.
4. Project Activities
An ambitious subject deserves a sprawling website to match and so we set out to accomplish a host of goals which we have met for the most part. The work plan consisted of a heavy load for the month of March which set up the remainder of the semester for fine-tuning and revision. A few of the accomplishments that really set the tone for the remainder of the project and allowed us to envision the course for successful implementation included: completing the lo-fi UX sketches on March 9th, getting a clean dataset, including SCOTUS decision text on 13th, having the project landing page up by the 16th, and doing a substantial amount of the text analysis & tagging by the 20th. During April we fine-tuned aspects of the webpage and began posting on social media. On the 4th, we completed the code scaffolding and on the 7th, the hi-fi (completed) UX wireframes were finished. This was also a month of heavy back-end code and bug fixing in preparation for the presentation in May. Near the end of April, the topic modeling process was complete and cases were matched with their relevant themes.
Much of the driving force behind the website stemmed from an ideation session which got everyone on the team onboard with respect to the final vision of the project. We used Discord to share updates throughout the semester which allowed us to take a peek into the creative and analytic processes of the others while offering up the chance to cheer them on. Updates on different design elements of the website gave us a structure through which to imagine the content of the project. With each newly introduced element—from the map of the USA to the empty boxes of cases constructed according to the color scheme of the website—it became easier to imagine what we were working towards. Shared screen captures of the data sets that our team was sifting through highlighted the frustrations that can arise when wrestling with code. This was exciting to see, because no adventure is complete without its momentary setbacks and eventual achievements.
5. Accomplishments
The product is a website that can be described as a Vue application with multiple “pages,” which are not actually single HTML files, but rather portions of HTML that get assembled depending on how the user interacts with the website. It gives users an overview of the limitations of First Amendment freedom of speech rights as adjusted by the Supreme Court in the 500+ cases it has heard regarding this topic over the course of American history.
On the landing portion of the site, the project name is declared as a heading, and the project’s mascots, Gavel Gavin (a smiling, brown gavel with a block) and Aster Risk (a big blue asterisk with an angry, frowning face), bound the heading on either side. When clicked, the mascots introduce their purpose to the project. Below the heading and the mascots, there are two paths to choose from: an explore mode or a guided mode. The explore mode button has text above it that constantly shifts, giving the user a preview of the various topics that are encompassed in the corpus of First Amendment freedom of speech cases. Below the buttons is the original text of the First Amendment. The header bar is a universal feature of the site and contains a little info symbol that allows the user to click on it, which displays a modal that describes the project and our team.


Explore Mode
When clicking the button that says “explore,” the site loads in an interface with a sorting bar, a sidebar of filters, and a scrollable space that holds cards with case titles. When interacting with the filters, the space shows only case cards that match the indicated filter options. The filter options are: 1) a switch, which will show landmark cases when clicked; 2) another switch, which will show cases in which the right to freedom of speech was protected when clicked; 3) a range of years on which the user can click and drag their mouse to select a subset of years; and 4) a list of topics with the amount of cases which are composed of that topic in the majority. Clicking on the filter names themselves triggers a popup with a little more information on how landmark cases are determined, what protected speech means, and where the topics came from, respectively
Upon selecting from the options afforded in filter 4, the case cards will adjust to show only cases with that topic, but will also show what percentage of the case has been classified as the selected topic. The courthouse icon on the bottom left of the card indicates a landmark case, and when hovered over, will declare that it is a landmark case. Similarly, Gavel Gavin is in the bottom right and indicates cases in which the right to freedom of speech was protected. When selecting a topic, the top bar near the sorting dropdown will also populate with information about the currently selected topic.
The sorting dropdown allows users to sort the selected cards in alphabetical order, ascending or descending, or by year, ascending or descending. When a user clicks the button that says “See how the Court ruled,” a case modal will populate. Because the case modal exists in both modes, further information will be provided in a separate section.

Guided Mode


If the user clicks on the button that says “guide me through,” they will be brought to a page that contains a map of the United States that has small gavels as points on the map, a timeline with multiple light brown ticks on it, and a switch that says “Explore by era (Guided experience)”.
If the user clicks the switch, a text box will pop up over the map, and transparent blue boxes will show up over the timeline, their widths representing the range of years in a particular era. When the user clicks on one of the boxes, they can read about that particular era. The user can also click on the previous and next buttons located on either side of the era’s description to advance the story. They can then either click the x button to close the era mode or click the switch again, which will do the same thing.
When the user hovers over a tick on the timeline, a case title, along with its relevant citation and decision year, will populate in a tooltip. Upon clicking on either a gavel on the map or a tick on the timeline, a speech bubble will pop up with a case title, the key issue in that case, and a button that says “See how the court ruled.” When clicking on that button, the user will be able to read about a landmark freedom of speech case in the aforementioned case modal, which will have its functionality explained in the next section.

Case modal
The case modal pops up when clicking a button that says “See how the court ruled,” and shows crucial information about each case. Every case starts out with the introductory sentence “In this case, speech was…” and then depending on how the court ruled, the modal will either declare “Protected” or “Not protected.” The modal will also show the title of the case, the citation, and how the court ruled. Depending on whether the case is a landmark case or a non-landmark case, there will be different levels of detail. If the case is a landmark case, there will be a key issue, case syllabus, and decision, but if the case is not classified as a landmark case, there will only be a case syllabus. Viewing cases from the Explore page will show all freedom of speech cases, while viewing cases from the Guided page will show only landmark freedom of speech cases. Upon clicking the close button in the top right hand corner, the modal will disappear, and the user will be able to go back to the mode they were inspecting.
6. Evaluation
Throughout its development, our project consistently moved through various moments of evaluation through communication with those both within and outside the Digital Humanities program; with feedback ranging from high-level questions about the intent of our work, to informal comments and conversations from and with our intended audience. In the earlier stages of our project’s development, we sought and received feedback from Micki Kaufman—Advisor to the Master of Arts in Digital Humanities Program—as well as Professor Maney from multiple angles, whereby our conversations ranged from concept ideation, to outreach, to topic modeling. When we kicked off and began brainstorming the direction of our project, Kaufman provided us with questions that allowed us to connect our desired impact and audience with the way in which we designed our product’s experience: How would we make case law accessible, and what does it look like to make something complicated (like case law) into something easy to understand? What are we trying to provoke in our users, and what questions are we looking to gesture towards? How do we communicate the relationships between different landmark cases across time and space? How do we find the fine line between being as “unbiased” as possible, while also making clear that we acknowledge and understand our own political predispositions?
Professor Maney also provided apt feedback regarding the efficacy of our project, asking questions specific to our project’s potential content, which would determine its scope: How would we determine what speech is protected in, say, 1969 vs. 2010? Will those determinations emerge from analysis of your dataset or claims made by legal scholars? If the latter, won’t we be relying on the work of reliable, established legal scholarship to guide the creation of the data visualizations instead of our layperson’s perspective? Additionally, isn’t it possible forms of speech were unevenly protected across the US at different moments? In light of these provocations, Professor Maney offered that we narrow our project’s scope if we felt it necessary, considering the potentially overwhelming breadth of information that needed to be simplified under the header of “freedom of speech.”
Through these conversations with Kaufman and Maney in the first steps of our budding project, we moved through brainstorming and design ideation with several questions at the forefront of our minds. Indeed, we attempted to answer their provocations in the design of experience in the following ways: (1) Visualizing both the temporal and spatial dimensions of different cases through our map and timeline experience; (2) visually designing our project as to make it less intimidating and more accessible through playful graphics and branding; (3) narrating how cases could be understood as connected and contingent on its historical context through our “guided era exploration”; and (4) simplifying case law descriptions by communicating the key points and ideas of a particular case. In these ways, we were able to combine both our own data analysis with the claims made by legal scholars in a way that was doable within scope, while also opening up our visualizations to interpretation from a user experience perspective.
Kaufman also provided feedback when it came to the technical aspects of our project, especially as it pertained to moments in our project’s development when data analysis and topic modeling became tricky. At this stage of our project, we were contemplating the heavy computational load of topic modeling over 500+ cases, with legitimate concern that our computers might not be able to actually perform the analysis we wanted. In light of this, Kaufman offered that we use a “representative sample” from each case–in this instance the case syllabus, which is essentially an abstract. We followed this sound advice, scraping and topic modelling just the abstracts of the cases, and as such, managed to build a topic model that could not only be run on Eva’s local machine, but which worked fast enough to facilitate multiple drafts and tweaks for better results.
Additionally, we held informal conversations for the sake of branding and social outreach, with peers and acquaintances in circles intimately familiar with legal discourse. These conversations were largely held with students in law school, who could provide us insight into how we might brand our social media and cultivate a specific humor that would be applicable and relatable to those with these interests: What are the sorts of content that law students, in particular, enjoy viewing? Were there ways we could provide with our users and viewers, such that they could submit their own content to our social media platforms? And was that something students would desire? Through these conversations, we would get ideas of different jokes/memes/content we could post on our Instagram and Twitter. From these discussions we also decided to make it possible for our users to DM us self-made memes that we could then post on our social media pages.
Lastly, our team was attentive to the feedback provided to us from the peers in class, especially when it came to the presentation of our final project. From the in-class practice runs of our Digital Humanities Showcase presentation, our group received comments regarding the way we visualized and narrated our work and process: Considering the fact that our project sought to make case law accessible, easy to understand, and un-intimidating, our presentation should mirror the way we visualized these key tenets in our user interface—through hand-drawn fonts, playful characters, and varying colors. Our peers also suggested we consider the sizing of our images, such that we could better highlight our project’s interface and experience. In light of these suggestions, we re-made our presentation to better narrate not only our UI, but also our branding, such as our Gavel Gavin and Aster Risk characters. By putting all these branding and visual elements together in a way that felt cohesive, our presentation was able to better communicate our project’s goals of making case law accessible, such that the user could better understand how the freedom of speech is used today.
7. Continuation, Future of the Project & Sustainability
It’s difficult to continue working on a project like this without another deadline! But the site would absolutely benefit from it — there are some functionality and UI issues that might be relatively easily solved and majorly impact the user experience for the better. See below for a bulleted list of our development and UX wishlist.
In terms of expansion, the scope actually seems very appropriate: freedom of speech is an important and super relevant category, and it makes sense to have an interactive web application devoted to exploring these cases. It would be great to update it with the latest cases, but otherwise, the boundaries of this project are helpful and contribute to its success.
Web development wishlist:
- Filters working properly, including with multiple queries at once and a “clear all filters” button
- Improve Explore topics (/maybe ditch the topic model in favor of more manual categorization)
- Adjust the speech bubble so that the tail actually shows up where the user clicks
- Add in one of our mascots, Gavin, as a marker when the cases are activated in Guided mode
- Add justices to the case modals
Content wishlist:
- Era for the current day that addresses the social media + democracy side of free speech
- Add the latest cases to Explore mode
- Minor fixes in tooltips to display legal definitions
Website: https://freedom-of-speech-project.github.io/fos/
Github: https://github.com/freedom-of-speech-project/fos