55 Fresh Examples Of Creative Single Page Website Designs

Displaying your work in single page design is a hot trend now days. You possibly cannot imagine what designers can do with single pages as modern age designers love to experiment with things and observe how people interact with their work. The best single pages are those that help you convey your message into few… Continue reading 55 Fresh Examples Of Creative Single Page Website Designs

An Introduction to Composition

Composition is about laying out all your ideas and design elements into a whole; composing your design. We’re going to combine all of the previous lessons that we’ve covered, and because of that it makes composition one of those really difficult aspects of designing anything.   Creating a good composition will boost the users’ experience… Continue reading An Introduction to Composition

A Look Into CSS Units: Pixels, EM, and Percentage

Unit takes an important role for measuring and building things like a house, a bridge or a tower, and building a website is not an exception. There are a number of methods of measurements used on the Web, specifically in CSS, namely Pixel, EM and Percentage. In this post, we are going to run through… Continue reading A Look Into CSS Units: Pixels, EM, and Percentage

Quick Tip: Add a Progress Bar to Your Site

Since the advent of mobile, web sites are turning more and more into “apps”. Concepts that make sense for a locally running application are transferred to the web. One of these is the recent addition of “progress bars” to some of Google’s websites that show the loading state of the page. In this quick tip,… Continue reading Quick Tip: Add a Progress Bar to Your Site

Adding Space to Your Designs

Let’s get the basic stuff out of the way first. Whitespace isn’t simply a block of space in your design that has to be white. Instead, think of it more like structural “empty” space, where no extra elements, embellishments or other parts to your design are placed. A great example of whitespace – but still… Continue reading Adding Space to Your Designs

Flat UI Pro 1.2 Released

Today, we announce the long-desired release of Flat UI Pro 1.2. The main feature of this release is its support of Bootstrap 3.0, officially issued a few weeks ago. This was a long time coming because of issues and the addition of new elements/code. Thank you for your patience! Here are the most important changes:… Continue reading Flat UI Pro 1.2 Released

Sliding Horizontal Layout

Today we’d like to share an interesting layout with you. You might have seen it already on Skybox or on the website of Lotta Nieminen. It’s a layout where we see the main section in the middle and part of the previous and next section on the sides. The navigation reflects this view by showing… Continue reading Sliding Horizontal Layout

Learn AngularJS With These 5 Practical Examples

By now you’ve probably heard of AngularJS – the exciting open source framework, developed by Google, that changes the way you think about web apps. There has been much written about it, but I have yet to find something that is written for developers who prefer quick and practical examples. This changes today. Below you will… Continue reading Learn AngularJS With These 5 Practical Examples

Using Alignment to Improve Your Designs

Alignment is one of those things that comes hand-in-hand when working with grid systems. The subject of alignment isn’t simply a matter of choosing whether or not you want to align text or images to the left or right of a design (though those decisions obviously still matter), instead, we employ alignment to improve our… Continue reading Using Alignment to Improve Your Designs

Anatomy of a Perfect Sidebar – The Nuances of a Good Design

In the previous part of the series, we’ve gone through the definition and the importance of the “sidebar” element on WordPress blogs and checked out layouts with one, two, three and four sidebars (and no sidebars). In this second part, we’re going to see how to design a sidebar and order the elements – specifically,… Continue reading Anatomy of a Perfect Sidebar – The Nuances of a Good Design

30+ Stunning Joomla Virtuemart Templates

It is more and more common that web developers use solid and mature multi-purpose CMS platforms, such as WordPress, Drupal and Joomla, for building professional and easy to maintain websites, web applications and webshops. These solutions are interesting because they are easy to set up, they make it a breeze to publish content and further you… Continue reading 30+ Stunning Joomla Virtuemart Templates

A Collection of Beautifully Designed Coming Soon Pages

One of the main ideas behind the lean startup principle is that you validate your idea early. If you’ve working on a startup idea, or a new product or a service or app, the idea is that you get something you can show to the world to see what people say. Coming soon pages are… Continue reading A Collection of Beautifully Designed Coming Soon Pages

Dominating Bold Type in Website Design: New Examples

What makes great website design great? Your answer will definitely vary: advanced animations, spectacular captivating photos, uncommon video intros, high-detailed artistic illustrations, flawless execution of popular styles, creative solutions and much more – all these aspects depend on kind and purpose of website itself, but there is undoubtedly one thing that you find in common… Continue reading Dominating Bold Type in Website Design: New Examples

Create a slide-out footer with this neat z-index trick

In this short tutorial, we are going to create an interesting slide-out footer with a bit of CSS. Grab the zip from the download button above, open it in your favorite code editor and read on! The Idea The effect we are after, is to give the impression that the page lifts up to reveal… Continue reading Create a slide-out footer with this neat z-index trick

A Journey Through Beautiful Typography In Web Design

First impressions are lasting impressions. Whether you realize it or not, your typography helps to create an experience for users before they’ve even read a word or clicked a button. Typography has the potential to go beyond merely telling a story — it shows the user who is behind the website and what you’re about. The treatment… Continue reading A Journey Through Beautiful Typography In Web Design

50 Amazing jQuery Plugins That You Should Start Using Right Now

jQuery has a wonderful community of programmers that create incredible things. However, it may become difficult to sift through everything that is released and find the gems that are absolute must-haves. This is why, in this post, you will find a collection of 50 new jQuery plugins and JavaScript libraries that, when applied with good… Continue reading 50 Amazing jQuery Plugins That You Should Start Using Right Now

45 Awesome Design Fonts for Minimalist Design

Taking a minimalist approach for your website or a graphic project requires that you use fonts that match the simple and uncluttered setup of your design. Clean and light fonts can profoundly complement your minimalist design as they appear laid back and subdued. Their somewhat subtle appearance would give you a breathing space to admire… Continue reading 45 Awesome Design Fonts for Minimalist Design

How to Make a Tumblr-powered News Ticker

Tumblr is a blogging service with an elegant interface for creating and publishing content. In this tutorial, we are going to use it as the foundation of a news publishing system. We are going to develop a simple widget which cycles through the most recent posts on a Tumblr blog, and presents them as news items… Continue reading How to Make a Tumblr-powered News Ticker

Live Album Previews with CSS3 and jQuery

Today we are going to make a script for previewing the contents of an album with a slideshow-like animation. This can be used in photo galleries, online shops, profile pages and more. The example is inspired by Facebook, where you hover over an album and get a slideshow of some of the photos contained inside it. Let’s… Continue reading Live Album Previews with CSS3 and jQuery

Create a Beautiful Password Strength Meter

In this tutorial we will be creating a beautiful password strength indicator. It will determine the complexity of a password and move a meter accordingly with the help of the new Complexify jQuery plugin. Only when a sufficiently complex password is entered, will the user be able to continue with their registration. A PSD file is also… Continue reading Create a Beautiful Password Strength Meter