Finding sample avatars for interface design can be hard and annoying too. However uifaces can make your life simple. UI Faces is a online tool that have growing number avatars collection.
It provides a interface to adjust the avatar size, spacing and border radius of avatars. After adjusting the avatar according to your requirement you save the avatar by right clicking on avatar. This tool was born from the daily toil of finding sample avatars for UI mockups, and created by Caleb Ogden.
Requirements: –
Demo: http://uifaces.com/
License: License Free
Sticker.js is a javaScript library that allows you to create a Sticker Effect. There is no dependencies (jQuery not required). It works in most of major browsers that support CSS 3 (IE10+). It is licensed under MIT License.
Requirements: Javascript framework
Demo: http://stickerjs.cmiscm.com/
License: MIT License
Fattable is a javascript Library to create table with infinite scroll, with infinite number of rows and number of columns. Big table don’t do well with DOM. Your scroll will start getting choppy. Also big tables can rapidly grow in sizes. It is not always possible to have clients download or even retain all of the table data.
Fattable includes everything required to load your data asynchronously. The design is up to you. Style the table via css and use your painter to hook up events, and render your content in your cell.
Requirements: JavaScript Framework
Demo: https://github.com/poulejapon/fattable
License: MIT License
Tip Cards plugin let you create a layout of cards with a card-like interaction that you see on Google Tips Page. There are several new animation options so that you can personalize it to your own liking. You can use callbacks to perform actions before or after the modal opens. Modern browsers such as Chrome, Firefox, and Safari on desktop have been tested.
Requirements: jQuery Framework
Demo: http://www.thepetedesign.com/demos/tip_cards_demo.html
License: License Free
Croppic is an image cropping jquery plugin that will satisfy your needs and much more. Simply upload an image, and then you are able to crop the image as you like with the zooming in and out functionality. It works in IE 10+, chrome, and firefox. It uses FormData so there is no IE9 and prev versions support at the moment.
Requirements: jQuery Framework
Demo: http://www.croppic.net/
License: License Free
When you’re making responsive websites, there’s a lot of tweaking and testing to do. BrowserSync makes your workflow faster by synchronising URLs, interactions and code changes across multiple devices. It’s wicked-fast and totally free.
Your scroll, click, refresh and form actions are mirrored to browsers while you test. Browsers are automatically updated as you change HTML, CSS, images and other project files. Ready to use with websites running on PHP, ASP, Rails and more. Fine with static files too.
Requirements: –
Demo: http://www.browsersync.io/
License: MIT License
fn.js is a JavaScript library built to encourage a functional programming style & strategy. fn.js aims to support functional practices over performance or established conventions. In order to guide you on the right path, fn.js internals force avoidance of side effects, object mutation, and function state.
fn.js runs in the Node.js or in the browser using normal script tags or via an AMD loader such as RequireJS. It is MIT licensed and hosted on GitHub.
Requirements: JavaScript Framework
Demo: http://eliperelman.com/fn.js/
License: MIT License
jQuery and its cousins are great, and by all means use them if it makes it easier to develop your application. If you’re developing a library on the other hand, please take a moment to consider if you actually need jQuery as a dependency.
Some developers believe that jQuery is protecting us from a great demon of browser incompatibility when, in truth, post-IE8, browsers are pretty easy to deal with on their own. Go and check out this tool: You Might Not Need jQuery.
Source: http://youmightnotneedjquery.com/
Nightwatch.js is an easy to use Node.js based End-to-End (E2E) testing solution for browser based apps and websites. It uses the powerful Selenium WebDriver API to perform commands and assertions on DOM elements.
It’s simple but powerful syntax which enables you to write tests very quickly, using only Javascript and CSS selectors. No need to initialize other objects and classes, you only need to write the test specs. Built-in command-line test runner which enables you to run the tests either altogether, by group or single.
Requirements: Node.js
Demo: http://nightwatchjs.org/
License: License Free
As of 2013, there are thousands of different devices and screen sizes that browse the internet, so it’s impossible to design layouts to target them all. Instead, we must take a more fluid approach to design.
Grid is a simple guide to responsive design. By following those simple steps, you are on the path to responsive web design mastery. Keep practicing and help make the web a better, more useable place.
Source: http://www.adamkaplan.me/grid/
