Visual explanations
Interactive visual explanations of systems, frameworks and architectures — from how the internet and OAuth work to the Business Model Canvas, microservices and CI/CD. Each one is a real QueryChart FlowJam canvas you can open and edit.
All pages
- How the Internet Works — a visual explanation — How the internet works, explained on an interactive canvas: your device, the local network, ISP infrastructure and a web server, and how a request and its response travel across them.
- How DNS Works — domain names to IP addresses — How DNS works, shown on an interactive canvas: your device, the recursive resolver, and the root, TLD and authoritative servers that together turn a domain name into an IP address.
- How HTTPS Works — the TLS handshake explained — How HTTPS works, shown on an interactive canvas: the TLS handshake between browser and server, the certificate authority's role, and the encrypted session that follows.
- How OAuth Works — authorization code flow — How OAuth works, shown on an interactive canvas: the authorization code flow between the user, a client application, the authorization server and the resource server.
- How JWT Authentication Works — tokens without sessions — How JWT authentication works, shown on an interactive canvas: credentials, the three-part signed token, and how every request is verified statelessly.
- How REST APIs Work — one request round trip — How REST APIs work, shown on an interactive canvas: building an HTTP request, routing and validation on the server, and the response that completes the round trip.
- How Docker Works — build, ship, run — How Docker works, shown on an interactive canvas: Dockerfile to image, registry to container, and the namespaces and cgroups that isolate a process.
- How Kubernetes Works — desired state to running workloads — How Kubernetes works, shown on an interactive canvas: manifests, the control plane, scheduling, and the reconciliation loop that keeps workloads running.
- How Git Works — snapshots, branches and history — How Git works, shown on an interactive canvas: the working directory, staging area, local and remote repositories, and how commits build a shared history.
- How Large Language Models Work — training and inference — How large language models work, shown on an interactive canvas: pre-training, fine-tuning, and the token-by-token loop that produces every response.
- Business Model Canvas — the nine building blocks — The Business Model Canvas on an interactive canvas: all nine building blocks — partners, activities, resources, value propositions, customers, channels, relationships, costs and revenue — in one view.
- Lean Canvas — nine boxes for a startup model — The Lean Canvas on an interactive canvas: problem, solution, key metrics, unique value proposition, unfair advantage, channels, customer segments, costs and revenue.
- Customer Journey Map — five stages, five aligned rows — A customer journey map on an interactive canvas: actions, touchpoints, questions, pain points and opportunities across awareness, consideration, purchase, onboarding and retention.
- Product Development Lifecycle — idea to shipped product — The product development lifecycle on an interactive canvas: discover, define, design, build, test and launch — with validation gates and the loop that feeds the next cycle.
- Scrum Framework — the sprint cycle explained — The Scrum framework on an interactive canvas: the product backlog, sprint planning, daily stand-ups, the sprint review and the retrospective that closes each cycle.
- Agile Workflow — from requirements to release, on a loop — An agile workflow on an interactive canvas: requirements, backlog, sprint, demo, stakeholder acceptance, release and the retrospective that feeds the next loop.
- SWOT Analysis — strengths, weaknesses, opportunities, threats — A SWOT analysis on an interactive canvas: strengths and weaknesses inside the organisation, opportunities and threats outside it, split into helpful and harmful.
- Porter's Five Forces — what shapes industry profitability — Porter's Five Forces on an interactive canvas: new entrants, supplier power, buyer power, substitutes and the competitive rivalry they all feed.
- Value Chain Analysis — primary and support activities — Value chain analysis on an interactive canvas: the five primary activities that create value and the four support activities that enable them, plus the margin they produce.
- OKR Planning Framework — objectives and key results — The OKR framework on an interactive canvas: objectives and key results cascading from company to team to individual, plus the weekly and quarterly cadence that makes them work.
- Microservices Architecture — many small services, one system — Microservices architecture on an interactive canvas: the client layer, API gateway, independently deployed services, messaging, per-service data stores and observability.
- Monolithic Architecture — one deployable unit, one database — Monolithic architecture on an interactive canvas: one deployable application with UI, business logic and data access modules, a shared database, and the scaling ceiling that results.
- Event-Driven Architecture — produce, publish, consume — Event-driven architecture on an interactive canvas: producers, the event bus, subscribers and the event store, and how decoupling lets new consumers join without touching producers.
- Model-View-Controller (MVC) — input, update, render — The Model-View-Controller pattern on an interactive canvas: how user input reaches the controller, updates the model, and renders through the view.
- Clean Architecture — the dependency rule — Clean architecture on an interactive canvas: entities, use cases, interface adapters and frameworks, and the dependency rule that keeps the core independent.
- CI/CD Pipeline — from commit to production — A CI/CD pipeline on an interactive canvas: commit, build, tests, packaging, deployment to staging and production, and the gates that decide whether a release stays.
- User Authentication Flow — sign-up to validated session — A user authentication flow on an interactive canvas: account creation, credential hashing and storage, sign-in, session creation, and validating protected requests.
- API Request Lifecycle — every hop a request makes — The API request lifecycle on an interactive canvas: DNS, TCP and TLS setup, routing through the load balancer, server processing, and the response path.
- Data Pipeline Architecture — sources to insights — Data pipeline architecture on an interactive canvas: source systems, change data capture, ingestion, stream and batch processing, the warehouse, and the consumption that closes the loop.
- Cloud Deployment Architecture — request path and resilience — A cloud deployment architecture on an interactive canvas: the edge, load balancer, auto-scaling application tier, data tier and observability that keep a service up.