Digital Sales & Customer
Experience Platform
Full Functional Specification · Implementation Roadmap · Commercial Estimate Framework
1. Executive Project Overview
SKYPEC operates as Vietnam's dominant aviation fuel supplier — serving 100% of domestic carriers and over 100 international airlines across 18 branch locations. Despite commanding market position, the company's current digital presence is a static information website that captures zero leads, offers no self-service capability, and generates no measurable commercial output. This gap represents a strategic risk as airline customers and charter operators increasingly expect digital procurement channels.
Business Objectives
- Generate qualified inbound leads from airlines & charter operators
- Reduce sales cycle via digital pre-qualification forms
- Provide 24/7 airport capability discovery
- Create supplier ecosystem transparency
- Modernize brand image for international audiences
Strategic Impact
- Position SKYPEC as a regional digital leader in aviation fuel
- Enable CRM integration with Odoo/Salesforce for pipeline tracking
- Reduce manual inquiry workload by 40–60%
- Build data asset from traffic, leads, and demand patterns
- Support market expansion into new charter and cargo segments
Why Not a Standard Website
- A brochure site has no commercial conversion function
- B2B aviation procurement requires workflow automation
- Airport capability data needs structured, searchable format
- Airline customers expect portal-based document exchange
- AI/chatbot support is now an enterprise standard expectation
2. Full Functional Module Breakdown
Primary digital front-door for SKYPEC. Presents company identity, services, network, and trust signals to all visitor segments. Drives conversions to inquiry and service request flows.
- Cinematic hero with trust metrics and dual CTA
- Services preview grid (5 service verticals)
- Airport quick-finder (search by airport code or city)
- Partner / airline logo carousel
- News, media, and corporate announcements
- About, leadership, certifications, CSR
- Bilingual VI/EN with SEO-optimized URL structure
Structured database of all 18 SKYPEC-operated airports. Enables airlines and charter planners to verify fueling capability, operating hours, fuel grades, and SLA terms before flight planning.
- Interactive Vietnam SVG map — click-to-select airports
- Searchable airport directory by region / IATA code
- Airport detail page: capacity, equipment, grades, hours
- Charter support availability flags
- Contact routing to local branch
- SLA tier visibility (Standard / Priority)
- PDF export of airport capability sheet
Multi-step digital forms for all inbound commercial requests. Replaces phone/email intake with structured, auto-routed workflows. Directly feeds CRM pipeline.
- Charter / ad-hoc fueling request form (4-step wizard)
- New airline cooperation inquiry
- Commercial quotation request with flight details
- Emergency fueling request (priority routing)
- File upload (flight plan, AOC, IATA certificate)
- Auto-routing to branch / sales responsible
- Confirmation email + reference number issuance
Authenticated portal for existing airline customers. Provides self-service access to request tracking, quotations, invoices, fuel reports, and notifications — reducing account management workload by 40%.
- Secure login / registration + email verification
- Account approval workflow (admin-controlled)
- Dashboard: active requests, quotes, documents
- Request status tracker with milestone timeline
- Document vault: certificates, contracts, fuel reports
- Notification centre (in-app + email)
- API integration ready for Odoo / Salesforce sync
Digital gateway for supplier onboarding, profile management, and procurement engagement. Reduces paper-based vendor qualification to a structured digital workflow.
- Supplier registration with profile builder
- Business documentation upload (license, ISO, tax cert)
- Tender notice listing and expression of interest
- Procurement form submissions
- Application status tracking
- Procurement team review dashboard
Full-featured headless CMS enabling non-technical staff to manage all website content, media, bilingual copy, and SEO without developer intervention.
- Page, banner, and media library management
- Bilingual content editing (VI/EN side-by-side)
- SEO metadata, sitemap, and redirect management
- Role-based access control (editor / admin / super)
- Lead inbox and inquiry management
- Airport and service data editor
- Analytics dashboard summary
Embedded AI assistant providing real-time FAQ response, guided navigation, lead capture, and bilingual query resolution — reducing human support load for common inquiries.
- FAQ chatbot trained on SKYPEC knowledge base
- Website navigation assistant ("find an airport")
- Smart semantic search across all site content
- Lead capture assistant via conversational form
- Bilingual VI/EN with automatic language detection
- Handoff to human support for complex queries
Integrated traffic, lead, and conversion analytics providing data-driven visibility into website performance, demand patterns, and commercial pipeline contribution.
- GA4 integration + custom event tracking
- Lead source attribution by channel
- Airport demand heatmap by monthly traffic
- Form conversion funnel reports
- Supplier inquiry volume trends
- Monthly automated report export (PDF)
3. User Role Matrix
| User Type | Public Site | Airport Portal | Service Request | CRM Portal | Supplier Portal | Admin CMS |
|---|---|---|---|---|---|---|
| Public Visitor | View | View | Submit | — | — | — |
| Airline Customer | View | View | Submit | Full | — | — |
| Charter Operator | View | View | Submit | View | — | — |
| Supplier | View | View | — | — | Full | — |
| Sales Team | View | View | Manage | Full | View | Reports |
| Marketing Admin | Edit | Edit | View | View | View | Content |
| Content Editor | Edit | Edit | — | — | — | Content |
| Super Admin | Full | Full | Full | Full | Full | Full |
4. Technical Architecture
Frontend
- Next.js 15 (App Router)
- React 19 + TypeScript
- Tailwind CSS v4
- Framer Motion animations
- SWR for data fetching
- i18n bilingual VI/EN
Backend / API
- Node.js + Express (primary)
- Laravel option for legacy CMS
- RESTful + GraphQL endpoints
- JWT auth + refresh tokens
- Queue-based workflow engine
- Webhook integration layer
Database
- PostgreSQL (primary store)
- Redis (session + cache)
- S3-compatible blob storage
- Full-text search (Meilisearch)
- Automated daily backups
- Point-in-time recovery
CMS
- Strapi v4 (headless)
- Custom admin role panel
- Media optimisation pipeline
- Bilingual field support
- Draft / publish workflow
- REST + GraphQL content API
Hosting & CDN
- VPS / Cloud (AWS or Viettel IDC)
- Cloudflare CDN + WAF
- Vercel for frontend edge
- CI/CD via GitHub Actions
- Blue-green deployment
- 99.9% SLA uptime guarantee
Security
- SSL/TLS + HSTS enforcement
- RBAC with audit log trail
- OWASP top-10 hardening
- Rate limiting + bot protection
- Encrypted data at rest
- GDPR-aligned privacy policy
The platform is architected as a CRM-agnostic gateway. Service request forms post to a normalised lead schema that maps directly to Odoo CRM opportunity fields via REST API. Fallback adapters are provided for Salesforce and HubSpot. All leads are stored natively in PostgreSQL, ensuring zero data loss even during CRM synchronisation outages.
5. Delivery Plan — 3-Phase Roadmap
- Module A — Public Website
- Module B — Airport Portal (core)
- Module C — Service Request Forms
- Module F — CMS Admin Panel
- Module H — Analytics (GA4 + basic)
- Week 2: Design system + UI kit approved
- Week 4: Frontend prototype reviewed
- Week 6: Backend APIs integrated + staging
- Week 8: UAT complete + go-live
Fully functional public website with lead capture, airport finder, and service request submission. CMS operational for content team.
- Module D — CRM Customer Portal
- Module E — Supplier Portal
- Module C — Advanced workflows + routing
- CRM integration (Odoo API)
- Module H — Advanced reporting
- Week 10: Portal UI + auth system ready
- Week 12: CRM sync tested with staging Odoo
- Week 13: Supplier registration flow live
- Week 14: Portal UAT + launch
Authenticated portals live for airline customers and suppliers. CRM pipeline automatically populated from all digital requests.
- Module G — AI Chatbot (OpenAI / local LLM)
- Smart search (Meilisearch)
- Automation: email sequences, SLA alerts
- Performance optimisation + CDN tuning
- Advanced analytics dashboards
- Week 15: AI model fine-tuning on SKYPEC KB
- Week 16: Chatbot integration + testing
- Week 17: Automation workflows tested
- Week 18: Final delivery + handover
Full platform operational. AI chatbot deflects 30–40% of common inquiries. Automation reduces manual coordination by 50%.
6. Resource Plan
| Role | Headcount | Phase 1 | Phase 2 | Phase 3 | Key Responsibilities |
|---|---|---|---|---|---|
| PM / BA | 1 | Full | Full | Partial | Scope management, sprint planning, client liaison, UAT coordination |
| UX/UI Designer | 1–2 | Full | Partial | Partial | Design system, wireframes, prototypes, UI kit, responsive QA |
| Frontend Dev | 2 | Full | Full | Full | Next.js, component library, CMS integration, portal UI, AI widget |
| Backend Dev | 2 | Full | Full | Partial | API design, CMS backend, portal logic, CRM integration, workflow engine |
| QA Engineer | 1 | Partial | Full | Full | Test planning, regression, accessibility, cross-browser, UAT support |
| DevOps Engineer | 0.5 | Partial | Partial | Partial | CI/CD, cloud infra, SSL, CDN config, monitoring, backup automation |
| AI Engineer | 1 (opt.) | — | — | Full | Chatbot training, LLM integration, knowledge base curation, smart search |
7. Cost Estimation Framework
A. Frontend / UI-UX Design
| Deliverable | Effort | Estimate (VND) |
|---|---|---|
| UX Research & User Journey Mapping | 2 weeks | 30,000,000 |
| Information Architecture & Sitemap | 1 week | 15,000,000 |
| UI Design System (Components, Tokens) | 2 weeks | 40,000,000 |
| Full Page UI Design (16 pages + portal) | 3 weeks | 80,000,000 |
| Frontend Coding (Next.js, all modules) | 8 weeks | 200,000,000 |
| Responsive QA + Accessibility Audit | 1 week | 20,000,000 |
| Subtotal | 385,000,000 | |
B. Full Platform Development
| Deliverable | Effort | Estimate (VND) |
|---|---|---|
| Backend API + Database Architecture | 4 weeks | 120,000,000 |
| CMS (Strapi) Setup + Custom Fields | 2 weeks | 50,000,000 |
| Airport Portal + Data Migration | 3 weeks | 80,000,000 |
| Service Request Workflow Engine | 3 weeks | 90,000,000 |
| CRM Customer Portal (Auth + Dashboard) | 4 weeks | 120,000,000 |
| Supplier Portal | 2 weeks | 60,000,000 |
| CRM Integration (Odoo API) | 2 weeks | 70,000,000 |
| Admin Panel + Reports | 2 weeks | 50,000,000 |
| AI Chatbot Integration (Phase 3) | 2 weeks | 80,000,000 |
| QA, Testing & Bug Fix Cycle | 2 weeks | 50,000,000 |
| Deployment + DevOps + Handover | 1 week | 40,000,000 |
| Subtotal | 810,000,000 | |
C. Annual Operation Cost
| Deliverable | Effort | Estimate (VND) |
|---|---|---|
| Cloud Hosting (VPS / AWS, 2 servers) | Per year | 60,000,000 |
| CDN + Cloudflare Pro | Per year | 15,000,000 |
| Monitoring + Uptime Alerting (Sentry) | Per year | 10,000,000 |
| Security Patching + Dependency Updates | Per year | 30,000,000 |
| Content Support + Minor Enhancements | Per year | 60,000,000 |
| AI API Credits (OpenAI / Azure) | Per year | 25,000,000 |
| Subtotal | 200,000,000 / year | |
8. Recommended Budget Packages
- Public website (Module A)
- Airport capability portal — basic
- Service request forms (no workflow)
- CMS admin panel
- GA4 analytics
- Bilingual VI/EN
- 6 months support included
- CRM customer portal
- Supplier portal
- CRM API integration
- AI chatbot
- All Phase 1 + Phase 2 modules
- Full service request + workflow engine
- CRM Customer Portal
- Supplier Portal
- Odoo CRM integration
- Advanced analytics + reporting
- 12 months support included
- AI chatbot (Phase 3 add-on)
- All Phase 1 + 2 + 3 modules
- AI chatbot (bilingual)
- Smart semantic search
- Automation workflows + SLA alerts
- Advanced dashboards + BI layer
- Custom CRM integration any system
- 12 months premium support + SLA
9. ROI & Business Value
Structured digital forms replace email/phone intake. All inquiries are timestamped, categorised, and routed — creating a measurable lead funnel for the first time.
Automated confirmation, CRM routing, and portal status tracking eliminate manual handoffs. Airline customers get response confirmation within minutes of submission.
Premium bilingual portal positions SKYPEC on par with global aviation fuel suppliers. International airlines expect digital self-service — this delivers it.
Supplier portal eliminates paper-based procurement intake. Vendor qualification, document collection, and tender communication all happen digitally.
AI chatbot handles FAQ load. Portal handles status queries. CRM sync eliminates manual data entry. Staff focus shifts from coordination to conversion.
For the first time, management can see which airports generate demand, which request types convert, and where the sales pipeline bottlenecks occur.
10. Presale Client-Facing Summary
This is not a website cost.
This is a digital sales and customer service investment.
SKYPEC has earned its market-leading position through decades of operational excellence. This platform extends that excellence into the digital channel — creating a system that works 24/7 to qualify leads, serve airline customers, onboard suppliers, and feed your CRM pipeline.
Every airline that searches for charter fueling capability
finds SKYPEC first
Every inquiry that enters the website
enters your CRM automatically
Every customer who needs status or documents
serves themselves — not your staff
At 1.1–1.5 billion VND, this investment delivers a full-stack digital commercial infrastructure. Amortised over 3 years, that is less than the cost of one sales executive headcount — yet generates perpetual, compounding commercial returns.