Thursday Roundup # 61
This is our web design and web development news series where we share our favorite design/development related articles, resources, tutorials and awesome freebies.
NEW DEVELOPMENT RESOURCES AND TOOLS
Open Source Engagement Management Platform
Pimcore is an Open-Source Multi-Channel Experience and Engagement Management Platform. You can easily increase engagement with customers and users. Deliver rich & compelling digital experiences. Push content to any channel, any device, at any time.
The clearly arranged UI makes it easy to manage your content with simple drag-n-drop gestures that hide all the complexity from the editors. Combining unparalleled ease of use with connect anything technology, total flexibility, and enterprise-grade capabilities with 18 different languages.
Crowdspell
Crowdspell is a free and small script that allows the reader of an article to correct a typo very easily and quickly.
Manage Your WordPress Blog Like A Pro – 50 Free WordPress Plugins Your Blog Needs
So you have got a WordPress blog up and running. Now make sure you leverage all the benefits of this feature-rich platform. WordPress offers a decent feature set in its own and also provides various extension points that you can use to enhance your WordPress blog. You can turn your WordPress website into an online shopping portal, integrate with third-party services, or use its content management features to host a website or knowledge base. You can do all this and much more without having to write a single line of code. Thanks to the rich WordPress plugins library that allows you to simply install and configure useful WordPress plugins and enhance functionality of your WordPress website.
This blog post lists some free and useful WordPress plugins that you must try to keep your WordPress up and running with your required features and enhancements.
JavaScript Kinetic Scrolling
This is all about kinetic scrolling using JavaScript. This site is featuring an amazing collection of tutorials on JavaScript kinetic scrolling.
Bulletproof Accessible Icon Fonts
Care must be taken when implementing icon fonts to ensure a great experience for all users. What happens when your font doesn’t load? What happens when @font-face isn’t supported in the browser? We’ll show you how to implement bulletproof font icons.
CSS Animation Tricks: State Jumping, Negative Delays, Animating Origin, and More
Zach cooks up some pretty inspiring animations.
Websites for Finding Free Stock Photos And Royalty Free Images for Your Blog / Website
Whether you’re building a new website design or just a placeholder in a current project or need images for your company website or blog, stock photos are normally a necessity. They are useful and make the design look better overall if the photo is professional. Of course, photographers cost a ton and might be out of your budget, and you might not have the time, equipment, or skills to take the best photos for our own projects.
There are many websites out there which offer great royalty free images for free. By popular demand, here’s our EGrappler roundup of the best places to find free and legal stock photos online for your website and blog.
Google Map Builder
A fantastic and free Google Maps builder.
Mappy.js – Google Maps & Places jQuery Integration Plugin
Mappy.js is a jQuery plugin to select places on a map. As well as picking places, you can add/edit ones to integrate with your own database.
Javascript Library for Precise Facial Tracking – Clmtrackr Face Substitution
Clmtrackr is a javascript library for fitting facial models to faces in videos or images. It currently is an implementation of constrained local models fitted by regularized landmark mean-shift, as described in Jason M. Saragih’s paper. clmtrackr tracks a face and outputs the coordinate positions of the face model as an array.
Animating CSS Shapes with CSS Animations & Transitions
This article talks about animating CSS shapes with CSS animations. We’ll be creating very basic “shape-shifting” layouts of sort. There are also many considerations to take when animating CSS shapes, so we’ll go over all points in this article.
JavaScript’s Best Practices
This is a JavaScript guide intended to introduce new developers and help experienced ones to the JavaScript’s best practices.
Best Photoshop Plugins, Scripts and Extensions [Free Download]
This post encompasses a wide range of free Photoshop plugins, tools and extensions. In this post, we have listed some of very useful and free Photoshop extensions and plugins that you will find handy when working on Photoshop projects.In this post, you will find links to free vector icons, 3D Photoshop actions, and a free tool for extracting image layers from any PSD/PSB file. You will also find a free 3D Photoshop map action to convert a flat map to a three dimensional isometric stylish one a single click. For iOS and Android UI designers, this post lists useful Photoshop Scripts for generating the device art.
Saved.io – The Fastest Way to Save Bookmarks
Saved.io is ridiculously simple to use – just type “saved.io/” in front of any URL in your address bar, hit enter and you’ve just saved a bookmark. Anthony Feint has purposefully left out Tags, Folders, Descriptions, Notes etc. from this app. Saving a bookmark should be fast.
Fit.js – Fit Things Into Other Things
Fit.js has a very simple purpose and that is to help you fit things into other things.
Wireframing With Illustrator and InDesign
I design all of my wireframes in Illustrator. The main reason: I know how to use Illustrator extremely fast. Like seriously mind-bending fast. I don’t use UI kits, ready made templates, I just open it up and start powering through ideas. Drawing all of my own buttons, icons, etc.
Illustrator starts off as my digital sketch board. For 95% of the things I wireframe, I start with mobile first. This constrains my designs to a tiny viewport and helps me go even faster.
Introducing New Features in Photoshop CC (14.2)
Photoshop CC (version 14.2) includes many new features, including Perspective Warp for manipulating multiple perspectives in an image, and linked Smart Objects for easier reuse of design elements. We are also delighted to deliver support for 3D printing in Photoshop CC. Now you can design, edit and print in 3D using the world’s best imaging tool.
FREE TEMPLATES AND THEMES
Free HTML5 Responsive Business/Portfolio Template
AmazingBiz – a free HTML5 responsive template. This free responsive template is design to look great on all devices, including desktops, smartphones and tablets. The HTML5 templateincludes search engine optimized content, fully functional 2 /3 / 4 column portfolio, contact form, image /content slider, and a featured content gallery.
Minimal, Customizable Typography Stylesheet – Typebase.css
Typebase.css is a minimal, customizable typography stylesheet. It has both less and sass versions so it can easily be modified and merged into modern web projects. It provides all the necessary scaffolding for good typography without adding any aesthetics. It is built to be modified as projects evolve andgrow,and plays nice with normalize.css.
Freebix – Free Responsive HTML Template
If you are looking for a premium, universally applicable template that can be used in a variety of niches, from real estate to beauty products, Freebix is your go-to solution.
It is fresh, appealing and classy looking template that can make your website stand out.
Career Timeline – Free PSD Template
Port of Bootstrap to Sass
Bootstrap-sass is a Sass-powered version of Bootstrap, ready to drop right into your Sass powered applications.
Free Landing Page Template
DESIGN FREEBIES
Bootstrap 3 Vector UI Kit
This UI Kit contains all Twitter Bootstrap 3 UI controls in vector format, Glyphicons that come with Bootstrap and lots of bonus UI elements that are perfect for mockuping control and admin panels.
All basic UI elements from this kit are already sliced, styled, HTML-encoded and ready to use. Please refer Bootstrap UI Framework for documentation. UI Kit contains Adobe Illustrator, PDF and Sketch files.
Simple UI Kit – Flat UI Elements
40+ Best Photoshop PSD Web & Mobile UI Kits for 2014
If you are in UI design, you should bookmark this page because it is going to be your master list of useful PSD UI kits for 2014. In this post, you will find high-quality UI design kits for Web and mobile applications. The designs in these UI kits reflect the latest trends in web and mobile design such as Metro UI, flat UI and minimalistic UI designs. This list also includes free PSD UI kits that you can download and use in your next project.
You will also find Photoshop UI elements that can be used to design professional website layouts, mobile applications, admin templates and web portals.
Our favorites are Flatty UI Kit (an nice Photoshop design kit to develop a neat web portal or admin template), Avenger Flat UI (a decent adaptation of Metro UI), and Freebee App (a useful PSD kit for designing mobile applications).
Enjoy this comprehensive list of free UI kits and do not forget to share your experience with these free UI kits.
210 Free Vector Icons for Web Design and Wireframes
iPhone 5S & 5C Mockup (Hand PSD)
Nasty Icons
Mobile Wireframe Kit PSD
CHASE (Free Font)
Blenda Script – Free Font