Code Monkey home page Code Monkey logo

pleasurable-ui's Introduction

Fork deze leertaak en ga aan de slag. Onderstaande outline ga je gedurende deze taak in jouw eigen GitHub omgeving uitwerken. De instructie vind je in: docs/INSTRUCTIONS.md

Pleasurable Interface

Ontwerp en maak voor een opdrachtgever een interface waar gebruikers blij van worden

Inhoudsopgave

Beschrijving

Voor deze opdracht lag de focus op het enhancen van je website met client side scripting, om een leuke en interessante website te maken waar gebruikers blij van worden. Dit hebben wij gedaan door interessante animaties toe te voegen aan het openen van het menu, het icoontje van het menu, de paginatie van de carrousel, de like interactie en CSS hovers. Hierdoor gebeurt er op bijna elk component wel wat interessants voor de gebruiker.

Visual

Livelink

Gebruik

Om deze pagina live te bekijken kan je klikken op de livelink in de About sectie van deze repository.

Kenmerken

Bij deze teamopdracht hebben wij gebruik gemaakt van het principe Progressive Enhancement. Dit houdt in dat je werkt in verschillende lagen.

Namelijk:

  • Laag 1 (functional): de content laag (bijv. HTML)
  • Laag 2 (reliable): de presentatie laag (bijv. basic CSS)
  • Laag 3 (usable): de bruikbare laag (bijv. extra client-side Javascript)
  • Laag 4 (pleasurable): de extra leuke laag (bijv. animaties)

Met keyframe animations, GSAP, Javascript en CSS hovers hebben wij onze website verrijkt zodat gebruikers er blij van worden.

Installatie

  1. Installeer NodeJs
  2. Fork deze repository
  3. Open het in een code editor naar keuze
  4. Run de command npm install
  5. Run de command npm start
  6. Klik op de localhost link en begin met coden!

Bronnen

Licentie

This project is licensed under the terms of the MIT license.

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.