Visual Designers Checklist are merely suggestions for your workflow. You can contribute on Github or make a fork and create your own unique workflow checklist. This list is meant for visual designers working within a team setting where visual comps and exploration will be shared with a developer. Checkboxes are persistent (they won’t uncheck on refresh) where localstorage is supported.
Requirements: –
Demo: http://webdesignerschecklist.com/
License: License Free
Smart Fixed Navigation is a fixed navigation that allows your users to access the menu at any time while they are experiencing your website. It’s smaller than a full-width fixed header, and replaces the back-to-top button with a smarter UX solution.
Requirements: JavaScript Framework
Demo: http://codyhouse.co/gem/smart-fixed-navigation/
License: License Free
The Simpsons is an American family animated sitcom created by Matt Groening. The Simpsons is the longest-running American sitcom, the longest-running American animated program. The Simpsons is widely considered to be one of the greatest television series of all time. So, how about making Simpsons characters in pure CSS?
“First of all I took each character’s face and broke it up into different shapes that I could then piece together to create the character,” Chris Pattle explains. “You often see artists do the same kind of thing when demonstrating their drawing techniques so I figured it was the right way to start. The hardest part of this was breaking down the character into shapes that I knew I could create with CSS.” Chris Pattle said.
Requirements: CSS
Demo: http://pattle.github.io/simpsons-in-css/
License: All images are copyright to their respective owners
Intense Images is a stand alone javascript library for viewing images on the full screen. Using the touch/mouse position for panning. All styling of image elements is up to the user, Intense.js only handles the creation, styling and management of the image viewer and captions.
There aren’t many restrictions for the html elements you want to use to activate the Intense image viewer, the one manditory attribute is either a src or a data-image, which needs to point to an image file. You can use data-image if you want to load in a different version of the image to the original source.
Requirements: JavaScript Framework
Demo: http://tholman.com/intense-images/
License: MIT License
Raneto is a free, open source Knowledgebase platform for Node.js that uses static Markdown files to power the knowledgebase. Raneto can be called a “static site generator” of sorts as it doesn’t require a database. All of your content is stored in the content folder in Markdown (.md) files and the entire knowledgebase structure and content is generated by Raneto.
This is good because it’s: 1) Simple: You can create and manage an entire knowledge base using your favorite text editor. 2) Flat: Raneto is a “flat file” CMS, meaning no database woe’s, no MySQL queries, nothing. 3) Fast: Raneto is seriously lightweight and doesn’t use a database, making it super fast.
Requirements: Node.js Framework
Demo: http://raneto.com/
License: MIT License
Beautiful Web Type is a showcase of the best typefaces from the Google web fonts directory. There are over 600 typefaces in the Google web fonts directory. Many of them are awful. But there are also high-quality typefaces that deserve a closer look. Check out the examples to get the typeface from the Google web fonts directory.
Requirements: Google Web Fonts
Demo: http://hellohappy.org/beautiful-web-type/
License: License Free
Select-or-Die is a jQuery plugin to style select elements. If you feel like adding a placeholder that’s displayed before anything is selected. Once a selection has been made the placeholder will be removed until the user clicks the SoD again. You can also add a prefix that’s displayed in front of the selected option.
When enabled “Keyboard Cycle”, it allows the user to cycle the list using his/hers arrow keys. Lets say an option have been added to the native <select>, then you might want to update the SoD to reflect the native <select>. Then it’s just a matter of running the update method and the SoD will update with the new option.
Requirements: jQuery Framework
Demo: http://vst.mn/selectordie/
License: MIT License
Trumbowyg is a light, translatable and customisable WYSIWYG editor jQuery plugin. Beatiful design, generates semantic code, comes with a powerful API. Editor and generated code are optimized for HTML5 support. Compatible with all recents browsers like IE8+, Chrome, Opera and Firefox.
All existing WYSIWYG editors are larger than 45kB. Trumbowyg is only 15kB which means faster page loading. No useless features, just the necessary ones to generate a clean and semantic code. Options and design are entirely configurable ot suit your needs.
Requirements: jQuery Framework
Demo: http://alex-d.github.io/Trumbowyg/
License: License Free
jPList is a flexible jQuery plugin for sorting, pagination and filtering of any HTML structure. It supports data sources: PHP + MySQL, ASP.NET + Sql Server, PHP + SQLite. It works with JavaScript templates like Handlebars, Mustache etc.
jPList supports XML + XSLT. It works in all major browsers. For non-commercial, personal, or open source projects and applications, you may use jPList for free under the terms of the GPL V3 License.
Requirements: jQuery Framework
Demo: http://jplist.com/
License: GPL v3 License
localForage is a JavaScript library that improves the offline experience of your web app by using asynchronous storage (via IndexedDB or WebSQL where available) with a simple, localStorage-like API.
localForage uses localStorage in browsers with no IndexedDB or WebSQL support. Asynchronous storage is available in the current versions of all major browsers: Chrome, Firefox, IE, and Safari (including Safari Mobile). localForage supports both a callback-based and Promises-based API, so you can use whichever you prefer.
Requirements: JavaScript Framework
Demo: http://mozilla.github.io/localForage/
License: Apache License
