Jan Humphries

Front-End & UX Developer

I make web things :

Web developer comfortable in the whole stack, specializing in Front-End and UX. Experience ranges from designing wireframes through prototyping, development, testing, and deployment. Girl Develop It teacher, mentor, speaker, open source contributor, passionate community builder.

Beautiful

Whether it's designing mock ups in Sketch, working from Photoshop comps from a designer, or coding directly in the browswer, I love to craft beautiful, engaging experiences.

I believe the role of design in digital creations is to connect visitors with important content in an unobtrusive, empowering way.

Skills

    • Digital Art
    • Photography
    • Branding
    • Typography
    • Color Theory
    • Info Hierarchy
    • Infographics
    • HTML, CSS, JS
    • Web Fonts
    • Responsive Layout
    • Mobile-First
    • Content Management
    • User Research
    • Usability
    • Wireframes
    • Styleguides
    • Prototypes
    • Interactions
    • Accessibility
  • Creativity
  • Problem-solving
  • Collaboration

Tools

    • Photoshop
    • Illustrator
    • InDesign
    • Sketch
    • HTML
    • CSS, Scss
    • CSS Animations, Parallax
    • SVG images
    • JavaScript, jQuery
    • Ruby, Rails
    • PHP, Laravel
    • Wordpress
  • Browser Dev Tools
  • Fro nt-End Frameworks

Experience

  • Trained teams on User Experience practice, including compliance, standards, styleguides, accessibility, & overall usability.
  • Taught User Experience workshops for Girl Develop It.
  • Freelanced graphic and web design for several years.

Fast

Speed is becoming the most important aspect of successful websites today. Visitors stay longer and websites see greater conversions when pages load quickly and interactions are swift.

Performant products need optimized and validated code behind them and an awareness of the size and complexity of pages delivered to users.

Skills

  • Valid & semantic HTML
  • CSS & Specificity
  • Responsive Images
  • Page Load
  • Javascript
  • AJAX, JSON
  • REST

Tools

  • Code validators
  • Image compression
  • Code Minification
  • CDN
  • Page Speed, YSlow
  • Postman

Experience

  • Raised eCommerce site YSlow score by implementing a Javascript compiling & minifying build process.
  • Developed parallax marketing experience using dynamic image loading, reaching 60fps scroll rate.

Responsive

Modern hardware and software are challenging developers to think outside the page, a reference to paper constraints that the digital world just doesn't have. Future clients will need to deliver content to audiences in imaginative ways, and the best approach to doing so is coding with a content-first strategy.

Modular components, appropriately-scoped styling and a focus on flexability are needed building blocks for applications and websites from a single view to complex systems.

Skills

  • CSS Flexbox, CSS Grids
  • BEM, Atomic naming conventions
  • Mobile-first design and development
  • Cross-browser testing
  • Media queries

Tools

  • Device labs
  • Browser/device simulators
  • Bootstrap, Atomic, responsive frameworks
  • fitvids.js

Experience

  • Converted static retail site to responsive layout using CSS Flexbox, allowing client to drop 3rd party mobile service.
  • Wrote custom CSS grid for individual client replacing a Bootstrap framework.

Inclusive

Often a misunderstood and mis-applied feature, accessibility is nonetheless crucial to connect with every user possible. Empathy, research, and attention to detail top the list of skills needed to bring content to users outside the realm of our own experiences.

Skills

    • Font Legibility
    • Color Contrast
    • ARIA Attributes
    • Site navigation
    • Image alternatives
    • Color Blindness
    • Hand/Eye Mobility
    • Delayed Cognition
    • Reading Level

  • Tools

    • W3 Consortium
    • WCAG 2.0
    • Section 508
    • WAI-ARIA
    • WAVE by AIM
    • Voice Over
    • Color Testing
    • Contrast Testing
    • Adaptive Equipment

Experience

  • Made retail site more accessible by adding ARIA roles, implementing keyboard navigation, and reducing WebAim WAVE errors.

MORE

  • Highly empathetic, inclusive, team-oriented
  • Value integrity and transparency
  • Easily distill key information from diverse sources
  • Creative, artistic, fun-loving
Resume LinkedIn GitHub

Skills

    • jQuery, UI
    • Modernizr
    • Angular
    • Backbone
    • Ember
    • D3
    • Underscore
    • Handlebars
    • Moustache
    • Designing schema
    • SQL/NoSQL
    • SQLite
    • Postgres
    • MongoDB

Tools

    • NPM
    • Gulp
    • Grunt
    • Vagrant
    • Composer
    • Continuous Integration
    • Git, SVN
    • Agile
    • Scrum
    • Kanban
    • Iteration
    • Sprints