# GPT Image Hub prompt

## Interfejs Czatu AI z Infografiką Architektury LLM
- URL: https://www.gptimagehub.com/pl/library/ai-chat-interface-with-llm-architecture-infographic
- Generator URL: https://www.gptimagehub.com/pl/generate?promptId=oss-ym-g2-20258
- Markdown URL: https://www.gptimagehub.com/api/agent/markdown?path=%2Fpl%2Flibrary%2Fai-chat-interface-with-llm-architecture-infographic
- Category: Projekt UI / UX
- Model: gpt-image-2
- Aspect ratio: 3:4
- Style: graphic-design
- Tags: ui-czatu, zrzut-ekranu, infografika, transformer, llm, interfejs-webowy, schemat-techniczny
- Updated: 2026-10-27T22:40:23.098Z
- Created: 2026-10-27T22:40:23.098Z

Generuje zrzut ekranu aplikacji czatu AI z wbudowaną infografiką techniczną. Zmień temat w nawiasach, aby zilustrować inne zagadnienia.

### Full prompt
```text
A realistic vertical screenshot of a modern AI chat web application interface displaying an embedded technical infographic about [how Large Language Models (LLMs) work technically]. The app has a clean light gray background (#F4F4F6), subtle shadows, and crisp sans-serif typography.

Chat UI layout:
- Top bar: Circular user avatar on the left, conversation title "Visualizing LLM Architecture" with a tiny dropdown chevron, and a "Files" text button with a folder icon on the top right.
- User message bubble: Rounded white pill/card near top center-right containing the text: "make an image explaining how LLMs work technically".
- Status row: Directly below the prompt, reading "Scira task complete" with a tiny sparkle loader icon.
- Assistant response card: Large central rounded card housing the generated infographic.
- Assistant text: Below the infographic card, clean body text reading: "The image above is a comprehensive technical infographic breaking down how Large Language Models function under the hood. Here is a detailed walkthrough of each component shown:" followed by a bold section heading "Tokenization: From Text to Numbers".
- Bottom dock: Rounded pill input bar with placeholder text "Ask a follow-up...", a plus (+) attach button on the left, model selector badge "Kimi K2.6" with dropdown chevron, and a circular microphone voice button on the right.

Embedded Infographic Poster:
A crisp blue-and-white engineering-style technical diagram titled in bold navy capitals: "[HOW LARGE LANGUAGE MODELS (LLMs) WORK]". Clean white background, navy borders, light-blue accents, organized into 8 panels:
1. "INPUT: TOKENIZATION": Sentence "The quick brown fox jumps over the lazy dog." split into token blocks with corresponding token IDs.
2. "EMBEDDINGS": Token IDs mapping to high-dimensional dense vector tables.
3. "TRANSFORMER ARCHITECTURE": Layered stack showing Add & Norm, Feed-Forward Network, Multi-Head Self-Attention, input embeddings, and positional encoding.
4A. "SELF-ATTENTION MECHANISM (INSIDE ONE HEAD)": Matrix representations for Q, K, V vectors, dot product attention scores, softmax, and weighted sum equations.
4B. "ATTENTION: TOKENS ATTEND TO EACH OTHER": Network graph of token nodes connected by attention-weight lines.
5. "OUTPUT: NEXT TOKEN PREDICTION": Bar chart of probability distribution over vocabulary tokens (cat, sat, on, the, mat), highlighting predicted token "the".
6. "TRAINING: PRE-TRAINING WITH NEXT-TOKEN PREDICTION": Horizontal 5-stage pipeline strip: massive text corpus, training example generation, model prediction, loss calculation, and backpropagation.
7. Process connecting arrow: "Repeat for billions of examples over many epochs until convergence."
8. Summary callout box: Brain icon with explanatory text on generalized pattern learning.

Style: Vector schematic aesthetic, sharp lines, academic tech diagram, legible dense typography, no watermarks.
```