Project snapshot
Client / context: Personal civic-tech project / Grand Jury Hub
Live site: grandjuryhub.org
Role: Full-stack design engineer
Focus: Civic information architecture, public conversation UX, source-linked report publishing, Pol.is integration
Stack: Next.js, React, TypeScript, Convex, Tailwind CSS, shadcn/ui, Pol.is, OpenNext, Cloudflare Workers
One-line version
I designed and built a civic-tech platform that turns dense Civil Grand Jury report cycles into source-linked project pages, plain-language summaries, and structured public conversation spaces powered by Pol.is.
The challenge
Civil Grand Jury reports often contain valuable public-interest findings, but they are usually published as dense PDFs with limited pathways for community understanding or deliberation.
The design challenge was to create a product that could:
- make report cycles easier to browse and understand
- preserve links to authoritative source material
- organize reports, themes, public articles, and conversation prompts
- help residents move from passive reading to structured discussion
- integrate live Pol.is conversations without copying or owning Pol.is participation state
- deploy as a real, production-ready civic website rather than a static mockup
The initial seed focused on the 2025–2026 Tuolumne County Civil Grand Jury cycle.
My role
I designed and built the project end to end:
- defined the civic content model
- built the Next.js app structure and public routes
- modeled jurisdiction, cycle, report, theme, public-link, and conversation data in Convex
- created idempotent seed scripts for production content
- designed project, report, and conversation pages
- integrated Pol.is embeds and setup states
- added responsive navigation and topic selection
- implemented server-rendered SEO metadata, sitemap, robots, and social images
- configured Cloudflare/OpenNext deployment workflow
- documented setup, routes, data model, and Pol.is behavior
Selected work
1. Civic content model
The project needed more structure than a blog and more flexibility than a static PDF archive.
I modeled the domain around:
jurisdictionsreportCyclesreportspublicLinksthemesconversations
This made each Civil Grand Jury cycle a navigable civic project: reports could link to public articles, themes could group related concerns, and conversations could connect residents to specific questions.
2. Source-linked report cycle pages
I built public pages that organize a report cycle into readable sections instead of forcing users to start with raw PDFs.
The experience includes:
- project index page
- jurisdiction/cycle landing page
- report list and report summary pages
- public article links
- thematic groupings
- conversation cards
- direct links back to authoritative source PDFs
The goal was not to replace the official record. It was to make the official record easier to enter, understand, and discuss.
3. Pol.is conversation integration
Public deliberation was core to the concept, so I integrated Pol.is as the conversation layer.
I designed support for two modes:
- existing Pol.is conversations with stored public conversation IDs
- ID-less records that can initialize through a configured production Pol.is site ID
The app keeps local civic context - question, summary, citation, route, and report connection - while Pol.is remains the system of record for statements, votes, moderation, and conversation lifecycle.
This separation matters: Grand Jury Hub frames the civic context; Pol.is handles deliberation mechanics.
4. Conversation discovery and navigation
I refined the conversation experience so users could move across topics without getting lost.
Work included:
- dedicated conversation pages
- conversation cards embedded in project pages
- responsive civic conversation layout
- navigation between conversation topics
- random topic selection for the conversation picker
- card imagery and stronger visual hierarchy
- clearer embed states when Pol.is is unavailable or not yet configured
This turned individual embeds into a coherent public participation flow.
5. Plain-language seed content
The project needed starter content that was useful without pretending to be the official source.
I created and refined Tuolumne seed data with:
- plain-language summaries
- source report references
- public article links
- thematic prompts
- conversation questions
- stable slugs and idempotent upsert behavior
That made the app deployable with meaningful content while keeping the authoritative report links intact.
6. Production deployment and metadata
To make the project more than a prototype, I built deployment and publishing infrastructure:
- Convex deployment and seed scripts
- Cloudflare Workers build/deploy workflow through OpenNext
- production seed command
- server-rendered civic SEO metadata
- sitemap and robots routes
- Open Graph and Twitter image routes
- documentation for setup, routes, data model, and Pol.is configuration
This made Grand Jury Hub a repeatable civic publishing system, not a one-off page.
Design engineering approach
Treat public understanding as UX
The core user problem was not visual polish alone. It was comprehension. The information architecture had to help residents understand what happened, why it mattered, where the source material lived, and how to join a productive conversation.
Separate source, summary, and deliberation
I kept three layers distinct:
- source records and report PDFs
- locally authored summaries and civic framing
- live Pol.is participation state
That separation reduces confusion and preserves trust.
Build for repeatable civic publishing
The Tuolumne cycle was the first use case, but the data model supports other jurisdictions and report cycles. Stable slugs, seed scripts, and Convex schema design make the pattern repeatable.
Impact
Grand Jury Hub created a new civic product surface for turning public oversight reports into structured public engagement.
It provided:
- source-linked civic project pages
- accessible report summaries and public-link context
- thematic conversation prompts
- Pol.is-powered deliberation spaces
- a reusable Convex data model for jurisdictions and cycles
- production deployment through Cloudflare Workers
- SEO/social metadata for public sharing
- documentation for setup, routes, seed data, and Pol.is behavior
What made this hard
The project combined product design, civic information design, and full-stack implementation.
The hard parts were:
- making dense institutional content approachable without oversimplifying it
- keeping official sources visible and authoritative
- integrating Pol.is without taking over its state model
- designing routes and data that can scale beyond one county/cycle
- making the experience credible enough for public sharing
- shipping deployment, seed, and metadata infrastructure alongside UI
Why it matters
This case study shows how full-stack design engineering can serve civic participation. The work was not just building a website; it was designing a system that helps people move from public documents to shared understanding and structured conversation.
I created the product model, interface, backend data layer, civic content structure, Pol.is integration, and deployment path needed to make that possible.