/simple-prototyping

Simple setup for web layout prototyping, enabling code as a design tool with as little hassle as possible.

Primary LanguageSCSSThe UnlicenseUnlicense

Web layout prototyping

Simple setup for web layout sketching and prototyping with code.

Key features

  • 12 column grid system with gutter variables (customized Flexboxgrid)
  • Normalizing and baseline styles in place, so you can focus on the fun parts
  • swup for unobtrusive page transitions
  • LazyLoad for lazyloading images, background images, videos and iframes
  • in-view for detecting when elements become visible in viewport
  • jQuery
  • Velocity.js for smoother animations
  • Simple PHP templating system for includes.
  • Grid widget to check if things align. Add from js-snippets.js. Toggle by pressing "g".
  • No-js/js check, sets relevant class on body
  • Everything works offline, no CDNs etc.

Recommendations

Sass