Create an initial index.html, publish it as a Hugging Face Static Space, and keep the first version visible for later critique.
The water-town case demonstrates the method. Replace its domain, community, dataset, tasks, idioms, evidence, and sources in your own project.
Start my project workspace ↓Decide only the domain, data/task abstraction, and one Hugging Face dataset. Validation comes after there is an artifact to inspect.
Create one complete index.html for an interactive visualization.
DOMAIN
Build a bilingual digital-humanities experience about Chinese water-town cultural heritage and intercultural exchange for students, residents, museum visitors, and international audiences.
DATA AND TASK
Use https://huggingface.co/datasets/do-me/Geonames
Use a traceable subset containing Kunshan, Zhouzhuang, nearby lakes, Venice, named canals, and the Venetian Lagoon. Show the records on two interactive OpenStreetMap panels. Encode settlements with graduated population circles, keep hydrographic features visually distinct, and add one aligned chart with exact population labels so users do not have to compare circle area alone. Allow users to inspect feature class, feature code, coordinates, population field, elevation/DEM, timezone, and modification date.
TECHNICAL BOUNDARY
Return one complete index.html using browser-compatible HTML, CSS, and vanilla JavaScript. Do not require npm, React, Python, a server, or a build process. Include responsive design, keyboard access, loading and error states, and visible dataset attribution. Use only verified source rows and link each record to its GeoNames page. State that a purposive subset is not exhaustive. Do not infer cultural meaning, ecological change, community needs, or a historical route from place-name records. Do not generate README.md or conduct the critique yet.Keep the workflow to three moves. The visible tutorial belongs in the webpage; the README configures and documents the repository.
New Space → Static HTML → Public.
Place index.html and README.md at the repository root.
Open the App and verify loading, interaction, attribution, mobile width, and failure states.
I have attached my generated index.html. Convert it into a Hugging Face Static Space.
Preserve useful interactions; remove React compilation, npm, Python, backend, local-path, and environment-variable dependencies. Use browser-compatible HTML, CSS, and JavaScript with HTTPS resources. Add responsive behavior, keyboard access, readable contrast, alt text, and explicit loading/error states. Keep dataset attribution visible and never present simulated records as source observations.
Return exactly two complete files: index.html and README.md. Configure README.md with sdk: static. Keep the critique for the next stage.Locate exact GeoNames rows on real basemaps, compare the four recorded settlement populations, and see which cultural or environmental claims still need other evidence.
Critique the four nested levels, the dataset’s evidence and governance, and the additional sources required by the domain purpose.
Move from upstream purpose to downstream implementation. An algorithm cannot repair the wrong community question or an unsupported data abstraction.
Source: Tamara Munzner, Visualization Analysis and Design (2014), illustrations by Eamonn Maguire. Reproduced under CC BY 4.0. These are the same textbook cheat sheets cited in the Week 2 slides.
Data: a table of geospatial point records. Name, feature class/code, country, and timezone are categorical; GeoNames ID is an identifier; latitude, longitude, population, elevation, and DEM are quantitative. The selected records can be treated as geometry only after longitude and latitude are explicitly encoded as point positions.
Task: “Locate selected named features” pairs a search action with a spatial target. “Compare recorded settlement population” pairs a query action with a quantitative attribute target. “Compare water cultures” is not supported by these rows alone.
An idiom is the visual form—not the software. Select one root from the audience’s task, then inspect every demonstrated option beneath it.
Decision framework: Munzner (2014), Chapters 2–7; course synthesis also draws on Pu & Kay (2023), How Data Analysts Use a Visualization Grammar in Practice ↗. Mini figures are local teaching examples, not claims about a particular dataset.
Specify transformation, aggregation, order, missingness, rendering, accessibility, and failure behavior—then select a library suited to that work.
Search a task, idiom, or package. Each card includes a representative figure family and a direct official example or documentation URL.
The thumbnail is a representative output family drawn by this tutorial; follow “Official examples” to inspect output actually produced by each package. A package name is not an algorithmic justification.
Do not paste governance terminology. Connect a paper concept to something you actually inspected in the Dataset Card or original source.
Inspect producer, source, revision, fields, collection, license, transformations, and machine-readable metadata.
Inspect coverage, missingness, measurement, uncertainty, visible distortion, and what the dataset cannot establish.
Inspect authority, consent, cultural context, maintenance, correction, withdrawal, intended use, and downstream responsibility.
Observed. The Hugging Face Dataset Card exposes a public 14.9-million-row Parquet conversion and identifies CC BY 4.0; the upstream GeoNames dump documents the positional schema. FAIR still requires us to record the exact version, field mapping, selection, and transformation used (Wilkinson et al., 2016; Dataset Card ↗; upstream export ↗).
Inferred. The selected rows make the two locations geographically relevant, but they do not make the dataset sufficient for cultural-heritage or environmental-change claims. A polished paired map could invite viewers to infer symmetry or connection that the records do not establish (Lan & Liu, 2024; Ziman et al., 2026).
Open question. The dataset does not establish whether Kunshan or Venice communities defined the comparison, its benefits, or acceptable reuse. CARE distinguishes technical access from collective benefit and authority to control (Carroll et al., 2021).
UNESCO Venice ↗ documents designation context. It cannot represent everyday community experience; Kunshan priorities still require ethical local inquiry.
JRC Global Surface Water ↗ supports long-run water occurrence and change. It cannot establish cause, water quality, or cultural meaning.
OpenStreetMap ↗ supports waterways and places with attribution. Contributor coverage is uneven and features require verification.
Change the data foundation, idiom, interaction, algorithm, or claim because the critique gave you a reason.
The final Space should let an outside reader see the visualization, provenance, critique, revisions, and remaining limits without opening the README.
The earlier case named a cultural-heritage dataset while the visualized corridor did not come from its records.
Exact GeoNames rows now appear on real basemaps, with population compared on a labeled log scale while the interface separates supported geographic context from unsupported cultural and ecological claims.
Review my deployed Hugging Face Space: [PASTE URL]. Critique before revising.
1. PIPELINE — Apply Munzner’s four levels: domain; data/task (dataset and attribute types plus action + target); idiom selected through Compare / Understand Variation / Reveal Structure; algorithm/tool with explicit transformations, missingness, rendering, accessibility, performance, and reproducibility.
2. EVIDENCE — Apply and cite the assigned visualization, FAIR, CARE, and Croissant papers. Connect every concept to direct evidence from the Dataset Card or original source. Separate Observed, Inferred, and Open Question statements.
3. REDESIGN — Integrate only additional data that repair a named domain–evidence gap. Return complete revised site files in which the visualization, sources, critique, changes, and remaining limitations are visible on the rendered page—not only in README.md. Never invent dataset availability, community needs, or historical connections.This replaces the former long checklist. Each category contains the details another reader must be able to verify.