WIREFRAME SKETCHES
🧭 NAVIGATION STRUCTURE
Main Application Navigation
Dashboard
Projects
🔍 Search
📚 Documents
⚙️ Admin
+ New Project
🔔
👤
Main Navigation Menu
📊 Dashboard
Overview of all projects and activity
📁 Projects
• All Projects
• Recent Projects
• Archived Projects
🔍 Enterprise Search
Search across all documents and modules
📚 Document Library
• OEM Documents
• Data Modules
• Illustrations
⚙️ Admin (Admin Only)
• User Management
• System Settings
• Analytics
👤 Profile
• My Profile
• Settings
• Sign Out
Project Workspace Sidebar
Sailboat Type 1 Maintenance
📋 Overview
📄 Data Modules
• All Modules (24)
• By System
• By Status
• + New Module
🏗️ SWBS
• View Structure
• Edit Systems
📚 Documents
• OEM Library
• Upload Documents
⚙️ Settings
• Project Settings
• Team Members
• Export/Import
🧭 ROLE-BASED NAVIGATION
Navigation Based on User Role
👑 ADMIN
✓ Dashboard
✓ Projects (All)
✓ Enterprise Search
✓ Document Library
✓ Admin Panel
✓ User Management
✓ System Settings
✓ Profile & Settings
✏️ EDITOR
✓ Dashboard
✓ Projects (Assigned)
✓ Enterprise Search
✓ Document Library
✓ Create/Edit Modules
✓ Upload Documents
✓ View SWBS
✓ Profile & Settings
✗ Admin Panel
✗ User Management
👁️ VIEWER
✓ Dashboard
✓ Projects (Assigned)
✓ Enterprise Search
✓ Document Library
✓ View Modules
✓ View SWBS
✓ Profile & Settings
✗ Create/Edit
✗ Upload Documents
✗ Admin Panel
📋 COMPLETE SCREEN INDEX
AUTHENTICATION & SETUP
1. Login Screen
2. Dashboard
3. Create Project
4. Select Product Type
5. OEM Document Upload
DOCUMENT CREATION
6. Project Workspace
7. Define Data Module Code (DMC)
8. Choose Pre-fill Method
9. AI-Assisted Editor
10. Export Data Module
18. Select Documents for AI Generation
SEARCH & AI
15. Enterprise Search
16. Document Selection for Chat
17. AI Chat Interface
MANAGEMENT
11. User Roles Management (Admin)
12. Add/Edit User
13. SWBS Definition
14. Add/Edit SWBS System
19. Project Settings
20. User Profile & Settings
21. OEM Document Library (Enhanced)
1. LOGIN SCREEN
S1000D Documentation Platform
2. DASHBOARD (WITH NAVIGATION)
Dashboard
Projects
🔍 Search
📚 Documents
⚙️ Admin
+ New Project
🔔
👤
Active
Sailboat Type 1 Maintenance
SLBT1-MAINT
📊 24 Data Modules
👥 3 Members
👥 3 Members
+
Create New Project
3. CREATE PROJECT
Create New Project
1
2
3
4. SELECT PRODUCT TYPE
Select Product Type
✓
2
3
Choose an existing product type or create new
Sailboat Type 1
30-foot leisure sailboat
Model: SLBT1 | Category: Sailboat | Systems: 12
+
Create New Product Type
Define custom system breakdown
5. OEM DOCUMENT UPLOAD
📚 OEM Document Library
💡 Upload OEM Documents (Admin Only)
AI will analyze and extract content to help create S1000D modules
📤
Drop OEM documents here
or click to browse
PDF, Word, Excel • Max 50MB
Uploaded Documents (2)
📄
Engine Maintenance Manual.pdf
System: B10 - Engine | 4.5 MB | ✓ Processed
6. PROJECT WORKSPACE (WITH SIDEBAR NAVIGATION)
Dashboard
Projects
🔍 Search
📚 Documents
🔔
👤
Data Modules
Approved
DMC: SLBT1-AAA-B10-00-00-00A-041A-A
Engine - Description
Comprehensive description of diesel engine system
System: B10 - Engine | Info: 041 - Description | Modified: 3 days ago | 📷 3 illustrations
Draft
DMC: SLBT1-AAA-B10-00-00-00A-520A-A
Engine - Remove
Removal procedures for diesel engine
System: B10 - Engine | Info: 520 - Remove | Modified: 1 hour ago | ⚠️ 2 validation issues
7. DEFINE DATA MODULE CODE (DMC)
Create New Data Module
Define Data Module Code (DMC)
DMC Preview:
SLBT1-AAA-???-00-00-00A-???-A
From product type (auto-filled)
8. CHOOSE PRE-FILL METHOD
Choose Content Generation
Choose Content Generation Method
✨
AI from OEM Docs
AI generates content from uploaded documents
✓ Fast creation
✓ Based on source docs
✓ Pre-validated structure
✓ Based on source docs
✓ Pre-validated structure
📄
From Template
Use standard S1000D template
✓ Standard structure
✓ Pre-validated
✓ Manual entry
✓ Pre-validated
✓ Manual entry
✏️
Start from Scratch
Blank editor with AI assistance
✓ Full control
✓ AI suggestions
✓ Blank canvas
✓ AI suggestions
✓ Blank canvas
✨
AI Will Generate:
✓ Structured content based on info code
✓ Technical descriptions from OEM specs
✓ Procedural steps with safety warnings
✓ Relevant illustrations
✓ Cross-references to related modules
✓ Technical descriptions from OEM specs
✓ Procedural steps with safety warnings
✓ Relevant illustrations
✓ Cross-references to related modules
9. AI-ASSISTED EDITOR
Engine - Description
SLBT1-AAA-B10-00-00-00A-041A-A
✓ Valid S1000D
Description
✓ Grammar checked | ✓ S1000D compliant | View OEM source
Technical Specifications
| Type | 4-stroke diesel |
| Cylinders | 6 in-line |
| Power Output | 150 HP @ 2300 RPM |
Illustrations
🖼️
Engine Overview Diagram
ICN: ICN-SLBT1-A-B1000-A-00001-A-001-01
From OEM Doc
Page 45
10. EXPORT DATA MODULE
Export Data Module
Export Options
📄
S1000D XML
Native format
📕
PDF
Human-readable
Export Summary
Format:
S1000D XML
File size (estimated):
245 KB
Illustrations:
3 files
11. USER ROLES MANAGEMENT (ADMIN)
Admin Panel | User Management
ADMIN
👤
John Smith
john.smith@company.com
Last active: 2 hours ago
Project Access:
Sailboat Type 1 (Editor)
Cargo Ship A (Viewer)
👤
Sarah Johnson
sarah.j@company.com
Last active: 1 day ago
Project Access:
Sailboat Type 1 (Editor)
12. ADD/EDIT USER
Add New User
Admin: Manage users, upload OEM docs, full access
Editor: Create/edit S1000D modules, view documents
Viewer: Read-only access to projects
Editor: Create/edit S1000D modules, view documents
Viewer: Read-only access to projects
💡 User will receive an email invitation to set their password
13. SHIP/WORK BREAKDOWN STRUCTURE (SWBS)
Sailboat Type 1 Maintenance | SWBS Configuration
💡 Ship/Work Breakdown Structure
Define the hierarchical structure of systems, subsystems, and assemblies for your vessel. This structure maps to S1000D system codes.
A10 - Hull - Structure
Primary hull structure and framework
Category: Hull & Structure | 3 Subsystems | 8 Data Modules
Subsystems:
• A11 - Hull Plating
• A12 - Keel Structure
• A13 - Deck Structure
B10 - Propulsion - Engine
Diesel engine and propulsion system
Category: Propulsion | 2 Subsystems | 12 Data Modules
Subsystems:
• B11 - Main Engine
• B12 - Propeller & Shaft
C10 - Electrical - Power
Electrical power generation and distribution
Category: Electrical | 4 Subsystems | 15 Data Modules
14. ADD/EDIT SWBS SYSTEM
Add New System
2-3 character code (e.g., A10, B10, C10)
Subsystems (Optional)
15. ENTERPRISE SEARCH (WITH NAVIGATION)
Dashboard
Projects
🔍 Search
📚 Documents
🔔
👤
🔍 Enterprise Search
💡 Try: "How do I remove the engine?" or "What are the safety procedures for fuel system?"
Search Results (24 found)
Engine - Remove Procedure
DMC: SLBT1-AAA-B10-00-00-00A-520A-A
...To remove the engine, first ensure the vessel is properly secured. Disconnect all electrical connections and fuel lines. Use lifting equipment rated for the engine weight...
Project: Sailboat Type 1 | System: B10 - Engine | Modified: 3 days ago
Engine Maintenance Manual.pdf
OEM Document | Page 45
...The engine removal procedure requires specialized tools. Refer to section 4.2 for detailed steps. Safety warnings must be observed...
Uploaded: 2 weeks ago | Processed: ✓ | 4.5 MB
Engine - Description
DMC: SLBT1-AAA-B10-00-00-00A-041A-A
The diesel engine is a six-cylinder, four-stroke marine engine designed for reliable propulsion. The engine features direct fuel injection...
Project: Sailboat Type 1 | System: B10 - Engine | Status: Approved
16. DOCUMENT SELECTION FOR CHAT
Select Documents for Chat
3 selected
💡 Select documents to include in your conversation
The AI will have context from all selected documents. You can add or remove documents during the chat.
Engine - Remove Procedure
DMC: SLBT1-AAA-B10-00-00-00A-520A-A
Project: Sailboat Type 1 | System: B10 - Engine
Engine Maintenance Manual.pdf
OEM Document | 4.5 MB
Uploaded: 2 weeks ago | Processed: ✓
Engine - Description
DMC: SLBT1-AAA-B10-00-00-00A-041A-A
Project: Sailboat Type 1 | System: B10 - Engine
Fuel System - Description
DMC: SLBT1-AAA-B20-00-00-00A-041A-A
Project: Sailboat Type 1 | System: B20 - Fuel
17. AI CHAT INTERFACE
AI Chat
3 documents selected
You
How do I remove the engine? What are the key safety considerations?
2 minutes ago
✨ AI Assistant
Based on the selected documents, here's the engine removal procedure:
Key Steps:
1. Secure the vessel and disconnect power
2. Drain all fluids (oil, coolant, fuel)
3. Disconnect electrical connections
4. Remove mounting bolts
5. Use proper lifting equipment
1. Secure the vessel and disconnect power
2. Drain all fluids (oil, coolant, fuel)
3. Disconnect electrical connections
4. Remove mounting bolts
5. Use proper lifting equipment
Safety Warnings:
⚠️ Engine weight: 450 kg - use rated lifting equipment
⚠️ Hot surfaces - allow cooling time
⚠️ Fuel vapors - ensure proper ventilation
⚠️ Engine weight: 450 kg - use rated lifting equipment
⚠️ Hot surfaces - allow cooling time
⚠️ Fuel vapors - ensure proper ventilation
Sources: Engine - Remove Procedure (DMC: 520A-A), Engine Maintenance Manual.pdf (Page 45-52)
3 minutes ago
You
What tools are required?
Just now
AI is typing...
18. SELECT DOCUMENTS FOR AI GENERATION
Select Source Documents
2 selected
✨ AI Content Generation
Select OEM documents that contain information relevant to this data module. AI will extract and structure the content according to S1000D standards.
Creating: Engine - Description (DMC: SLBT1-AAA-B10-00-00-00A-041A-A)
Engine Maintenance Manual.pdf
System: B10 - Engine | 4.5 MB | ✓ Processed
Uploaded: 2 weeks ago | Pages: 120 | Relevance: High
Relevant Sections: Pages 12-18 (Engine Overview), Pages 45-52 (Specifications)
Engine Specifications Sheet.xlsx
System: B10 - Engine | 0.8 MB | ✓ Processed
Uploaded: 1 week ago | Sheets: 3 | Relevance: Medium
Hull Structure Manual.pdf
System: A10 - Hull | 2.1 MB | ✓ Processed
Uploaded: 3 weeks ago | Pages: 85 | Relevance: Low
💡 AI Generation Preview
AI will extract and structure content for Info Code 041 - Description including:
- System overview and purpose
- Technical specifications
- Component descriptions
- Operating principles
19. PROJECT SETTINGS
Sailboat Type 1 Maintenance | Settings
Project Configuration
SWBS Configuration
Current Structure: 12 Systems | 28 Subsystems
Team Members
John Smith
john.smith@company.com
Sarah Johnson
sarah.j@company.com
20. USER PROFILE & SETTINGS
My Profile
👤
Email cannot be changed. Contact admin.
Change Password
21. OEM DOCUMENT LIBRARY (ENHANCED)
📚 OEM Document Library
24
Processed Documents
2
Processing
📄
Engine Maintenance Manual.pdf
System: B10 - Engine | 4.5 MB | Uploaded: 2 weeks ago
Pages: 120 | Processed: ✓ | Extracted: 45 sections | Used in: 8 Data Modules
AI Extraction Summary:
• 12 Technical Specifications | • 8 Procedures | • 15 Warnings | • 10 Illustrations
📄
Fuel System Manual.pdf
System: B20 - Fuel | 3.2 MB | Uploaded: 1 hour ago
⏳ Processing... 65% complete
PROCESSING
🧭 NAVIGATION FLOW DIAGRAM
How Users Navigate Between Features
Main Navigation Bar (Top)
Dashboard
Projects
🔍 Search
📚 Documents
⚙️ Admin
Dashboard → View all projects, recent activity
Projects → List of all projects → Select project → Workspace
Search → Enterprise Search interface
Documents → OEM Document Library
Admin → User Management, Settings (Admin only)
Project Workspace Sidebar
Project: Sailboat Type 1
📋 Overview → Project summary, stats
📄 Data Modules → List all modules → Create/Edit
• All Modules
• By System
• By Status
• + New Module
🏗️ SWBS → View/Edit structure
📚 Documents → OEM library for project
⚙️ Settings → Project configuration
Quick Access Actions
+
New Project
Top nav bar
🔍
Search
Top nav bar
👤
Profile
Top right
🔔
Notifications
Top right
📊 COMPLETE USER FLOW
1. LOGIN
Secure Entry
↓
2. DASHBOARD
View Projects
↓
Work on Existing
Go to Workspace
OR
Create New
Setup Project
↓
3-5. PROJECT SETUP
Details → Product Type → OEM Docs
↓
6. WORKSPACE
Manage Data Modules
↓
7-8. CREATE MODULE
Define DMC → Choose Pre-fill
↓
9. AI EDITOR ✨
Write & Validate
↓
10. EXPORT
Download Final Document
✨ KEY FEATURES & AI INTEGRATION
🎯 Core Features
✓ Project Management
Multi-project support with product types
✓ SWBS Management
Ship/Work Breakdown Structure definition
✓ OEM Document Library
Enhanced document management & analytics
✓ DMC Auto-Generation
Intelligent code suggestions
✓ Tagless Editor
Write S1000D without XML knowledge
✓ Multi-Format Export
XML, PDF, HTML outputs
✨ AI-Powered Features
AI Content Generation
Auto-generate from OEM documents
Enterprise Search
Glean-like search across all documents
AI Chat Interface
Document-based conversations
Real-time Validation
Schema + BREX + AI explanations
Smart Suggestions
Context-aware content recommendations
OEM Document Analysis
Extract specs, procedures, warnings
👥 User Management
Role-Based Access
Admin, Editor, Viewer roles
Project Permissions
Granular access control per project
Team Management
Add/remove team members
User Profiles
Personal settings & preferences
Admin Panel
Centralized user management
📐 NAVIGATION ORGANIZATION STRATEGY
🎯 Navigation Principles
1. Top Navigation Bar (Global)
Always visible, provides access to main sections: Dashboard, Projects, Search, Documents, Admin
2. Contextual Sidebar (Project Workspace)
Appears when inside a project, shows project-specific navigation: Modules, SWBS, Documents, Settings
3. Role-Based Visibility
Admin menu only visible to admins. Editor/Viewer see appropriate options based on permissions
4. Quick Actions
Common actions (New Project, Search) accessible from top nav. Context actions in sidebars
🗺️ Feature Access Map
From Dashboard:
→ View Projects → Select Project → Workspace
→ + New Project → Create Project Flow
→ Search (top nav) → Enterprise Search
From Project Workspace:
→ Data Modules → Create/Edit Module
→ SWBS → Define/Edit Structure
→ Documents → Upload/Manage OEM Docs
→ Settings → Configure Project
From Enterprise Search:
→ Search Results → View Document
→ Select Documents → Start Chat
→ Filter Results → Refine Search
From Admin Panel:
→ User Management → Add/Edit Users
→ System Settings → Configure Platform
→ Analytics → View Reports
💡 Navigation Best Practices Implemented
✓ Breadcrumbs
Back buttons and page titles show current location
✓ Active State
Current page highlighted in navigation
✓ Contextual Actions
Actions relevant to current view always visible
✓ Mobile Responsive
Hamburger menu and bottom nav for mobile
✓ Role-Based
Users only see features they can access
✓ Quick Access
Common actions (Search, New Project) always available
📋 WIREFRAME LEGEND
Visual Elements:
━━━━ Solid border = Container
- - - - Dashed border = Interactive area
█████ Filled box = Button/Action
░░░░░ Light fill = Input field
Color Coding:
🔵 Blue = Primary actions
🟢 Green = Success/Approved
🟡 Yellow = Draft/Warning
⚪ White = Content areas
Icons:
✨ = AI Feature
📄 = Document
⚙️ = Settings
✓ = Validated/Complete