Giter VIP home page Giter VIP logo

survey-air's Introduction

Survey Air

User Centric Frontend Development Milestone Project for Code Institute The project is website for a drone company which specialises in building surveying. It offers potential clients information on the services and operations carried out by the company and and example of the companys work.

UX

A scrollable webpage for ease of navigation is used throughout the site, with links to each section in the navbar. In the services section, modal pop-ups are to display the information. This allows for ease of navigation by keeping the user on the same page and it doesn't add clutter to the page.

Features

  • Home page Displays an example of services offered in full page background video. The navbar allows for easy navigation through the page, which is reduced to a button on smaller screens.

  • About (Drones and surveying) Gives an outline of the benefits of using drones, and includes a quote from a previous customer

  • Services This section has clickable pictures for each of the services/areas covered by Survey Air. When clicked, a pop-up modal gives information on each section. As the company develops and expands, these modals in the future have the potential to become seperate pages

  • Operations At the bottom of the services section, there is a step-by-step infographic on how the customer and company can interact and the how the service will be provided

  • Gallery The gallery gives potential customers a view to the kind of work that can be carried out, and the quality of footage they will recieve. As the company grows and starts to get more of their own original content, this section will be updated.

  • Contact page Here, clients can send a message to the company to make enquiries about the service.

Technologies used

  1. HTML - used for the main structure of the site
  2. CSS - for colour, layout, and general design
  3. Bootstrap 4 - used in conjunction with HTML and CSS for styling, and for features such as modals and forms. - helps to build webpages quickley https://getbootstrap.com/
  4. Google fonts - wide range of fonts available for free https://fonts.google.com/

Testing

Family and friends used the site across different devices to ensure userability and responsiveness. All navbar links, modals and buttons on the site were tested.

Deployment

The site is deployed using github pages

Credits

Content

The text for the service modals were taken for various drone and surveying pages:

Media

The homepage background video was taken from Pixabay

All modal images were taken from Pexels

The gallery videos are all taken from Youtube

survey-air's People

Contributors

mcoakley92 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.