Wiki source code of System Design

Version 1.1 by Robert Schaub on 2025/12/22 13:26

Show last authors
1 = System Design =
2
3 **UI/UX design for FactHarbor including POC and production interfaces**
4
5
6 == 1. Design Philosophy ==
7
8 **Core Principles:**
9 1. **Transparency First:** Show how verdicts were reached
10 2. **Clarity Over Completeness:** Don't overwhelm users
11 3. **Progressive Disclosure:** Details available on demand
12 4. **Quality Indicators Visible:** Users should see confidence levels immediately
13 5. **Mobile-First:** Majority of users on mobile devices
14
15
16 == 2. POC1 Interface Design ==
17
18 === 2.1 Input Screen ===
19
20 {{code}}
21 ┌──────────────────────────────────────┐
22 │ FactHarbor - Fact Analysis POC │
23 ├──────────────────────────────────────┤
24 │ │
25 │ Paste article text or URL: │
26 │ ┌─────────────────────────────────┐ │
27 │ │ │ │
28 │ │ (text input area) │ │
29 │ │ │ │
30 │ └─────────────────────────────────┘ │
31 │ │
32 │ [ Analyze ] │
33 │ │
34 │ Note: This is a POC. Results are │
35 │ AI-generated and may contain errors.│
36 └──────────────────────────────────────┘
37 {{/code}}
38
39 **Design Notes:**
40 * Simple, single-purpose interface
41 * Clear POC disclaimer
42 * No authentication/accounts needed
43
44
45 === 2.2 Results Display ===
46
47 {{code}}
48 ┌──────────────────────────────────────┐
49 │ FactHarbor Analysis Results │
50 ├──────────────────────────────────────┤
51 │ │
52 │ Quality Score: 8.5/10 ✅ │
53 │ Quality Gates: 2/2 Passed │
54 │ │
55 │ ═══════════════════════════════════ │
56 │ │
57 │ 📋 Claims Found: 3 verifiable │
58 │ (2 non-verifiable filtered) │
59 │ │
60 │ ─────────────────────────────────── │
61 │ │
62 │ CLAIM 1: [claim text] │
63 │ Verdict: ✅ WELL-SUPPORTED (85%) │
64 │ Sources: 4 │
65 │ [Show Details ▼] │
66 │ │
67 │ ─────────────────────────────────── │
68 │ │
69 │ CLAIM 2: [claim text] │
70 │ Verdict: ⚠️ PARTIALLY SUPPORTED (65%)│
71 │ Sources: 2 │
72 │ [Show Details ▼] │
73 │ │
74 │ ─────────────────────────────────── │
75 │ │
76 │ BLOCKED CLAIM: [opinion text] │
77 │ ❌ Non-factual (Opinion detected) │
78 │ Explanation: Contains subjective │
79 │ language ("best", "should") │
80 │ │
81 └──────────────────────────────────────┘
82 {{/code}}
83
84 **Design Features:**
85 * Quality score prominently displayed
86 * Color coding for verdict confidence
87 * Expandable details (progressive disclosure)
88 * Clear blocked claims with explanations
89
90
91 === 2.3 Claim Detail View ===
92
93 {{code}}
94 ┌──────────────────────────────────────┐
95 │ CLAIM: [full claim text] │
96 ├──────────────────────────────────────┤
97 │ │
98 │ Verdict: ✅ WELL-SUPPORTED │
99 │ Confidence: 85% (HIGH) │
100 │ │
101 │ Evidence Sources: 4 │
102 │ ┌──────────────────────────────────┐│
103 │ │ 📄 Source 1: Reuters ││
104 │ │ Quality: 0.9 (High) ││
105 │ │ [Supports claim] ││
106 │ │ [View source →] ││
107 │ ├──────────────────────────────────┤│
108 │ │ 📄 Source 2: BBC ││
109 │ │ Quality: 0.8 (High) ││
110 │ │ [Supports claim] ││
111 │ │ [View source →] ││
112 │ └──────────────────────────────────┘│
113 │ │
114 │ Reasoning: │
115 │ [AI-generated explanation of verdict]│
116 │ │
117 │ Quality Checks: │
118 │ ✅ Gate 1: Factual claim │
119 │ ✅ Gate 4: Sufficient evidence │
120 │ │
121 └──────────────────────────────────────┘
122 {{/code}}
123
124
125 == 3. POC2 Interface Enhancements ==
126
127 === 3.1 Added Features ===
128
129 **Scenario Display:**
130 {{code}}
131 ┌──────────────────────────────────────┐
132 │ CLAIM: [text] │
133 ├──────────────────────────────────────┤
134 │ │
135 │ Scenarios Evaluated: 2 │
136 │ │
137 │ 📍 Scenario A: [interpretation] │
138 │ Verdict: WELL-SUPPORTED (80%) │
139 │ [Show details ▼] │
140 │ │
141 │ 📍 Scenario B: [interpretation] │
142 │ Verdict: UNCERTAIN (45%) │
143 │ [Show details ▼] │
144 │ │
145 └──────────────────────────────────────┘
146 {{/code}}
147
148 **Evidence Provenance:**
149 * Show if multiple sources cite same underlying evidence
150 * Display deduplication results
151 * Provenance chain visualization
152
153 **Quality Metrics Dashboard:**
154 * Internal view showing all 4 gates
155 * Historical performance trends
156 * Hallucination rate tracking
157
158
159 == 4. Full System Design (V1.0+) ==
160
161 === 4.1 Additional Features ===
162
163 **User Accounts:**
164 * Save analyses
165 * Track corrections
166 * Contribute feedback
167
168 **Advanced Search:**
169 * Find previous analyses
170 * Filter by topic, verdict type
171 * Sort by date, relevance
172
173 **Corrections Banner:**
174 {{code}}
175 ┌──────────────────────────────────────┐
176 │ ⚠️ This analysis was corrected │
177 │ [View correction log →] │
178 └──────────────────────────────────────┘
179 {{/code}}
180
181 **Public Quality Dashboard:**
182 * Real-time metrics
183 * Transparency reports
184 * Historical trends
185
186
187 == 5. Responsive Design ==
188
189 **Mobile-First Approach:**
190 * Single column layout
191 * Touch-friendly targets
192 * Collapsible sections by default
193 * Fast load times
194
195 **Desktop Enhancements:**
196 * Multi-column layout where appropriate
197 * Side-by-side evidence comparison
198 * Advanced filters always visible
199
200
201 == 6. Accessibility ==
202
203 **WCAG 2.1 AA Compliance:**
204 * Keyboard navigation
205 * Screen reader support
206 * Color contrast ratios
207 * Alternative text for icons
208 * Focus indicators
209
210
211 == 7. Related Pages ==
212
213 * [[Architecture>>Test.FactHarbor.Specification.Architecture.WebHome]] - System architecture
214 * [[Requirements>>Test.FactHarbor.Specification.Requirements.WebHome]] - UI requirements
215 * [[Roadmap>>Test.FactHarbor.Roadmap.WebHome]] - Implementation phases
216
217
218 **Document Status:** ✅ Design Specified (POC1, POC2, V1.0)
219 **Version:** V0.9.70