We are back again with some useful, handy and recently released tools for designers and developers. The March 2014 edition of Latest Tools for Developers and Designers includes new web apps, frameworks, code editors, JavaScript libraries, Photoshop actions, CSS tools, and many more.
We hope the following tools will help you to accomplish your tasks in certain period of time. If you are aware of any useful web tools which have been released recently you can let us know by posting a comment in comment box, we would love to hear from you. We hope you will find the list handy and useful for your upcoming projects and development tasks. Enjoy !
1. Metal Smith
Metalsmith is an extremely simple, pluggable static site generator. In Metalsmith, all of the logic is handled by plugins. You simply chain them together. Metalsmith works in three simple steps: Read all the files in a source directory. Invoke a series of plugins that manipulate the files. Write the results to a destination directory. Since everything is a plugin, the core library is actually just an abstraction for manipulating a directory of files.
2. Stripe Checkout
Stripe Checkout is an embeddable payment form for desktop, tablet, and mobile devices. It works within your site—customers can pay instantly, without being redirected away to complete the transaction. You can integrate Checkout in as little as a single line of client-side code. client-side code.
Stripe will always support building the whole payment form yourself, but Checkout enables Stripe to do more for you. With Checkout, they’re constantly collecting data and running tests with the goal of increasing your revenue.
3. Dewey
Dewey is a Chrome app for tagging, searching and sorting your Chrome bookmarks. With Dewey you can add custom tags, generate screenshots of your bookmarks, search and sort in a much smarter and faster way. Dewey organizes your bookmarks into a grid that continues to load as you scroll down. The layout is also fully responsive, so it still works well even if you need to use a narrow browser window.
4 Glyphr
Glyphr is a free, html5 based font editor. Font design has a high barrier of entry. Professional font design programs are very complex, and quite expensive. Glyphr is accessible, streamlined, and made for font design hobbyists, and it’s free.
5. Bucky
Bucky is a client and server for sending performance data from the client into statsd + graphite, OpenTSDB, or any other stats aggregator of your choice.
It can automatically measure how long your pages take to load, how long AJAX requests take and how long various functions take to run. Most importantly, it’s taking the measurements on actual page loads, so the data has the potential to be much more valuable than in vitro measurements.
6. Durandal
Durandal is a cross-device, cross-platform client framework written in JavaScript and designed to make Single Page Applications (SPAs) easy to create and maintain. They have used it to build apps for PC, Mac, Linux, iOS and Android. Durandal is built on libs you know and love like jQuery, Knockout and RequireJS. There’s little to learn and building apps feels comfortable and familiar.
7. Zanti
zANTI is a comprehensive network diagnostics toolkit that enables complex audits and penetration tests at the push of a button. It provides cloud-based reporting that walks you through simple guidelines to ensure network safety. zANTI offers a host of penetration-testing features, including everything from Man-In-The-Middle and password complexity audits to port monitoring and a sophisticated packet sniffer.
8. ChartsPree
ChartsPree is a web service which lets you create interactive charts in seconds. Users need to use Chartspree’s URL to inject charts into their websites. The data is supplied via the URL, no Javascript required. Chartspree lets you generate placeholder data, customize the appearance of (line) charts and gives you fancy hover effects for your charts.
9. Vim.Sexy
Vim is all about the modern web. Vim will help you take your web app to the next level. Vim comes with ready-made tools to format HTML, CSS, Javascript, Node.js, C++ and more.Vim not only runs on your OS X dev machine, but also on your Ubuntu Linux servers. This means you can crush code in production without sacrificing your editing experience.
10. Carota
Carota is a rich text editor implemented totally in JavaScript that uses HTML5 canvas for rendering. At runtime Carota has no external dependencies, you just pull in the carota-min.js file using the SCRIPT tag and away you go. The source code is released under MIT license.
11. Kobra
Kobra is an online code editor that allows you to collaborate with your team quickly and efficiently. After you connect to your development environment, you can see changes in your files as your team members type them. Kobra also has built in video, voice and text chat so you’re never more than a click away from your team.
12. Atom
Atom is a hackable text editor built by the folks at GitHub. Atom is a desktop application based on web technologies. Like other desktop apps, it has its own icon in the dock, native menus and dialogs, and full access to the file system. Whether you’re tweaking the look of Atom’s interface with CSS or adding major features with HTML and JavaScript, it’s never been easier to take control of your editor.
13. Enjoy CSS
With EnjoyCSS, creating instances for hover, active, and custom class states has never been more simplified than with EnjoyCSS generator. It is one of the many useful CSS tools which every developer and designer should have in their toolbox by which to speed up their work-flow.Its ease of use and simple UI allows one to incorporate rich graphic styles quickly and without coding.
14. Capo
Capo is a module that serves for managing event-driven js architectures and encourages mediator pattern usage solving its biggest weakness – uncertainty of event triggers and listeners. Capo opens files in folder you’ve provided looking for events being published or subscribed to and tracks them. The next action is report building. By default html reporter is used. In this case ‘capo’ folder is created in the folder of capo command execution, report.html is the file you are looking for.
15. Browser Sync
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.
16. Keyframer
Keyframer is an incredibly easy to use CSS3 animation creation tool. All you have to do is Just click the timeline to add a keyframe, then click the circle button to add your animation’s CSS, or the X button to delete the current keyframe, and test your skills.
17. Pageres
Pageres is a command-line tool for generating screenshots in different resolutions for websites. Pageres is focus on sizes: you could script it to generate screenshots of responsive websites. The command-line options allow you to specify many dimensions at once, so it’s easy to generate results for a responsive site.
18. Hamingway
Hemingway is a web application that makes your writing bold and clear. Hemingway highlights long, complex sentences and common errors; if you see a yellow highlight, shorten the sentence or split it. If you see a red highlight, your sentence is so dense and complicated that your readers will get lost trying to follow its meandering, splitting logic.
19. Tweak Style
TweakStyle is a new web design software that associates the features web designers are expecting, in order to save time and energy. It is powerful software that combines the tools essential to do amazing web design. TweakStyle provides side by side code and preview panes with smart tools utilized on both the preview and the code.
20. Sticker.js
Sticker.js is a lightweight 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.
21. PHP-CPP Library
The PHP-CPP library is a C++ library for developing PHP extensions. It offers a collection of well documented and easy-to-use classes that can be used and extended to build native extensions for PHP. This C++ library makes building PHP extensions fun. Extensions build on top of PHP-CPP are easy to understand and simple to maintain, and your code looks great – and give a huge boost to your application!
22. Tyto
Tyto is a completely customizable, configurable, and extensible organization tool. It has a simple user interface, doesn’t require accounts, and is easy to use and configure.
23. Quink
Quink is an open source in-page WYSIWYG HTML editor that’s easy to use. It’s versatile, extensible, and uses the contenteditable features of modern browsers.
24. Grid Style Sheet
GSS reimagines CSS layout & replaces the browser’s layout engine with one that harnesses the Cassowary Constraint Solver — the same algorithm Apple uses to compute native layout.
25. Type Finder
Type Finder is an online tool for finding reputable typerfaces. Just answer five questions and you’ll get a list of great fonts to choose from.
26. Random User Generator
This Random User Generator plugin for Photoshop makes it simple to create random users to add to your mockups, complete with names and photos.
27. Molecule
Molecule framework has been built for enthusiast game developers with more than five years of experience on mobile gaming and more than ten on general game development.
28. Cute Grids
Cute Grids is a responsive grid system full of features to help designers and developers get started with their responsive layout.
29. UI Faces
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
30. Ink
Ink Photoshop Plugin helps you providing few extra important information about your mockups by documenting your layers, from typography to effects and shape sizes.
