Orbital Surveys Geospatial systems

Orbital Surveys

Orbital Surveys Website Modernization Design

Orbital Surveys Website Modernization Design

Status: Approved

Goal

Rebuild the Orbital Surveys development website into a modern, distinctive geospatial portfolio that leads with aerial mapping and photogrammetry, presents the company’s real survey capabilities clearly, and introduces CloudConstruct and CloudCanvas as in-house production software available to clients by enquiry.

The rebuild applies only to the dev branch and local dev checkout until it is separately reviewed and approved for master.

Platform Decision

Keep Jekyll and the existing GitHub Pages deployment path. Jekyll remains a suitable static-site foundation for a small marketing and service website, and the current GitHub Actions workflow already builds and deploys it successfully.

Replace the dated frontend layer:

  • Retire the Sleek theme’s visual language.
  • Remove jQuery and Velocity from the browser runtime.
  • Stop depending on the old Gulp-generated bundle for site interactions.
  • Build the new experience with semantic Liquid/HTML templates, custom CSS and small vanilla JavaScript modules.
  • Preserve the existing Formspree endpoint and GitHub Pages workflow.

Audience and Positioning

The primary audience is clients seeking aerial mapping, photogrammetry, orthophotos and terrain products. Mining, engineering, infrastructure and broader survey clients remain important secondary audiences.

Core positioning:

See the ground clearly. Build with confidence.

The site should feel technically credible, visually memorable and grounded in real work. It must not use invented clients, testimonials, statistics or vague technology claims.

Visual Direction

Use a geospatial editorial style with a cinematic opening and disciplined technical presentation.

Identity

  • Replace the pixelated animated globe with a custom vector orbital/crosshair mark.
  • Pair it with a clean Orbital Surveys wordmark.
  • Use large editorial typography for statements and compact monospaced typography for coordinates, labels and deliverables.

Colour

  • Basalt black for primary dark surfaces.
  • Warm off-white for reading surfaces.
  • Muted terrain green taken from the aerial imagery.
  • Survey orange as the single strong action/accent colour.
  • Avoid purple gradients, glassmorphism and generic technology palettes.

Imagery

  • Prioritize Orbital’s existing orthophotos, drone imagery, terrain models, point clouds, mine images and mapping outputs.
  • Use real CloudConstruct and CloudCanvas screens or output imagery for the software section.
  • Do not introduce stock imagery unless a genuine content gap remains after the real assets are used.

Shape and Layout

  • Full-bleed images where scale matters.
  • Precise grids, thin rules, survey crosses, coordinate labels and restrained contour-line textures.
  • Minimal corner rounding and shadows.
  • Purposeful asymmetry and generous negative space rather than uniform card grids.

Information Architecture

Primary navigation:

  • Capabilities
  • Process
  • Software
  • Work
  • About
  • Contact

Existing service URLs remain valid and are redesigned rather than removed.

Homepage

1. Hero

  • Near-full-viewport orthophoto image.
  • New Orbital mark and wordmark in the navigation.
  • Headline: See the ground clearly. Build with confidence.
  • Supporting copy focused on aerial capture, survey control and decision-ready spatial products.
  • Primary action: Discuss a project.
  • Secondary action: Explore capabilities.
  • Coordinate/grid details and a restrained scroll cue.

2. Positioning

Explain Orbital’s joined-up delivery from flight planning and ground control through processing and final mapping outputs.

3. From Flight to Finished Data

A four-stage scroll-led sequence:

  1. Plan
  2. Capture
  3. Process
  4. Deliver

Each stage uses concise factual copy and one representative image or visual layer.

4. Capabilities

Lead with:

  • Aerial surveys and photogrammetry
  • Orthophotos and georeferenced imagery
  • Digital terrain and elevation models
  • Contours and spatial deliverables
  • GPS control and terrestrial surveys
  • Hydrographic surveys
  • Mapping and spatial-data services

5. Software Built From the Work

Use the line:

Built for our own production work. Available to yours.

CloudConstruct and CloudCanvas are presented as software Orbital uses in production and makes available to clients with pricing by enquiry.

CloudConstruct

Position CloudConstruct as the production environment that takes imagery and survey control through project setup, GCP work, alignment, dense reconstruction, quality reporting and large-project orthophoto export.

The visual treatment should show imagery entering a processing pipeline and becoming dense, georeferenced survey products.

CloudCanvas

Position CloudCanvas as the analysis and design environment for processed geospatial data.

Capability groups:

  • Terrain analysis: surface comparison, Boolean/surface clipping, volume calculations, profiles and spatial filtering.
  • Mine design: automatic pit-bench generation with berms, faces, floor surfaces, parameter adjustment, volumes and mesh/report exports.
  • Trench design: drawn or imported centrelines, true-V or flat-base trenches, side slopes, gradients, daylight/deep outlets, terrain cutting and PDF volume reports.
  • Subsurface and delivery: drillhole geology, raster/mesh workflows, orthophoto overlays and export-ready project datasets.

Use real application screenshots and rendered terrain outputs. Each product receives an Enquire about pricing action leading to the contact section.

6. Selected Work and Outputs

Use the existing orthophoto, drone, terrain model, point-cloud and mine imagery as an editorial portfolio. Do not manufacture project names or case-study outcomes that are not documented.

7. Credibility

Use the factual company history: surveying and mapping work since 1995. Keep this concise and pair it with real technical deliverables rather than unsupported claims.

8. Contact

Retain the working Formspree endpoint in a fully redesigned contact section. Provide clear pathways for survey-project enquiries and CloudConstruct/CloudCanvas pricing enquiries.

Service Pages

  • Rewrite the old post-style pages as modern capability pages while preserving their current URLs.
  • Keep the factual service scope and existing relevant images.
  • Improve hierarchy, grammar and clarity.
  • Add related-capability navigation and a consistent contact action.
  • Reframe Computer Services as mapping and spatial-data services while retaining only claims supported by the existing content.
  • Keep MineTrak as a legacy/specialist product page unless later review decides otherwise.

Motion Design

Motion should support spatial depth and process understanding.

  • Gentle hero-image scale and depth shift.
  • Grid/route lines that draw into view.
  • Staggered editorial text reveals.
  • Slightly different image depths in portfolio sections.
  • Sticky desktop storytelling for the process and software sections where it remains readable.
  • Simple stacked flow on mobile.
  • No continuous decorative animation, scroll hijacking or heavy animation framework.

Use Intersection Observer for reveal state and transforms/opacity for smooth composited motion. Respect prefers-reduced-motion; all information remains visible and understandable without animation.

Accessibility and Interaction

  • Semantic landmarks and heading order.
  • Keyboard-accessible navigation and mobile menu.
  • Visible focus states.
  • Sufficient colour contrast.
  • Descriptive image alternative text.
  • Accessible contact labels, error states and submission behaviour.
  • Motion-reduced presentation for users who request it.
  • Responsive layouts at phone, tablet, laptop and wide-desktop sizes.

Performance

  • Reuse and optimize current imagery with responsive sizing where practical.
  • Avoid runtime animation libraries.
  • Load scripts with defer.
  • Lazy-load below-the-fold images.
  • Prevent layout shifts with explicit image dimensions or aspect ratios.
  • Keep the Jekyll build and GitHub Pages output static and cache-friendly.

Verification

  • Jekyll builds successfully using the same local and GitHub Pages-compatible path.
  • Existing URLs return valid pages.
  • Homepage, service pages and contact page work at representative mobile and desktop widths.
  • Navigation and contact controls work with keyboard input.
  • Reduced-motion mode exposes all content without reveal delays or parallax.
  • No browser console errors.
  • Contact form retains the current Formspree action.
  • The live master checkout, CNAME and Pages workflow remain unchanged during dev implementation.

Explicit Non-Goals

  • No CMS, database or JavaScript framework migration.
  • No public dev deployment or DNS changes.
  • No ecommerce or automatic software purchasing flow; software pricing remains enquiry-based.
  • No invented client logos, testimonials, project metrics or unsupported technical claims.
  • No generic AI-generated visual language.