Mitchell McKenna - tagged with webdesign https://mitchmckenna.com/feed en-us http://blogs.law.harvard.edu/tech/rss LifePress mitchellmckenna@gmail.com Plyr - A simple HTML5 media player https://mitchmckenna.com/post/15235/plyr-a-simple-html5-media-player

A simple HTML5 media player with custom controls and WebVTT captions.

]]>
Tue, 03 Mar 2015 15:35:00 -0500 https://mitchmckenna.com/post/15235/plyr-a-simple-html5-media-player/plyr-a-simple-html5-media-player
Dashboards by Keen IO https://mitchmckenna.com/post/15068/dashboards-by-keen-io

Building a dashboard? Using Bootstrap? With maybe bar graphs, time charts, or maps? Why start from scatch? Use Dashboards by Keen IO templates to get you started.

]]>
Mon, 05 Jan 2015 19:37:00 -0500 https://mitchmckenna.com/post/15068/dashboards-by-keen-io/dashboards-by-keen-io
Stock Up: Free Stock Photo Search https://mitchmckenna.com/post/14895/stock-up-free-stock-photo-search

Search stock photo across Unspalsh, Life of Pix, and several other free stock photo websites in one place.

]]>
Mon, 03 Nov 2014 20:05:00 -0500 https://mitchmckenna.com/post/14895/stock-up-free-stock-photo-search/stock-up-free-stock-photo-search
Tablesaw - A Group of Plugins for Responsive Tables https://mitchmckenna.com/post/14431/tablesaw-a-group-of-plugins-for-responsive-tables

Tables - they've got a bad wrap in web dev history, but it's appropriate for tabular data. Here's some neat plugins for making your tables more useful in responsive design.

]]>
Fri, 16 May 2014 19:47:00 -0400 https://mitchmckenna.com/post/14431/tablesaw-a-group-of-plugins-for-responsive-tables/tablesaw-a-group-of-plugins-for-responsive-tables
Adobe Project Parfait - Get CSS out of a PSD https://mitchmckenna.com/post/14418/adobe-project-parfait-get-css-out-of-a-psd

Get a lot of comps from designers in PSD? Then have to either install Photoshop and look up sizes to implement it or just guess? This pretty neat tool from the creators of that format, allows you to easy get those values out of a PSD all online, even converts the objects to css (eg. the font-family to use, etc).

]]>
Mon, 12 May 2014 13:33:00 -0400 https://mitchmckenna.com/post/14418/adobe-project-parfait-get-css-out-of-a-psd/adobe-project-parfait-get-css-out-of-a-psd
Refills - Prepackaged Web Patterns for Bourbon https://mitchmckenna.com/post/14334/refills-prepackaged-web-patterns-for-bourbon

Refill is a collection of examples of web components you can use for Bourbon (Sass mixins library) similar to say, Bootstrap's components.

]]>
Fri, 11 Apr 2014 13:42:00 -0400 https://mitchmckenna.com/post/14334/refills-prepackaged-web-patterns-for-bourbon/refills-prepackaged-web-patterns-for-bourbon
Bootflat - Flat UI Kit Based on Bootstrap https://mitchmckenna.com/post/14319/bootflat-flat-ui-kit-based-on-bootstrap

Basically a Bootstrap theme with some really nice css and color tweaks.

]]>
Wed, 09 Apr 2014 21:29:00 -0400 https://mitchmckenna.com/post/14319/bootflat-flat-ui-kit-based-on-bootstrap/bootflat-flat-ui-kit-based-on-bootstrap
Ratchet - Prototype iPhone/Android Apps in HTML https://mitchmckenna.com/post/14106/ratchet-prototype-iphoneandroid-apps-in-html

Rachet is a css framework to quickly prototype an app before you build it natively. Or maybe you decide to make your native app a webapp wrapper, you can build the whole thing on Rachet. Rachet recently got folded into the Bootstrap Organization.

]]>
Wed, 26 Feb 2014 18:14:00 -0500 https://mitchmckenna.com/post/14106/ratchet-prototype-iphoneandroid-apps-in-html/ratchet-prototype-iphoneandroid-apps-in-html
Animate.css https://mitchmckenna.com/post/14053/animatecss

A bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.

]]>
Thu, 13 Feb 2014 21:16:00 -0500 https://mitchmckenna.com/post/14053/animatecss/animatecss
LayoutIt! - Interface Builder for Bootstrap https://mitchmckenna.com/post/13966/layoutit-interface-builder-for-bootstrap

LayoutIt! is a free tool to create the html for your next project using Bootstrap. It's not a website builder, it's just for quickly creating the layout of your website (rows, columns, nav, and anything else bootstrap includes).

]]>
Sat, 25 Jan 2014 17:03:00 -0500 https://mitchmckenna.com/post/13966/layoutit-interface-builder-for-bootstrap/layoutit-interface-builder-for-bootstrap
Hammer.js - Multi-touch Gestures Javascript Library https://mitchmckenna.com/post/13958/hammerjs-multi-touch-gestures-javascript-library

At only 3kb when gzipped, it is a lightweight and efficient library. Hammer doesn't require jQuery or other libraries to work. A jQuery plugin is available though. Hammer supports Tap, DoubleTap, Swipe, Drag, Pinch, and Rotate gestures.

]]>
Thu, 23 Jan 2014 18:47:00 -0500 https://mitchmckenna.com/post/13958/hammerjs-multi-touch-gestures-javascript-library/hammerjs-multi-touch-gestures-javascript-library
Placeit: Screenshots Of Your App/Website On Various Devices https://mitchmckenna.com/post/13926/placeit-screenshots-of-your-appwebsite-on-various-devices

Get gorgeous screenshots of your website or app on cellphones, tablet, laptops and monitors in various professional-looking photo environments. High-res photos cost money, but it's probably cheaper than you opening up photoshop.

]]>
Thu, 16 Jan 2014 18:48:00 -0500 https://mitchmckenna.com/post/13926/placeit-screenshots-of-your-appwebsite-on-various-devices/placeit-screenshots-of-your-appwebsite-on-various-devices
Fluidbox - Modern Lightbox Effect https://mitchmckenna.com/post/13856/fluidbox-modern-lightbox-effect

Replicating and improving the lightbox module seen on Medium with fluid transitions.

]]>
Wed, 01 Jan 2014 10:53:00 -0500 https://mitchmckenna.com/post/13856/fluidbox-modern-lightbox-effect/fluidbox-modern-lightbox-effect
Adaptive Backgrounds jQuery Plugin https://mitchmckenna.com/post/13834/adaptive-backgrounds-jquery-plugin

A jQuery plugin for extracting dominant colors from images and applying it to its parent.

]]>
Mon, 23 Dec 2013 15:13:00 -0500 https://mitchmckenna.com/post/13834/adaptive-backgrounds-jquery-plugin/adaptive-backgrounds-jquery-plugin
Perspective Page View Navigation https://mitchmckenna.com/post/13814/perspective-page-view-navigation

Some really cool effects where the entire page swings out and the navigation is revealed. Pushing the site content aside to reveal a navigation has become a trend for mobile navs. This tutorial shows a couple way it could be used.

]]>
Wed, 18 Dec 2013 13:44:00 -0500 https://mitchmckenna.com/post/13814/perspective-page-view-navigation/perspective-page-view-navigation
odometer https://mitchmckenna.com/post/13556/odometer

Odometer is a Javascript and CSS library for smoothly transitioning numbers, like a car odometer.

]]>
Sat, 26 Oct 2013 16:28:00 -0400 https://mitchmckenna.com/post/13556/odometer/odometer
Flat UI Kit (PSD) https://mitchmckenna.com/post/13557/flat-ui-kit-psd

Really nice (free) flat / blocky design you could base your next design on. The big (125mb!) UI kit has been carefully crafted by Enes Danış.

]]>
Sat, 26 Oct 2013 16:22:00 -0400 https://mitchmckenna.com/post/13557/flat-ui-kit-psd/flat-ui-kit-psd
Pure - Lightweight Responsive CSS Framework https://mitchmckenna.com/post/12924/pure-lightweight-responsive-css-framework

It's a set of small, responsive CSS modules. Just 5.7KB (smaller if you only use a couple). Includes a grid framework and styles for forms, buttons, tables and menus. It follows the SMACSS concept for modules. Use Skin Builder to customize the feel. If you think Bootstrap enforces too much of a particular look, this may be for you. Pure even works with Bootstrap JS modules.

]]>
Sun, 02 Jun 2013 20:35:00 -0400 https://mitchmckenna.com/post/12924/pure-lightweight-responsive-css-framework/pure-lightweight-responsive-css-framework
LivIcons - Animated Icon Pack https://mitchmckenna.com/post/12822/livicons-animated-icon-pack

Livicons is a $12 icon pack of cross browser animated vector icons. They're pretty cute.

]]>
Sun, 05 May 2013 17:11:00 -0400 https://mitchmckenna.com/post/12822/livicons-animated-icon-pack/livicons-animated-icon-pack
Awwwards - Awarding the Best Designed Websites https://mitchmckenna.com/post/12588/awwwards-awarding-the-best-designed-websites

Awwwards is a great place to get inspiration from some of the best designed websites around the web. Anyone can submit a website and the community votes on the best one of the day/month. "Our mission is to discover, recognize and promote the talent and effort of web designers, developers and agencies who create unique digital experiences that are useful, innovative, intuitive and beautiful."

]]>
Sat, 09 Mar 2013 17:33:00 -0500 https://mitchmckenna.com/post/12588/awwwards-awarding-the-best-designed-websites/awwwards-awarding-the-best-designed-websites