Codrops has just published a Page Stack Navigation template for a simple page stack navigation based on the Dribbble shot by Ilya Kostin, Stacked navigation. The idea is to show a navigation when clicking on the menu button and transform all pages in 3D and move them to the bottom of the viewport. The next two pages are shown in the back of the current page as a stack. When clicking on a menu item, the respective page comes up.
Requirements: CSS & JavaScript
Demo: http://tympanus.net/Blueprints/PageStackNavigation/
License: MIT License
Mattermost is an open source, self-hosted Slack-alternative that offers modern communication from behind your firewall. We built it so users have a practical option for avoiding lock-in from proprietary SaaS services. Mattermost is designed to be Slack-compatible (but not Slack-limited). That means we help users move over from Slack, but without limiting Mattermost to another product’s feature set.
Mattermost infrastructure is built for IT admins who want to quickly stand up a self-hosted alternative to Slack that’s easy to install, deploy, manage and scale. Mattermost includes a web-based System Console for managing instance level configuration. To simplify licensing, they have responded to community feedback and the compiled version of Mattermost v1.0 is now under the MIT open source license (instead of Apache-AGPL).
Requirements: –
Demo: http://www.mattermost.org/
License: MIT License
You can now create stunning map visuals in just minutes with AmCharts new tool – Pixel Map Generator. Integrate the result into your website, drop into a presentation, or even use them in print brochure. Regardless of how you use it, jaw-dropping effect is guaranteed.
Requirements: –
Demo: http://pixelmap.amcharts.com/
License: License Free
Codrops has published a tutorial of how to create an elastic SVG progress loader based on the Dribbble shot “Download” by xjw and implemented with SVG and TweenMax. The button starts as an icon with an arrow and once it’s clicked, it animates into a fun little wire and a label that indicates the download percentage. If you would like to use this loader in your project, go to the Github page and follow the instructions.
Requirements: –
Demo: http://tympanus.net/Development/ElasticProgress/
License: License Free
Chocolat.js enables you to display one or several images staying on the same page. The choice is left to the user to group together a series of pictures as a link, or let them appear as thumbnails. The viewer may appears full-page or in a block. Chocolat comes with an API and multiples CSS classes which make it very handy to use for advanced users, and very easy to use for newbies. Chocolat works well with all major browser. It has been tested on : IE7+, firefox, chrome, opera, safari.
Requirements: JavaScript Framework
Demo: http://chocolat.insipi.de/
License: Creative Commons 2.0 License
PriorityNav is a lightweight pure javascript plugin that will move your menu items if they don’t fit its parent. PriorityNav is developed by @gijsroge & weighs around 5kb & 2kb gzipped. The idea behind this plugin is based around the priority+ navigation from Brad Frost.
PriorityNav is licensed under the MIT license which basically means you can do whatever you want as long as you include the original copyright and license notice in any copy of the software/source. It works on ie9+ (if you include classList.js), Chrome, Firefox, Safari, Opera. (mobile & desktop).
Requirements: JavaScript Framework
Demo: http://gijsroge.github.io/priority-nav.js/
License: MIT License
Flarum is free, open-source forum software with a focus on simplicity. You can use Flarum to easily set up a discussion forum for your website. It’s forum software reimagined. Flarum looks and feels great out of the box. The user interface is streamlined so you can spend less time clicking and more time talking. You can keep on scrolling, without having to wait for the next page of posts to load. Flarum lets you scrub anywhere in a discussion quickly and easily. It remembers your position if you come back after navigating away.
There is a Floating Composer, you can read while you write. Flarum’s reply form slides up from the bottom of the page, so you can scroll up to read posts – and even visit other discussions – while you draft your reply. Flarum is fully responsive by default, and not just as an afterthought. The interface has been optimized for touch, with big buttons, smooth animations, and gestures aplenty.
Requirements: –
Demo: http://flarum.org/
License: MIT License
jQuery LightGallery is a lightweight, customizable, modular, responsive, lightbox gallery plugin for jQuery. It uses CSS-only approach for resizing images and videos. So it will be extremely flexible, and considerably faster than using the JavaScript approach. Lightgallery comes with a few built in modules, such as thumbnails, full screen, zoom, etc. It is easy to create your own modules, as well as detach modules that you don’t want to use.
Lightgallery supports touch and swipe navigation on touchscreen devices, as well as mouse drag for desktops. This allows users to navigate between slides by either swipe or mouse drag. You also have the option to enable animated thumbnails from the settings. otherwise normal thumbnail will be used. You can also make thumbnails automatically load for your YouTube or vimeo videos. LightGallery uses Hardware-Accelerated CSS3 transitions for faster animation performance. This plugin comes with numerous number of beautiful inbuilt animations.
Requirements: jQuery Framework
Demo: http://sachinchoolur.github.io/lightGallery/
License: Apache License
TouchPoint.js is a tiny (3.6kb minified) vanilla JavaScript library made for in-browser HTML prototyping (as part of the UX process) that visually shows where the user clicks/taps on-screen using CSS3 transforms and transitions.
TouchPoint is highly customizable, mobile ready and great for screencasting, screen recording, user testing and presentations. TouchPoint is customizable. There are a number of options that you have access to to customize the look for your needs. Performance should not be an issue because each individual TouchPoint element is dynamically created and then automatically removed from the DOM after being used.
Requirements: JavaScript Framework
Demo: https://github.com/jonahvsweb/touchpoint-js
License: MIT License
Infinit is a file storage and sharing company created in 2012 by two Frenchmen, Julien Quintard and Baptiste Fradin, with the vision of combining technology and design to allow anyone to send any file (photos, videos or else), of any size, to anyone, on any device.
Infinit is a file transfer application based on a point-to-point technology that connects both the sender’s and recipient’s computer directly. This deviates from cloud-based services like WeTransfer, YouSendIt (Hightail) and Dropbox that rely on a two-phase process through which the files must first be uploaded to the cloud before they can be downloaded by a recipient. The technology allows for transfers to be at least twice as fast, and up to 30 times faster, than cloud-based file sharing services.
The product also benefits from an intuitive user experience allowing anyone to send any file or folder, of any size in just a matter of seconds through a single drag & drop on desktop and just a few taps on mobile. Infinit completely removes the friction from selecting a tool that only support certain file formats or imposes arbitrary file size limits on the data you wish to send.
Requirements: –
Demo: https://infinit.io/
License: License Free
