254 lines
20 KiB
Markdown
254 lines
20 KiB
Markdown
# Iqra Times & Falah Research Institute
|
||
## Editorial Visual Data & Credibility Standard (SOP)
|
||
*Document Reference: FRI-SOP-2026-VISUAL-01*
|
||
*Classification: Institutional Best Practice — All Desks & Fellows*
|
||
*Effective Date: October 13, 2026*
|
||
|
||
---
|
||
|
||
### 1. Executive Mandate & Purpose
|
||
Civilizational intelligence, Shariah political economy, and strategic statecraft require more than compelling prose. To establish uncompromising credibility, executive authority, and empirical weight, **every article published on Iqra Times (iqra.falahos.my) must incorporate structured visual intelligence** whenever relevant to the topic.
|
||
|
||
A dispatch without data visualization risks being dismissed as subjective commentary. A dispatch anchored by a rigorous vector chart, an analytical matrix, or a mechanical process flowchart commands the authority of a Tier-1 broadsheet (e.g., *The Financial Times*, *The Economist*, *Foreign Affairs*).
|
||
|
||
---
|
||
|
||
### 2. The 4-Tier Visual Architecture Specification
|
||
|
||
Every publication workflow must deploy at least one (and ideally two to three) of the following visual tiers:
|
||
|
||
```
|
||
+------------------------------------------------------------------------+
|
||
| ARTICLE PROSE PIPELINE |
|
||
+------------------------------------------------------------------------+
|
||
| 1. [FT-STAT-GRID] Macro Metric / KPI Callout Strip |
|
||
| (3-4 high-impact data points at the lead) |
|
||
+------------------------------------------------------------------------+
|
||
| 2. [FT-VECTOR-CHART] Editorial SVG Data Chart |
|
||
| (Empirical trajectories, curves, spreads) |
|
||
+------------------------------------------------------------------------+
|
||
| 3. [FT-PROCESS-FLOW] Mechanism / Workflow Diagram |
|
||
| (Numbered procedural & decision stages) |
|
||
+------------------------------------------------------------------------+
|
||
| 4. [FT-COMPARISON-MATRIX] Analytical Broadsheet Table |
|
||
| (Contrasting models, lipids, legal paradigms)|
|
||
+------------------------------------------------------------------------+
|
||
```
|
||
|
||
#### Tier 1: Macro Metric / KPI Strip (`FT-STAT-GRID`)
|
||
* **Placement**: Immediately after the lead executive takeaway drawer.
|
||
* **Structure**: 3 to 4 columns featuring:
|
||
* Metric Number: `Playfair Display`, Georgia, serif (36px, bold, `#111111`).
|
||
* Metric Label: Uppercase, letter-spacing 1px (12px, bold, `#0E4D36`).
|
||
* Context Description: `Source Serif 4`, Georgia, serif (13–14px, `#4A443E`).
|
||
* **Trigger**: Mandatory whenever epidemiological, macro-financial, demographic, or survey statistics are referenced.
|
||
|
||
#### Tier 2: Handcrafted Vector SVG Data Chart (`FT-VECTOR-CHART`)
|
||
* **Format**: Responsive inline vector graphics (`<svg viewBox="0 0 700 260" style="width: 100%; height: auto;">`).
|
||
* **Palette Strictness**:
|
||
* Canvas Background: Financial Times Salmon Paper (`#FFF1E5`).
|
||
* Card Container: Broadsheet Card Shading (`#F8EBE0`), border `#E2D3C4`, top accent `#0E4D36`.
|
||
* Primary Trajectory / Benchmark: Forest Green (`#0E4D36`, width 3px).
|
||
* Risk / Counter-Trajectory: Broadsheet Burgundy (`#9E2A2B`, width 3px).
|
||
* Baseline & Axes: Deep Ink (`#111111`) and Muted Gridlines (`#E2D3C4` dashed).
|
||
* **Requirements**: Must include distinct axis labels, baseline markings, and clear inline coordinate markers.
|
||
|
||
#### Tier 3: Process Workflow & Mechanism Diagram (`FT-PROCESS-FLOW`)
|
||
* **Format**: Sequential step cards linked with directional indicators (`->`).
|
||
* **Usage**:
|
||
* Clinical protocols (e.g., Vagal nerve de-escalation, 4-stage dietary transitions).
|
||
* Legal procedures (e.g., Wasiyyah execution vs Mareva injunction for estate recovery).
|
||
* Architectural pipelines (e.g., The 5 Layers of Sovereign Istikhlaf Tech).
|
||
|
||
#### Tier 4: Comparative Analytical Matrix (`FT-COMPARISON-MATRIX`)
|
||
* **Format**: Clean broadsheet tables wrapped in `.ft-card` styling:
|
||
* Table Header: `#E7F3EE` green-tinted background with `#0E4D36` bold uppercase text.
|
||
* Cell Borders: Subdued hairline dividers (`#E2D3C4`).
|
||
* Cell Typography: `Source Serif 4`, Georgia, serif (14px, line-height 1.45).
|
||
* **Usage**: Side-by-side paradigm comparisons (e.g., Extractive Venture Debt vs Khadijah Mudarabah, Western Outsourced Nursing Homes vs Multigenerational Shield).
|
||
|
||
---
|
||
|
||
### 3. Scholarly Captioning Standard
|
||
No visual element may be inserted without an explicit, standalone caption. Captions must follow this syntax:
|
||
|
||
> **Figure X.X: [Descriptive Title of the Metric/System]**
|
||
> *[Detailed caption explaining the exact parameters, units, date ranges or sample size, and the primary analytical deduction. Must name the institutional, empirical, or historical source].*
|
||
|
||
**Negative Rule**: Purely decorative stock imagery or generic AI illustrations with zero data content are strictly prohibited within the analytical body prose.
|
||
|
||
---
|
||
|
||
### 4. Technical Implementation in Ghost Lexical AST
|
||
|
||
Visual assets are injected into Ghost 5.x via native Lexical `html` cards:
|
||
|
||
```json
|
||
{
|
||
"type": "html",
|
||
"version": 1,
|
||
"html": "<div style=\"background: #F8EBE0; border: 1px solid #E2D3C4; border-top: 3px solid #0E4D36; padding: 24px; margin: 34px 0; border-radius: 4px;\">...</div>"
|
||
}
|
||
```
|
||
|
||
#### Typography Isolation Guidelines:
|
||
* Outer card container must enforce clean system or serif font-family to avoid font inheritance collisions.
|
||
* All figure headers must use uppercase tracking: `letter-spacing: 1.5px; font-weight: 700; color: #0E4D36;`.
|
||
* Table and card body text must harmonize with the broader publication font (`Source Serif 4` / `Playfair Display`).
|
||
|
||
---
|
||
|
||
### 5. Pre-Publication Quality Checklist
|
||
|
||
Before any dispatch is set to `status: "published"`, the editor/agent must verify:
|
||
|
||
- [ ] **Relevance**: Does the visual asset directly illuminate the core thesis of the article?
|
||
- [ ] **Empirical Rigor**: Are all data points verified against authentic datasets or classical texts?
|
||
- [ ] **Aesthetic Coherence**: Does the visual strictly utilize the FT Broadsheet color palette?
|
||
- [ ] **Caption Completeness**: Is there an explicit Figure number and informative caption?
|
||
- [ ] **Mobile Responsiveness**: Does the `<svg>` or `<table>` scale cleanly on mobile viewports (`overflow-x: auto`)?
|
||
- [ ] **No Raw Artifacts**: Are there zero unparsed markdown asterisks or escaped entities in the card?
|
||
|
||
---
|
||
*Maintained by the Visual Intelligence & Graphics Desk, Falah Research Institute.*
|
||
|
||
---
|
||
|
||
### Appendix A: Production Case Study — Wednesday, October 14, 2026 Lineup
|
||
The following 5-dispatch flagship series demonstrates the full operational implementation of this visual SOP across our 5 core editorial desks:
|
||
|
||
1. **Hamza Khalid (Corridors of Power)**:
|
||
- *Title*: *mBridge in Production: The Geoeconomics of Wholesale Multi-CBDC Settlement Bypassing SWIFT*
|
||
- *Visual Suite*: Figure 1.1 (Cross-border settlement latency & fee spread SVG chart) + 3-KPI Stat Grid (B Gulf-Asia clearing, 14s latency, 0% USD intermediary) + Atomic PvP Settlement Mechanism Flowchart.
|
||
2. **Dr. Tariq Al-Amiri (Wealth, Waqf & Succession)**:
|
||
- *Title*: *The Synthetic Dollar Trap: Delta-Neutral Basis Trades, Ethena USDe, and the Shariah Anatomy of Riba*
|
||
- *Visual Suite*: Figure 2.1 (Perpetual funding rate volatility & liquidation inversion curve SVG) + 3-KPI Stat Grid (.4B market cap, 14.2% basis yield, -4.8% inversion threshold) + Cash-and-Carry Basis Trades vs Murabahah Matrix.
|
||
3. **Dr. Hakim Zainur Rahman (The Shifa Desk)**:
|
||
- *Title*: *The Somatics of Itminan al-Qalb: Vagal Nerve Stimulation, Heart-Rate Variability (HRV), and the Neurobiology of Dhikr*
|
||
- *Visual Suite*: Figure 3.1 (Power Spectral Density of HRV comparing chronic anxiety vs 0.1 Hz resonant Dhikr) + 3-KPI Stat Grid (0.1 Hz Mayer wave resonance, +42% HF-HRV, <8 min parasympathetic shift) + Afferent Vagal Signaling Loop Diagram.
|
||
4. **Maryam Al-Andalusi (The Classical Polymath)**:
|
||
- *Title*: *Beyond Instrumental Reason: How Al-Ghazali Anticipated Algorithmic Determinism and Modern Existential Risk*
|
||
- *Visual Suite*: Figure 4.1 (Synthetic data recursion & model entropy decay curve SVG) + 3-KPI Stat Grid (100% probabilistic optimization, 900 years since Tahafut, 3 epistemic faculties) + Instrumental Reason vs Ghazalian Wisdom Matrix.
|
||
5. **Jauhari Che Wan (The Jauhari Column)**:
|
||
- *Title*: *The Calm Software Manifesto: Designing Digital Tools for the Contemplative Mind in an Age of Attention Extraction*
|
||
- *Visual Suite*: Figure 5.1 (Attention half-life & cognitive recovery horizon SVG chart) + 3-KPI Stat Grid (144 daily unlocks, 0 red badges, 2.5x sustained focus) + The 5 Pillars of Calm Sovereign Software Flowchart.
|
||
|
||
|
||
---
|
||
|
||
### 6. The Heavy Topic Multi-Part Continuity Protocol (Mandatory)
|
||
*Directive: Elimination of Isolated Epistemic Fragments*
|
||
|
||
A major structural defect in serious intellectual journalism is leaving dense, complex subjects as isolated one-off articles, which leaves readers floating without intellectual resolution or practical synthesis.
|
||
|
||
**Effective Immediately:**
|
||
Any heavy or complex domain—including Metaphysics (*Kalam & Falsafa*), Complex Macro-Monetary Architecture (CBDCs, Sovereign Debt, De-Dollarization), Advanced Fiqh Jurisprudence, and Somatic Neurobiology—**MUST NOT be published as a standalone, isolated essay**.
|
||
|
||
#### Required Multi-Part Dialectical Structure:
|
||
Every heavy topic must be planned and executed as a multi-part series adhering to the classical scholastic trajectory:
|
||
1. **Part I: The Proposition & Diagnosis (*Al-Da'wa*):** The historical foundation, the emergence of the modern problem, and the provocative thesis.
|
||
2. **Part II: The Disputation & Dialectic (*Al-Munazarah*):** The formal scholastic debate, counter-arguments, and opposing intellectual camps (e.g., Ghazalian Occasionalism vs Averroistic Secondary Causality).
|
||
3. **Part III: The Textual Commentary & Nuance (*Al-Sharh wa'l-Hashiyah*):** Linguistic precision, metaphysical definitions (*Wujud, Mahiyyah, Sabab*), and addressing edge-case objections.
|
||
4. **Part IV / V: The Synthesis & Sovereign Resolution (*Al-Tahqiq*):** The practical, contemporary verdict for policymakers, entrepreneurs, and believers in the 21st century.
|
||
|
||
#### Mandatory Series Navigation UI:
|
||
Every installment in a heavy topic series must include an interactive broadsheet series navigation ribbon at the top and bottom of the article:
|
||
```html
|
||
<div style="background: #E7F3EE; border: 1px solid #0E4D36; border-left: 4px solid #0E4D36; padding: 12px 18px; margin-bottom: 24px; border-radius: 4px;">
|
||
<span style="font-size: 11px; font-weight: 700; color: #0E4D36; text-transform: uppercase; letter-spacing: 1px;">Part X of Y in the [Series Title] Series</span>
|
||
<div style="font-size: 14px; color: #111; font-weight: 600; margin-top: 4px;">[Previous Article Link] | [Current Article] | [Next Article Link]</div>
|
||
</div>
|
||
```
|
||
|
||
---
|
||
|
||
### 7. Heritage & Open-Access Image Sourcing Protocol (Beyond Unsplash)
|
||
*Directive: Sovereign Curation, Manuscript Provenance, and Zero Hotlinking*
|
||
|
||
While modern stock photography engines like Unsplash provide convenient filler, their default aesthetics introduce severe editorial liabilities for *Iqra Times*:
|
||
1. **Silicon Valley Stock Homogeneity**: Desaturated coffee cups, laptops, and abstract neon light streaks erode intellectual seriousness.
|
||
2. **Manuscript & Civilizational Deficit**: Discussions on *Kalam*, *Falsafa*, *Tibb*, and *Usul* require authentic illuminated folios, astronomical astrolabes, and classical calligraphic plates that stock libraries do not possess.
|
||
3. **Geopolitical Inaccuracy**: Critical dispatches across the OIC require authentic cartographic archives, diplomatic photography, and historical documentation.
|
||
|
||
Contributing authors and editorial agents must source featured and article hero imagery from verified open-access museum collections, scientific archives, and public domain repositories.
|
||
|
||
#### 7.1 Editorial Pillar to Archive Engine Mapping
|
||
|
||
* **Islamic Thought, Kalam & Metaphysics** (*Maryam Al-Andalusi, Wan Jauhari*):
|
||
* **The Metropolitan Museum of Art Open Access** (`departmentId=14` — Islamic Art): Over 15,000 public domain items dedicated under **CC0** (Nishapur ceramics, Ilkhanid Qur'ans, astrolabes, Persian miniatures). API: `https://collectionapi.metmuseum.org/public/collection/v1/`.
|
||
* **Smithsonian Open Access (Freer & Sackler Galleries)**: Premier collection of Arabic calligraphy, early Kufic script, and Persian poetry folios under **CC0**. API via `api.data.gov` or AWS S3 bucket `s3://smithsonian-open-access`.
|
||
* **Rawpixel Public Domain**: Master color-corrected restorations of Owen Jones’ Alhambra Moorish geometric studies and Islamic arabesque borders under **CC0**.
|
||
* **Shifa: Medicine, Neurobiology & Bioethics** (*Dr. Hakim Zainur Rahman*):
|
||
* **Wellcome Collection**: World's leading archive for medical and scientific history under **Public Domain / CC BY 4.0**. Holds foundational manuscripts: Ibn Sina's (*Avicenna*) *Kitab al-Qanun fi al-Tibb*, Al-Razi's pharmacological studies, and Al-Zahrawi's surgical instruments. API: `https://api.wellcomecollection.org/catalogue/v2/`.
|
||
* **Rawpixel Vintage Botanical / Herbarium**: Archival scientific flora, medicinal herbs, and historical anatomical drawings.
|
||
* **Geopolitics & Corridors of Power** (*Hamza Khalid, Maryam Al-Andalusi*):
|
||
* **Wikimedia Commons**: Indispensable archive for global political leadership, OIC summit diplomacy, historical conflicts, and regional architecture under **CC BY-SA / CC0**. MediaWiki API & `Special:FilePath`.
|
||
* **Library of Congress (LOC.gov)**: Ottoman photography (Sultan Abdul Hamid II Collection), historical Near East & Nusantara cartography, and diplomatic treaties in the **Public Domain**. Append `?fo=json` to any query for zero-auth JSON API access.
|
||
* **Cosmogenesis, Astronomy & Science** (*Dr. Hakim Zainur Rahman*):
|
||
* **NASA Image and Video Library**: James Webb Space Telescope deep fields, nebulae, and planetary observation in the **Public Domain** (US Govt). API: `https://images-api.nasa.gov/`.
|
||
* **USGS EROS / EarthExplorer**: Satellite Earth observation capturing desertification, water basins (Tigris-Euphrates, Nile), and climate transitions.
|
||
* **FinTech, Trade Corridors & Halal Economy** (*Hamza Khalid, Dr. Tariq Al-Amiri*):
|
||
* **Pexels**: Primary reserve for contemporary Asian/Middle Eastern urban infrastructure, high-speed rail, and global workforce. Custom Pexels License allows free commercial use.
|
||
* **Rijksmuseum (Rijksstudio)**: 16th–19th century maritime Southeast Asia, Straits of Malacca, Indian Ocean spice routes, and Dutch-Indies trading charts under **CC0 / Public Domain**. API: `https://data.rijksmuseum.nl/`.
|
||
* **Pixabay**: Supplemental open vector illustrations, botanical line art, and geometric dividers.
|
||
* **Cross-Archive Discovery (Federated Search)**:
|
||
* **Openverse (WordPress Foundation)**: Federated search index querying over 700 million CC-licensed works across global libraries and museums. REST API: `https://api.openverse.org/v1/`.
|
||
|
||
#### 7.2 Master Comparative Sourcing Matrix
|
||
|
||
| Repository | Primary Subject Domain | License Type | API Integration | Islamic / Heritage Depth | Ghost Media Policy |
|
||
| :--- | :--- | :--- | :--- | :--- | :--- |
|
||
| **The Met Open Access** | Classical Islamic art, folios, ceramics, carpets | **CC0 (Public Domain)** | REST (No key required) | **Exceptional (Tier 1)** | Ingest & Self-Host |
|
||
| **Smithsonian Asian Art** | Early Kufic script, Persian miniatures, metalwork | **CC0 (Public Domain)** | REST (`api.data.gov`) | **Exceptional (Tier 1)** | Ingest & Self-Host |
|
||
| **Wellcome Collection** | Islamic medicine (*Tibb*), Avicenna, anatomy | **Public Domain / CC BY 4.0** | REST Catalogue API & IIIF | **Exceptional (Tier 1)** | Ingest & Self-Host |
|
||
| **Library of Congress** | Ottoman history, Near East & Nusantara maps | **Public Domain** | Zero-auth (`?fo=json`) | **Very High** | Ingest & Self-Host |
|
||
| **Rijksmuseum** | Maritime Southeast Asia, Malacca, Indian Ocean | **CC0 / Public Domain** | REST API with free key | **High (Maritime/Nusantara)** | Ingest & Self-Host |
|
||
| **Wikimedia Commons** | Geopolitics, OIC leaders, modern conflicts | **CC BY-SA / CC0** | MediaWiki Action API | **Very High** | Ingest & Self-Host |
|
||
| **NASA Media Library** | Cosmogenesis, *Ilm al-Falak*, deep-space | **Public Domain** | REST (`images-api.nasa.gov`) | **Specialized (Cosmology)** | Ingest & Self-Host |
|
||
| **Rawpixel Public Domain** | Alhambra geometric plates, antique bookplates | **CC0** | Direct Web Download | **High (Patterns & Borders)** | Ingest & Self-Host |
|
||
| **Openverse** | Federated CC engine across global museums | **Aggregated CC (CC0, CC BY)**| REST API (OAuth2) | **Very High** | Ingest & Self-Host |
|
||
| **Pexels** | Modern editorial photojournalism & urban life | **Pexels Free License** | REST API (20k req/mo) | **Moderate (Modern Urban)** | Ingest & Self-Host |
|
||
| **Pixabay** | Line art, arabesque vectors, infographics | **Pixabay Free License** | REST API (5k req/hr) | **Moderate (Vectors/Icons)** | Ingest & Self-Host |
|
||
|
||
#### 7.3 Technical Ingestion Mandate: Zero Hotlinking Policy
|
||
|
||
> [!CAUTION]
|
||
> **Strict Operational Rule: Never Hotlink External Museum or Third-Party Image URLs Directly in Ghost Content.**
|
||
|
||
Direct hotlinking to external institutions triggers four critical production failures:
|
||
1. **Responsive Image Breakdown**: Ghost automatically generates multi-resolution responsive WebP variants (`300w`, `600w`, `1000w`, `1600w`, `2000w`) **only** for images uploaded directly to its media store (`/content/images/`). Hotlinked images force mobile readers to download full uncompressed 25MB museum TIFFs/JPEGs.
|
||
2. **Referrer Blocking & 403 Forbidden Errors**: Major museums deploy hotlink prevention rules that block images when requested from external domain iframes or `<img>` tags.
|
||
3. **Archive Link Rot**: Curatorial CDN paths mutate across collection software migrations, permanently breaking published article hero cards.
|
||
4. **CORS & Core Web Vitals Latency**: External DNS handshakes severely downgrade Largest Contentful Paint (LCP) performance.
|
||
|
||
**Required Ingestion Lifecycle:**
|
||
1. Query the curatorial API for the high-res public domain master.
|
||
2. Download and optimize image to WebP (maximum width 2400px, 85% quality target, file size < 400KB).
|
||
3. Upload to Ghost Media Store via Ghost Admin API (`POST /ghost/api/admin/images/upload/`).
|
||
4. Set the returned relative `/content/images/...` path as `feature_image`.
|
||
|
||
#### 7.4 Standardized Broadsheet Attribution & Citation Template
|
||
|
||
Every featured image and in-text artwork must be accompanied by an explicit, scholarly attribution caption in Ghost:
|
||
|
||
**Standard Citation Syntax:**
|
||
> *[Object / Artwork Title]*, [Date or Dynasty / Era]. Created by [Artist / Originating Culture]. Preserved by **[Institution / Source Collection]** ([Catalog / Accession ID]). License: [License Type]. [Direct Archive Link]
|
||
|
||
**Approved Production Examples for Authors:**
|
||
|
||
* **The Met (CC0 / Islamic Thought):**
|
||
> *Folio from a Qur'an Manuscript in Kufic Script*, 9th–10th century. Abbasid Near East. Collection of **The Metropolitan Museum of Art** (Acc. No. 2004.88). Open Access / CC0. [View Archive Record](https://www.metmuseum.org/art/collection/search/452814)
|
||
|
||
* **Wellcome Collection (CC BY 4.0 / Shifa Desk):**
|
||
> *Diagram of the Human Nervous System from Mansur's Anatomy (Tashrih-i Mansuri)*, ca. 14th–15th century. Collection of **Wellcome Collection** (MS. 544). Licensed under [CC BY 4.0](https://creativecommons.org/licenses/by/4.0/). [View Archive Record](https://wellcomecollection.org/works/a2862c2f)
|
||
|
||
* **Wikimedia Commons (CC BY-SA 2.0 / Geopolitics):**
|
||
> *Courtyard of the Great Mosque of Kairouan*, Tunisia. Photo by Richard Mortel. Distributed via **Wikimedia Commons** under [CC BY-SA 2.0](https://creativecommons.org/licenses/by-sa/2.0/).
|
||
|
||
* **NASA (Public Domain / Cosmogenesis):**
|
||
> *The Carina Nebula Captured by the James Webb Space Telescope*, 2022. Captured by **NASA, ESA, CSA, and STScI**. Public Domain. [View NASA ID: GSFC_20220712_Carina](https://images-api.nasa.gov/)
|
||
|
||
* **Pexels (Editorial Modern):**
|
||
> *High-Speed Transit and Modern Architecture in Kuala Lumpur*, 2024. Photo by Umar Mukhtar via **Pexels**. Free to use under the Pexels License.
|
||
|