Articles - Page 157

Browse hundreds of articles, tips, and inspiring design collections. Find helpful design advice, or the perfect resource for your next project.

The Simple Guide to Creative Commons Resources

Business / 10 Mar 2014

The Simple Guide to Creative Commons Resources

Creative Commons is a tool that allows designers, writers, videographers and web developers to use content free of charge. From text to photos to video to sound, there are a variety of different types of available content that can be used when attributed appropriately.

But where can you find this content? Who can use it? And what really is acceptable to use? Today, we have a guide to creative commons works, proper use and attribution and tolls for helping you find great (and usable) content. (As an added bonus, all of the visuals used in this article were available under a Creative Commons license.)

Tips for Designing Better Mobile Typography

Mobile / 5 Mar 2014

Tips for Designing Better Mobile Typography

Mobile is big right now. But often the typography is small. When it comes to creating great type on small screens, there are plenty of challenges.

So how can you make the most of responsiveness, mobile design and typography? The first step is really understanding type and the second is by thinking about how people read. Put the two together and you will get a handle on creating great mobile type in no time. It’s a skill that every designer needs to master in the digital age.

Creating Visual Hierarchy With Typography

Typography / 3 Mar 2014

Creating Visual Hierarchy With Typography

Visual hierarchy is an important element in any design project. It tells people where to look and what things on the screen or printed page are most important. Hierarchy gives readers a sense of how to actually read material from start to finish with visual cues and flow.

While you can create visual hierarchy using a number of different tools, today we are going to look at ways to create structure with just typography. (And take a look at the images used throughout this post; they are all examples of great type hierarchy in action.)

What Makes a Great Search Interface?

Inspiration / 26 Feb 2014

What Makes a Great Search Interface?

A search box is one of the essential pieces that is included in almost every website design. While sometimes the creation of this small element turns into an afterthought, there is no reason why the search box should not be designed as beautifully as the rest of a website.

The design of a search box should mirror that of the rest of the site, be functional and easy to use and be placed in a location that is obvious to users. Today, we are going to take a look at some great search boxes and a few tools to help you through your own design.

Creating Instagram-Style Photo Filters With jQuery

JavaScript / 25 Feb 2014

Creating Instagram-Style Photo Filters With jQuery

I’ve always been intrigued by the Instagram phenomenon and how quickly it rose to popularity. Photo filters are nothing new but dynamic use of these filters has not always been possible. Building the functionality into an iOS/Android application requires a lot of time. Thankfully developers have worked to replicate this process for the web using JavaScript.

In this tutorial I want to demonstrate how to build a simple Instagram-style filter webapp using jQuery. The library is called CamanJS which is easily extendable to create your own filter plugins. This doesn’t require jQuery but I’ve chosen to use it for a simpler development environment. Take a look at my live sample demo to understand the goal of this tutorial.

5 Online Portfolio Services & Tools Compared

Software / 24 Feb 2014

5 Online Portfolio Services & Tools Compared

Whether you are designing for print, packaging or online, almost everyone wants a portfolio site that is easy to manage and maintain while providing a good visual experience. With so many different portfolio tools and services out there, though, how do you choose what works best?

Today, we are taking a look at five nice online portfolio tools. We’ll weigh the pros and cons and pricing for each in hopes that it will help you choose the right tool to display your work.

Making Vintage Design Work for You

Inspiration / 19 Feb 2014

Making Vintage Design Work for You

Vintage textures and palettes are in. They are popping up in a variety of uses from large-scale design projects to small details in a logo or background texture. This dated-style technique has really made a comeback.

Today, we will look at how you can create and establish a great palette for a vintage-style design from color to type to texture choices.

Building HTML5 and CSS3 Anchor Link Tooltips

CSS / 12 Feb 2014

Building HTML5 and CSS3 Anchor Link Tooltips

There are many tutorials online discussing the idea of CSS-based tooltips. Yet many examples require HTML elements along with the anchor link. Visitors can get a basic tooltip message by using the default title attribute. I’d like to follow this method and update the process just a little bit.

In this tutorial I want to demonstrate how to build CSS3 tooltips which are contextually based on an HTML5 attribute. Using different classes we can incorporate unique color schemes along with CSS3 transition effects. This technique doesn’t require any extra HTML unless you attach the tooltips onto a different element (like a text field). Let’s get started!

Why I Love Ampersands & You Should Too

Typography / 10 Feb 2014

Why I Love Ampersands & You Should Too

Without a doubt, the most beautiful character in the English language is the ampersand. The single character comes in so many fashions – from the simple & to the casual E- to t-style representations.

But where did this character come from? What does it mean? And most importantly how can you take advantage of using it in your design projects? Here we will take a look at my favorite character from its history to uses and a gallery of great ampersands to inspire you.

30+ Free & Premium Ghost Themes & Templates

Inspiration / 6 Feb 2014

30+ Free & Premium Ghost Themes & Templates

The Ghost platform is growing quickly, and shaping up to be a fantastic blogging platform for designers and developers alike. It’s built on a powerful framework, and we’re starting to see a wonderful array of Ghost themes and templates cropping up from dozens of designers.

Today we’ve rounded up a collection of over 30 of our favourite Ghost themes, designs, and templates for you to browse through. Some of these are free, and some are commercial (but all under $25, which is something of a steal!). We hope you find something that fits what you’re looking for!

Coding a Responsive Mini vCard Webpage

CSS / 5 Feb 2014

Coding a Responsive Mini vCard Webpage

The use of online portfolios has become a popular choice by many digital artists. The goal would be showcasing yourself and your skills to anyone curious, maybe hiring companies or potential clients. Another simpler way to accomplish this task is to create your own digital vCard page. It’s usually a single page containing a brief resume, your work experience, and some interesting tidbits about yourself.

In this tutorial I want to demonstrate how to build a simple tabbed webpage layout in the style of a simplistic portfolio. We can incorporate jQuery fade effects to switch between the tabs, sticking to a formal responsive design. Take a peek at my live sample demo to see what the final product looks like.

Understanding Design Copyrights and Trademarks

Business / 27 Jan 2014

Understanding Design Copyrights and Trademarks

Not that long ago we entertained a discussion about design plagiarism here on Design Shack, but what does it mean if your work is stolen? How do you even know if your work is protected? And moreover, what can you do about it?

That’s where the protection of copyrights and trademarks come in. But what are they? And how do they apply to your designed work? Let’s take a look.