John Turton's portrait photo.

Front End Designer & Developer

I build engaging narratives through interfaces on the web and I love what I do.

See my work

Education

llinois State University

Masters of Science, Creative Technology (formerly known as: Arts Technology)

Bachelor of Science, Studio Arts - Photography

Illinois Central College

Associates in Arts & Science, Graphic Design

Template Work

Jekyll Template

I use the static site generator to construct templates that build and maintain Department and School websites at Illinois State University.

Jekyll Template Details

  • Jekyll
  • Liquid
  • MarkDown
  • YAML
  • VS Code
Snapshot of code for a image based component.

Modular Components

I built a system to do code splitting in the static site generator template and a method of re-usable components.

Modular Components Details

  • CMS
  • Code Splitting
  • Components
  • GitLab
  • VS Code
Snapshot of code for a image based component.

Image Optimizations

I worked with ImgIX CDN/API to optimize images for speed while retaining quality. I researched and set the standards for our automated image inserts via the CMS.

Image Optimization Details

  • CDN
  • API
  • CLS
  • FCP
  • VS Code
Snapshot of code for a image based component.

Workshops

Smashing Magazine 2022 Workshop

"New Adventures in Front-End"

Nielsen Norman Group Workshop

Illinois State University Web Presence

Smashing Magazine 2021 Workshop

"Deep Dive On Accessibility Testing"

Smashing Magazine 2021 Workshop

"New Adventures in Front-End"

Experience

Front End Designer & Developer

Front End Designer & Developer May 2018 - Current

Graduate Assistant May 2017 - May 2018

College of Arts & Sciences Information Technology, Illinois State University
  • Collaborate with University Web department in creation of ISU design system
  • Work with designers, developers, faculty, and administrators on department web projects
  • Implement and follow design standards from style guides and templates for department websites
  • Attend workshops and bring changes to office workflow based on industry best practices
  • Create UI in construction and redesign of websites based on UX research and Google Analytics
  • Develop features, components, and code snippets functioning within CMS using static site generator
  • Advise students on learning Jekyll & Eleventy (static site generators) to create websites
  • Advocate for and apply ADA accessibility requirements in web development
  • Test and maintain code base with Chrome Dev Tools, Lighthouse audits, and GitLab
  • Aid faculty and staff by completing web tickets using Cherwell
  • Generate logos, icons, and additional assets using design and photo editing software
  • Design and build internal applications for grant submissions and approvals using low code in Knack
Instructor/Teaching Assistant

Arts Technology Program, Illinois State University August 2017 - May 2018

  • Served as sole instructor for ATK 300, focusing on digital image composition and photo manipulation
  • Communicated effectively to students through lectures, activities, and class collaboration
  • Provided opportunities outside of class to coach students on course material
  • Developed curriculum, lesson plans, and course assignments
  • Graded various web coding and photography projects; competency in ReggieNet
Public Relations Graduate Assistant

Mennonite College of Nursing, Illinois State University August 2016 - August 2017

  • Staged, produced, and edited video for $20,000 Crowd-funding campaign
  • Managed College’s website and social media for academic and promotional content
  • Generated graphics for marketing and event materials
  • Designed print pamphlets, posters, and cards for various needs of the College
  • Assisted Director with Alumni Banquet, Nurses Week, Scholarship Reception, Homecoming
Photographer/Graphic Designer

Turtonic Photography, Freelance January 2010 - 2018

  • Captured individual and group portraits, as well as engagement, event, and food photographs
  • Created graphics using Illustrator and InDesign for logos, fliers, business cards, advertisements
  • Edited photographs using Photoshop for enhanced quality and design