Skip to Main Content

Kristen Kriens Front-End Developer

Find out more

About Me

Kristen Kriens Bio Image

Photo credit: Pam Lau

Hi, my name is Kristen and I'm a Front-End Developer based in Toronto. I am organized, proactive, detail oriented, creative, and have strong technical skills. With these skills, I enjoy creating beautiful user-friendly websites by writing clean semantic code.

Before attending HackerYou, I worked in the cosmetics industry, which gave me an eye for design and enhanced my creativity. Since graduating the Bootcamp I have been working as a Junior Front-End Developer in the banking industry. I’ve learned some new skills and have honed the skills I acquired at HackerYou and in previous positions.

When I'm not coding, you can find me researching make-up trends, playing with my dog, or spending time with friends and family.

My Skills & Tools

  • HTML5

  • CSS3

  • jQuery

  • JavaScript

  • Sass

  • PHP

  • Git

  • GitHub

  • Gulp

  • WordPress

  • Photoshop

  • Illustrator

Recent Blog Posts

Single Page Websites & SEO

Single page websites have been a huge trend in web design for the past few years. While they look great and have features like the parallax scroll effect, they aren’t the best for SEO. Luckily, there are a few ways in which you can optimize your … Continue reading >

Vertically Centering Content

Anyone who has ever tried to vertically center content using css knows how difficult it can be. This article will explain three common ways vertically centering content can be achieved. Technique #1: height and line-height The idea behind this is that you set the height … Continue reading >

View All Posts

Check Out My Portfolio

Multi Page PSD to Responsive HTML Site – Coursea

  • HTML
  • CSS3
  • jQuery
  • Responsive

This is a PSD to HTML conversion of a multi page site. It is fully responsive and features a large hero image, multiple sections on the home page, a blog page, and a sign up page. The entire site was created using floats and no flexbox. Converted from the Coursea theme mockups which can be downloaded here.

View Live Site
PSD to Responsive HTML Site Mockups

Single Page PSD to Responsive HTML Site – Alicia

  • HTML5
  • CSS3/Sass
  • jQuery
  • Javascript
  • Responsive
  • Google Maps

This is a PSD to HTML conversion of a single page site. It is fully responsive and features multiple sections, a fixed navigation that changes as you scroll, a masonry style portfolio section with more info on click, and a map using the Google Maps Javascript API. Converted from the Alicia theme mockup which can be downloaded here.

View Live Site
PSD to Responsive HTML Site Mockups

API Web Application – Time for a Movie?

  • HTML5
  • CSS3/Sass
  • jQuery
  • Javascript
  • API/AJAX
  • Responsive
  • Website Design

This is a fully responsive web application I created with The Movie Database (TMDb) API. The user chooses a genre and enters how much time they have and it will return up to 12 random movie options. It features a material design interface and returns the title of each movie, it’s respective rating out of 10, a short plot summary, and a link to it’s IMDB page.

View Live Site
API Web Application Mockups

Custom WordPress Theme – Makeup Artist Site

  • HTML5
  • CSS3/Sass
  • jQuery
  • WordPress
  • PHP
  • Git
  • Gulp
  • Responsive

This is a fully responsive custom WordPress theme I created for a makeup artist portfolio site. It is fully and easily customizable through custom fields and features an about section, contact form, services and pricing page, portfolio page with a lightbox slideshow, and a blog page with social sharing buttons. Converted from the You theme mockups which can be downloaded here.

View Live Site
Custom WordPress Theme Mockups

WordPress E-Commerce Site – illumalift

  • HTML5
  • CSS3
  • WordPress
  • WooCommerce
  • Responsive
  • Graphic Design

This site was created for a company that I worked for in the past, illumalift. It is a fully responsive and working E-Commerce site built with WordPress and the WooCommerce plugin. The illumalift site features an about section, a store page with individual item pages, a press section, an events calendar, a store finder, and mailing list integration with MailChimp.

View Live Site
WordPress E-Commerce Site Mockups

Multi Page PSD to Responsive HTML Site – StayFit

  • HTML5
  • CSS3/Sass
  • Javascript
  • Responsive
  • Git
  • Gulp
  • Google Maps

This is a PSD to HTML conversion of a multi page site for a gym. It is fully responsive and features a large hero image, multiple sections on the home page, an about us page, an our team page, and a contact page with a map using the Google Maps Javascript API. Converted from the StayFit theme mockups which can be downloaded here.

View Live Site
PSD to Responsive HTML Site Mockups

Single Page PSD to Responsive HTML Site – Abstract

  • HTML5
  • CSS3/Sass
  • jQuery
  • Javascript
  • Responsive
  • Git
  • Gulp
  • Highcharts
  • Google Maps

This is a PSD to HTML conversion of a single page site. It is fully responsive and features multiple sections, a fixed navigation on mobile that changes as you scroll, a scaling slider, a portfolio section, a custom coded lightbox, percentage pie charts using Highcharts, and a map using the Google Maps Javascript API. Converted from the Abstract theme mockup which can be downloaded here.

View Live Site

Contact Me

I'd love to hear from you! Email me at kristen @ kristenkriens.com or fill out the following form.