Overslaan en naar de inhoud gaan

ProjectPAAS

ProjectPAAS

ProjectPAAS, een SaaS (Software as a Service) dienst om de performance van je website te meten en te toetsen. Ontwikkeld door Dutch Open Projects voor iedereen met een Drupal website die om performance geeft. En dat zou iedereen moeten zijn uiteraard.

Rol: Ontwerper/Frontender
Techniek: Drupal/Sass
Concept: One pager met parallax effect
Thema: Retro space

De portfolio website van ProjectPAAS is bedoelt om uit te leggen wat de dienst doet. Er zit redelijk wat eye candy in, zoals het parallax effect in de header van de site, de easter egg helemaal aan de onderkant en het menu wat aan de bovenkant van de site blijft plakken terwijl je scrollt waarbij, tijdens het scrollen, de actieve menuitems mee veranderen. De site is responsive en goed te bekijken op mobiele apparaten waarbij aan minimale werking is ingeleverd.

Designing in the browser

Hoewel ik veel van het ontwerp in de browser heb ontwikkeld was Photoshop nog steeds wel nodig bij dit project. Hoewel er andere, betere tools zijn voor logo’s heb ik deze toch in Photoshop gemaakt. Daarnaast is alle artwork in de header ook gemaakt met Photoshop. Voor het neerzetten van de stijl en het grid van de website is alleen de browser en mijn IDE voldoende geweest.

Stylesheets

Een uitdaging was om bij dit project de frontend en de backend een deel van de styling te laten delen. Dit heb ik uiteindelijk gedaan door een _global.scss te maken met daarin de generieke styling voor beide sites en daarnaast per site een specifieke stylesheet. Met Sass kan je andere bestanden includen in je hoofd stylesheet. Alle bestanden die beginnen met een _ (underscore) kan je middels @import “global”; includen. Bestanden zonder een underscore worden weggeschreven als .css bestand.