Giter Site home page Giter Site logo

deco1400-origamihub.net's Introduction

Implementation Summary

The created website consists of 10 pages, consisting of a:

  • Home,
  • Products, Tissue Foil Product, Elephant Hide Product and, Kraft Paper Product,
  • Bases selection, Simple Folds base, Dog Folding Demonstration,
  • Contact Us, and
  • ‘Error 404 Page not found’ page

Within these pages, a number of CSS and JS features were implemented, such as

  • Height changing, and sticky header
  • Navigation dropdown arrows, and information and class toggling
  • CSS @media and variable use for changing font, and other sizes
  • CSS enabled re-sizing map
  • Application of 3D CSS transitions to SVG elements
  • JS enabled SVG origami demonstration
  • Custom Carousel

Conclusion

The website created was successful in providing the main functionality of the origami website as designed. Although lacking some aspects, such as additional origami bases, the functionality of these missing aspects are all demonstrated through other pages. I am happy with the website as a whole, and especially proud of the origami dog demonstration and simple fold transitions.

Through completing this assignment I particularly learnt about, and tried to practice the concept of clean CSS. In a lot of past projects I have had a bad practice of debugging by putting in random CSS code, and when something works, leaving it. In this project I especially tried to clean up unnecessary CSS and ensure that if this source code was to be used in the future, styling could be applied to elements with a confidence that unintended changes to external elements was minimal.

This site could still be developed further, and a number of features ideated in the design were not included because of time constraints. Features like product filters, utilising Flexbox order and JavaScript sorting, or additional CSS transition base pages could be implemented.

For more information about the design process, see the Design Report.

For more information about the technical aspects of the product, see the Website Implementation Report.

The Website Implementation Report is provided as was submitted.

The copyrights or trademarks of any origami designs, and/or images remain the owner/s' as referenced. Any infringements, please contact me, and I will take it down. This project was submitted for educational purposes.

deco1400-origamihub.net's People

Contributors

jenseni-git 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.