Web Unleashed 2014
Web Dev
  • 2014-09-17 00:00:00 2014-09-18 00:00:00 America/Toronto Web Unleashed 2014 Toronto FITC
  • Toronto

Presentation

Slides

Overview

Geometric shapes have become extremely popular in web design; they can be a challenge to implement, but new additions to HTML & CSS along with creative solutions from front-end developers allow us to bring these designs to life through code. Starting from the humble CSS triangle, this talk will explore tricks and techniques for implementing geometric designs with pure HTML, CSS and JavaScript. Crafting shapes in code makes for flexible, easy to maintain websites and will give you a taste of some of the coolest emerging front-end techniques, like CSS transforms, SVG and canvas.

Objective

Learn how to creatively code geometric designs in pure HTML, CSS & JavaScript.

Target Audience

Front-end developers looking to expand their toolkit, and designers hoping to better understand what’s possible in code.

Assumed Audience Knowledge

HTML and basic CSS

Five Things Audience Members Will Learn

  1. The CSS border hack and CSS transforms
  2. SVG basics
  3. Canvas basics
  4. Which JavaScript libraries can help you implement and enhance geometric elements
  5. How to be courageous when faced with a difficult design