You Are Here: Home » Posts tagged "design"

CSS Feature Detection: Modernizr or Feature Queries?

In this tutorial, I’ll go over two approaches for detecting whether a browser supports certain CSS features or not. The first one takes advantage of Modernizr , a popular JavaScript library and the second one  feature queries , a promising CSS solution. So, let’s start! Detecting Features Using Modernizr As mentioned above, Modernizr is a lightweight JavaScript library which detects HTML5 and CSS3 features ...

Read more

How to Use Avocode to Inspect Your Photoshop and Sketch Files

In today’s tutorial I’m going to introduce you to Avocode , developed by the “eleven brave men and one brave woman” of  Source and recently released in the form of version 1.0. Avocode is an application which allows you to work with .psd and .sketch files, moving from design to code, without even opening Photoshop or Sketch. We covered Avocode a few months ago , but back then it was still in beta and has si ...

Read more

Design Last

How does one design and develop for the responsive web? A lot of methodologies out there try to tackle this problem, but all of them rely on the same classic website development process. It boils down to the following: design and then develop. Let’s go nuts and flip this outdated methodology on its head. Before we start flipping things around, let’s take a quick stroll down memory lane, just so we know wher ...

Read more

Building & Customizing HTML5 Range Sliders

Web developers who have been keeping up with HTML5 specs know about the fascinating range slider. It was popularized on the iPhone and has since grown into a powerful utility for the web. Below are a series of customized range sliders using CSS3 or jQuery. Everything is free and open source to use in any project work either commercial or personal. Rangeslider.js jQRangeSlider noUiSlider Ninja UI ion.rangeSl ...

Read more

How To Transform Your Problem-Solving And Creativity

Think of all the people you know who inspire you, whether family and friends or public figures. Who are the most interesting, engaging and stimulating to be around? The ones with the great ideas and energy for life? These people almost certainly always ask questions and have an insatiable thirst to learn new things. According 1 to Donald N. MacKinnon 2 , who is considered to be a world-leading researcher on ...

Read more

Design Principles: Visual Weight And Direction

Every element on a web page exerts a visual force that attracts the eye of the viewer. The greater the force, the more the eye is attracted. These forces also appear to act on other elements, imparting a visual direction to their potential movement and suggesting where you should look next. We refer to this force as visual weight 1 and to the perceived direction of visual forces as visual direction. Both ar ...

Read more

Skyline: Evolving CSS Architecture

Skyline helps you create a design system for your website. It encourages a well thought-out CSS architecture, and enables you to develop a reusable and maintainable codebase. The starter kit provides a solid CSS architecture that acts as a scaffolding to support your unique design system. It promotes object-oriented CSS, written in SCSS using BEM notation. Skyline is a minimal scaffolding, it does not impos ...

Read more

Design an Elegant “Gratitude Log” Landing Page With Photoshop

What You'll Be Creating In this tutorial I’ll guide you through the process of designing an elegant landing page for a fictional “gratitude log” service. We’ll start off totally from scratch, drafting the layout with Adobe Photoshop in no time. We’ll be using some basic and intermediate techniques to create this design with conversion in mind. Let’s get it started! Tutorial Assets In order to follow along y ...

Read more

© 2011 Powered By Wordpress, Goodnews Theme By Momizat Team

Wordpress SEO Plugin by SEOPressor
Scroll to top