feat(makie): implement network-basic

[github-actions]

Implementation: network-basic - julia/makie

Implements the julia/makie version of network-basic.

File: plots/network-basic/implementations/julia/makie.jl

Parent Issue: #989

---

🤖 impl-generate workflow

[claude]

AI Review - Attempt 1/3

Image Description

Light render (plot-light.png): Warm off-white background (sampled #FAF8F1, not pure white). Bold dark title "Software Module Dependencies · network-basic · julia · makie · anyplot.ai" is fully visible and not clipped. A top-left "Layer" legend (Core/Data/API/UI swatches) sits on a light elevated box with a thin border, dark text, clearly readable. 22 module nodes, colored by layer (Core=#009E73 green, Data=lavender, API=blue, UI=ochre), sized by connection degree so hub modules (Auth, Gateway) read visibly larger than single-edge leaves. Gray edge lines (alpha ~0.45) connect nodes legibly. All node labels are dark ink beneath their nodes; checked via close crops around the densest hub (Auth) and the tightest cluster (UserRepo/OrderRepo/PaymentRepo) — no overlap with other labels, edges, or nodes. All text is readable against the light background.

Dark render (plot-dark.png): Warm near-black background (sampled #1A1A17, not pure black). Title, legend, and all 22 node labels flip to light ink and remain fully readable — no dark-on-dark failures found in the same hub/cluster regions checked above. Node colors are pixel-identical to the light render (Core green, Data lavender, API blue, UI ochre), confirming only chrome (background, text, legend box) flips between themes while the four categorical data colors stay fixed.

Both renders were opened and visually inspected in full, plus targeted crops (hub node, dense cluster, title bar, legend box, canvas edges) confirmed no clipping (AR-09 clear) and no label overlap.

Score: 89/100

Category	Score	Max
Visual Quality	28	30
Design Excellence	15	20
Spec Compliance	15	15
Data Quality	14	15
Code Quality	10	10
Library Mastery	7	10
Total	89	100

Visual Quality (28/30)

• VQ-01: Text Legibility (7/8) — all sizes explicit, readable in both themes; node-label fontsize (11) is on the small side for 22 simultaneous labels
• VQ-02: No Overlap (6/6) — verified via crops: zero label/edge/node collisions
• VQ-03: Element Visibility (5/6) — degree-encoded sizing gives clear hub/leaf differentiation, could be slightly more dramatic for the top-degree node
• VQ-04: Color Accessibility (2/2) — well-separated Imprint hues, consistent node strokes
• VQ-05: Layout & Canvas (4/4) — measured: graph body fills ~79% width / ~78% height with balanced margins; canvas is exactly 3200×1800
• VQ-06: Axis Labels & Title (2/2) — descriptive title; axes correctly omitted for a network layout
• VQ-07: Palette Compliance (2/2) — first series exact #009E73, canonical positions 2-4 for Data/API/UI, exact theme backgrounds, identical data colors across themes

Design Excellence (15/20)

• DE-01: Aesthetic Sophistication (6/8) - Thoughtful semantic layer-coloring and degree-sizing, clearly above a configured default, but still a fairly conventional force-directed composition
• DE-02: Visual Refinement (5/6) - Axes/spines fully hidden, subtle alpha-blended edges, background-matching node strokes, balanced generous whitespace
• DE-03: Data Storytelling (4/6) - Size + color create real hierarchy, but no single emphasized focal point beyond the size encoding itself

Spec Compliance (15/15)

• SC-01: Plot Type (5/5) — correct node-link network graph with force-directed layout
• SC-02: Required Features (4/4) — labeled/grouped nodes, source/target edges, 22 nodes (within spec's 10-50 range), degree-encoded size, non-overlapping labels
• SC-03: Data Mapping (3/3) — all 22 nodes and 28 edges rendered within plot bounds
• SC-04: Title & Legend (3/3) — mandated title format with descriptive prefix; legend matches module-layer categories

Data Quality (14/15)

• DQ-01: Feature Coverage (5/6) — hub/leaf variation and layer clustering shown well; missing an explicit directional cue even though the data models directed "depends on" relationships
• DQ-02: Realistic Context (5/5) — real, neutral, comprehensible software-architecture scenario
• DQ-03: Appropriate Scale (4/4) — layered dependency direction (UI→API→Data→Core) matches real software architecture conventions

Code Quality (10/10)

• CQ-01: KISS Structure (3/3)
• CQ-02: Reproducibility (2/2) — Random.seed!(42)
• CQ-03: Clean Imports (2/2)
• CQ-04: Code Elegance (2/2) — hand-rolled Fruchterman-Reingold correctly works around unavailable NetworkLayout.jl
• CQ-05: Output & API (1/1)

Library Mastery (7/10)

• LM-01: Idiomatic Usage (4/5) - Correct idiomatic CairoMakie: Axis, scatter!, linesegments!, text! with offsets, axislegend with proxy handles, hidedecorations!/hidespines!
• LM-02: Distinctive Features (3/5) - Batched linesegments! and offset-based labels are reasonably Makie-specific, but the overall composition could largely be replicated in other libraries

Score Caps Applied

• None

Strengths

• First categorical series (Core) is exact Imprint brand green #009E73, with Data/API/UI following canonical positions 2-4 — verified pixel-identical between light and dark renders
• Theme chrome is pixel-exact: light bg #FAF8F1, dark bg #1A1A17, with all text/legend correctly using theme-adaptive tokens
• Node size correctly encodes degree, giving hub modules an immediate visual hierarchy over leaf modules
• Realistic, plausible layered software-architecture dataset (Core → Data → API → UI)
• Zero label/edge overlap across all 22 node labels (verified via close crops)
• Canvas is exactly 3200×1800 in both renders; graph body uses ~79%/78% of the canvas with balanced margins
• Clean KISS structure with a reproducible seed; correctly hand-rolls force-directed layout given NetworkLayout.jl is unavailable in CI
• Title format and legend labels are exactly correct per spec

Weaknesses

• Edges render without directionality even though the data and title frame this as a dependency graph ("A depends on B" is not symmetric) — subtle arrowheads or tapered lines would fully capture the dependency semantics (DQ-01)
• The hub node (Auth) is distinguished only by size — a secondary emphasis technique (e.g. a subtle outer ring or extra stroke weight on the top 1-2 hub nodes) would sharpen the data-storytelling focal point (DE-03)
• The scatter+linesegments+text composition is correct but doesn't yet showcase a technique that's uniquely hard to replicate outside Makie (LM-02) — consider weight-keyed edge width/alpha or curved edges
• Node label fontsize (11) is on the smaller side for 22 simultaneous labels — worth double-checking mobile-scale (~400px) legibility

Issues Found

1. DQ-01 MEDIUM: No directional cue on edges despite modeling directed "depends on" relationships
   • Fix: Add subtle arrowheads (or line tapering) to linesegments! calls, or draw edges as short offset lines biased toward the target node
2. DE-03 LOW: No single emphasized focal point beyond size encoding
   • Fix: Add a subtle secondary visual emphasis (outer ring, heavier stroke, or brief annotation) on the highest-degree node(s) to sharpen the "this is the architectural bottleneck" story
3. LM-02 LOW: Generic-competent Makie usage, no standout distinctive feature
   • Fix: Consider edge width/alpha keyed to a computed weight, or curved/bezier edges for visual interest

AI Feedback for Next Attempt

Strong first attempt — palette, theme chrome, canvas, spec compliance, and code quality are all essentially perfect. To cross the 90 threshold: (1) add directional cues (arrowheads) to edges since the data models directed dependencies, not symmetric connections; (2) give the top hub node(s) one additional emphasis technique beyond size to create a clearer storytelling focal point; (3) consider a Makie-distinctive touch (weight-keyed edge styling or curved edges) to lift Library Mastery.

Verdict: REJECTED

[github-actions]

🔧 Repair Attempt 1/4

Applied fixes based on AI review feedback.

Status: Repair completed, re-triggering review...

---

🤖 impl-repair

[claude]

AI Review - Attempt 2/3

Image Description

Light render (plot-light.png): Warm off-white background (#FAF8F1, not pure white). Bold dark title "Software Module Dependencies · network-basic · julia · makie · anyplot.ai" is fully visible, not clipped. Top-left "Layer" legend (Core/Data/API/UI swatches) on a light elevated box, dark text, clearly readable. Bottom-center footnote explaining the edge width/opacity and arrow encodings is legible in soft ink. 22 module nodes colored by layer (Core=#009E73 green, Data=lavender, API=blue, UI=ochre), sized by degree, with the top-degree hub (Auth) now carrying an additional dark outer ring for focal emphasis. Gray edges vary in width/opacity by coupling-strength weight and terminate in small triangular arrowheads pointing at the depended-upon module — the directed "depends on" semantics are now explicit. All 22 node labels are dark ink beneath their nodes with no overlap against other labels, edges, or nodes. All text is readable against the light background.

Dark render (plot-dark.png): Warm near-black background (#1A1A17, not pure black). Title, legend, footnote, and all 22 node labels flip to light ink and remain fully readable — no dark-on-dark failures found. Node colors, arrowheads, the hub ring, and the weight-keyed edge styling are all pixel-identical in structure to the light render, confirming only chrome (background, text, legend box) flips between themes while the four categorical data colors stay fixed.

Both renders were opened and visually inspected in full, including the densest hub region (Auth) and the tightest cluster (UserRepo/OrderRepo/PaymentRepo) — no clipping (AR-09 clear) and no label overlap.

Score: 95/100

Category	Score	Max
Visual Quality	29	30
Design Excellence	17	20
Spec Compliance	15	15
Data Quality	15	15
Code Quality	10	10
Library Mastery	9	10
Total	95	100

Visual Quality (29/30)

• VQ-01: Text Legibility (7/8) — explicit sizes, readable in both themes; 12pt node labels are on the smaller side for 22 simultaneous labels
• VQ-02: No Overlap (6/6) — verified: zero label/edge/node collisions
• VQ-03: Element Visibility (6/6) — degree-based sizing plus the new hub ring gives clear, dramatic hub/leaf differentiation
• VQ-04: Color Accessibility (2/2) — well-separated Imprint hues, consistent node strokes
• VQ-05: Layout & Canvas (4/4) — balanced margins, canvas exactly 3200×1800, no clipping
• VQ-06: Axis Labels & Title (2/2) — descriptive title; axes correctly omitted for a network layout
• VQ-07: Palette Compliance (2/2) — first series exact #009E73, canonical positions 2-4, exact theme backgrounds, identical data colors across themes

Design Excellence (17/20)

• DE-01: Aesthetic Sophistication (7/8) - Semantic layer coloring, degree sizing, weight-keyed edges, and hub-ring emphasis together read clearly above configured defaults
• DE-02: Visual Refinement (5/6) - Axes/spines fully hidden, alpha-blended edges, background-matching node strokes, generous whitespace
• DE-03: Data Storytelling (5/6) - New outer ring on the hub node creates a clear focal point beyond size encoding alone

Spec Compliance (15/15)

• SC-01: Plot Type (5/5) — correct node-link network graph with force-directed layout
• SC-02: Required Features (4/4) — labeled/grouped nodes, directed source/target edges, 22 nodes within spec's 10-50 range, degree-encoded size
• SC-03: Data Mapping (3/3) — all 22 nodes and 28 edges rendered within plot bounds
• SC-04: Title & Legend (3/3) — mandated title format with descriptive prefix; legend matches module-layer categories

Data Quality (15/15)

• DQ-01: Feature Coverage (6/6) — hub/leaf variation, layer clustering, and now explicit directional arrows fully cover the directed-dependency semantics
• DQ-02: Realistic Context (5/5) — real, neutral, comprehensible software-architecture scenario
• DQ-03: Appropriate Scale (4/4) — layered dependency direction (UI→API→Data→Core) matches real software architecture conventions

Code Quality (10/10)

• CQ-01: KISS Structure (3/3)
• CQ-02: Reproducibility (2/2) — Random.seed!(42)
• CQ-03: Clean Imports (2/2)
• CQ-04: Code Elegance (2/2) — hand-rolled Fruchterman-Reingold correctly works around unavailable NetworkLayout.jl
• CQ-05: Output & API (1/1)

Library Mastery (9/10)

• LM-01: Idiomatic Usage (5/5) - Correct idiomatic CairoMakie: Axis, scatter!, linesegments!, text! with offsets, rotation-based markers, axislegend with proxy handles, hidedecorations!/hidespines!
• LM-02: Distinctive Features (4/5) - Per-segment weight-keyed linesegments! width/alpha and rotation-driven arrowhead markers are genuinely Makie-specific touches

Score Caps Applied

• None

Strengths

• All three attempt-1 weaknesses are fixed: edges now carry directed arrowheads (pulled back from the target node rim), the top hub module (Auth) gets a secondary outer-ring emphasis beyond size alone, and edge width/opacity are keyed to per-edge coupling-strength weight — a genuinely Makie-distinctive per-segment encoding via linesegments!
• First categorical series (Core) is exact Imprint brand green #009E73, with Data/API/UI following canonical positions 2-4 — pixel-identical between light and dark renders
• Theme chrome is pixel-exact: light bg #FAF8F1, dark bg #1A1A17, all text/legend using theme-adaptive tokens
• Node size correctly encodes degree, and the new hub ring sharpens the "architectural bottleneck" focal point without crowding the layout
• Realistic, plausible layered software-architecture dataset (Core → Data → API → UI) with a footnote explaining the width/opacity and arrow encodings
• Zero label/edge/node overlap across all 22 node labels in both renders; canvas is exactly 3200×1800
• Clean KISS structure, reproducible seed, hand-rolled Fruchterman-Reingold layout correctly working around the unavailable NetworkLayout.jl
• Title format and legend labels exactly match spec conventions

Weaknesses

• Node label fontsize (12) is still on the smaller side for 22 simultaneous labels — comfortably readable at full 3200×1800 resolution but worth a final check at ~400px mobile scaling
• The arrowhead + weight-keyed edge technique is a solid Makie-specific touch, but the overall composition remains a fairly conventional force-directed layout rather than something that showcases a truly unique library capability

Issues Found

None — all attempt-1 issues (DQ-01 directional cues, DE-03 focal point, LM-02 distinctive feature) were successfully addressed with no new problems introduced.

AI Feedback for Next Attempt

N/A — approved.

Verdict: APPROVED