Web Design Portfolio

Here are examples of my web design work. I have two categories: School Projects, and Client Projects. The school projects are, not surprisingly, examples of work I did while in the Technical Web Design program at BCIT, showing some of the progress from the beginning to the end of the program, and the client projects are sites that I have done for actual clients. Take a look, and please contact me with any questions, comments, concerns, or communications of any kind.

Projects

Ryan Noakes Composer

screen shot of the homepage for Ryan Noakes Composer

Client Project

This site includes Custom Post Types for displaying & organizing upcoming events and the portfolio of works composed. The site navigation is fully accessible; no matter what type of device a person is using, whether using a mouse, finger, keyboard, or other interface, anyone can easily navigate throughout the site.

BC Music Educators Association

screenshot of the BC Music Educators Association homepage

Client Project

The BCMEA needed a re-designed site that is responsive, easy to search and navigate, and has easy-to-use forms for honour ensemble auditions, scholarship applications, and award nominations. The site navigation is fully accessible; using any device to view the site, and whether using a mouse, finger, keyboard, or other interface, anyone can easily navigate through the site.

Responsive Blog

screenshot of the responsive blog page

School Project

For our Responsive project we created the homepage of a blog site to demonstrate using media queries to make the page responsive to any device, with any browser width, and create a simple mobile menu. This page is optimized for viewing on any device.

JavaScript/jQuery Tutorial

screenshot of the JavaScript/jQuery tutorial site's homepage

School Project

For our final JavaScript/jQuery project we created an instructional site. I used the theme of showing/hiding content; toggle displaying/hiding content, accordion panes to display/hide content, and tabbed content on a page. This site is not optimized for mobile devices.

Mos Eisley Tours

screenshot of the Ms Eisley Tours website's homepage

School Project

For our final HTML/CSS project, the assignment was to pick a city, either real or fictitious, and create a small site for that city, including building a form that the website user can fill out. This site also uses some JavaScript and jQuery, and is not optimized for mobile devices.

JavaScript Number Game

screen capture of the JavaScript/jQuery number game web page

School Project

For our first JavaScript/jQuery assignment we made a playable JavaScript game. I chose to make a Number Guessing game. The responses from the game range from enthusiastic encouragement to somewhat more disappointed comments. This page is not optimized for mobile devices.

Fresh Is Best Brochure

screenshot of the Fresh Is Best brochure site homepage

School Project

This was the second HTML/CSS project for the class. We had to pick a business, either real or pretend, and create a small brochure site for that business. This site uses only HTML and CSS code, including using font-face, and is not optimized for mobile devices.

The Netherlands

screenshot of The Netherlands site homepage

School Project

This was our first HTML/CSS project. We had to pick a country, and make a small site detailing some of the information about that country, which had to include an HTML table. This site uses only the basics of HTML and CSS code, and is not optimized for mobile devices.