Layouts - Page 10

Advice for crafting layouts and structure that can create a clear, original web design. Break the mould, and build a unique layout!

How to Create a Facebook Timeline Cover Photo: Examples and Best Practices

Layouts / 2 Feb 2012

How to Create a Facebook Timeline Cover Photo: Examples and Best Practices

Facebook announced Jan. 24 that it will be moving all users to the timeline format in the next few weeks. Although the change will be mandatory soon, you can make it early as some users have been doing since it was launched in September. Timeline is the new Facebook “wall” and highlights your personal information based on when it happened.

The biggest visual change included in Facebook timeline is creation of a cover photo. When someone lands on your page they not only see a small square profile image but also a large photo that you have selected for the top of your page. The shape can a little intimidating and includes a hole where the profile image rests. But you can crop or create your own timeline cover photo in just a few minutes. Follow along as we take a look at some great examples and advice for creating the perfect cover photo.

Is It Time for Your Business Cards to Go Digital?

Business Card Templates / 10 Jan 2012

Is It Time for Your Business Cards to Go Digital?

Are traditional paper business cards becoming obsolete? Have you considered a digital option? The type of card you use and how it looks can say a lot about you and your work. The style of card – from simple embossed text on a white card to ornate colors and fonts – can be a client’s first impression of your work.

You want to use a card that represents your style and works with the kind of clients you work with. When looking for a business card, consider both digital and paper options and integrate your digital self into paper cards. A business card does more than provide your contact information, it is a gateway to your portfolio as well.

Utilizing Grids in Print Design

Layouts / 27 Dec 2011

Utilizing Grids in Print Design

The basic organization of a design project typically begins with a simple concept – the grid. Whether you decide to work within its constraints or intentionally move away from it, deciding how to use a grid tends to be one of the first steps in the design process.

Print designers have been working on grids since the first newspapers rolled off the presses hundreds of years ago. Most magazines also employ a grid; books are put together using the grid format. The grid can be part of a publication’s identity and helps create a sense of space and organization. Understanding the basics of grid design – from how it originated, to developing your own grid and using it in your workflow processes – will make working within vertical and horizontal constraints a snap.

Tips and Ideas for Designing With Blurred Images

Layouts / 15 Dec 2011

Tips and Ideas for Designing With Blurred Images

“The supreme accomplishment is to blur the line between work and play.”
– Arnold Toynbee

The topic of today’s discussion is blurry photos. No, not the kind that you accidentally take because your kids won’t sit still. The intentional kind, the use of which can serve several practical purposes in design.

We’ll learn all about how to use blur effects to help make text more legible, direct the viewer’s attention, and just make backgrounds more fun. We’ll also take a look at some different types of blurs and how to properly apply selective blurring.

Designing Engaging Header Images: Think Outside the Box

Layouts / 12 Dec 2011

Designing Engaging Header Images: Think Outside the Box

One of the first things you do in designing a site is to decide what that first chunk of pixels that users will see looks like. You’ve got to grab their attention and communicate your message above the fold or risk that person moving on to their next open tab.

Unfortunately, many of us fall into predictable patterns for this piece of the site. We use the same old tricks, shapes and plugins and come up with a result that might look great, but isn’t really that exciting. Today we’ll take a brief look at how you can make your header images more interesting. Along the way we’ll see some live examples from sites that have implemented these techniques successfully.

Popular Web Design Trends in 2011: Over 50 Inspiring Examples

Layouts / 8 Dec 2011

Popular Web Design Trends in 2011: Over 50 Inspiring Examples

December is here and it seems we’re finally wrapping up 2011. It’s been a year filled with new and exciting forefronts for the web. CSS3, HTML5 and responsive design were at the top of the most-discussed topics. We also mark the passing of the old ways. Flash, Silverlight and similar proprietary plugins received an all out assault in 2011, one that they may never recover from.

To end the year with an informative retrospective, we’ve scoured the web in search of patterns and trends that emerged or became increasingly popular throughout 2011. Follow along as we examine over fifty websites in an attempt to spot similar tricks and themes. I guarantee it’ll be difficult to read without spotting a few trends that you jumped on in your own projects this year!

The Evolution of Apple.com

Layouts / 1 Dec 2011

The Evolution of Apple.com

The Apple design team is widely regarded as one of the most talented group of designers in the industry today. The trends that they set are followed by not only every other major tech company, but by web designers in every conceivable product and service niche.

Follow along as we embark on an exciting journey through time and witness the evolution of Apple’s design style. You’ll get several amazing glimpses at Apple.com dating all the way back to 1997 as we witness the rise and fall of several important design trends.

Black Friday Web Design: The Good, Bad and Ugly

Layouts / 28 Nov 2011

Black Friday Web Design: The Good, Bad and Ugly

Last week our U.S. readers celebrated Thanksgiving and its subsequent shopping madness known as Black Friday, where retailers dramatically reduce their prices for a day of pure shopper mayhem.

Instead of joining the stampede of frantic shoppers, I followed my annual tradition of hiding away in my home office. However, I couldn’t resist a look around to see how various stores were handling the design side of the event. Let’s see which top name retailers pulled out all the stops and which ran with cliché, generic and even ugly designs.

How to Design a Tour Page: Examples and Best Practices

Layouts / 8 Nov 2011

How to Design a Tour Page: Examples and Best Practices

Tour pages are one of the most important components for websites advertising apps and/or services. The tour page is often where interested users will either make the firm decision to sign up or move on to something else.

Needless to say, there’s a lot of pressure as a designer to get this right! Fear not however, many talented designers have gone before you and we can learn a lot by looking at their examples. We’ll dive into tour pages from giants like Mozilla, 37Signals and Mint.com and see what common tricks they all use to win conversions.

Design History: The Art of Playing Cards

Layouts / 7 Nov 2011

Design History: The Art of Playing Cards

Great design inspiration is all around us. Sometimes the best examples are so common that we see them all the time without a second thought. The cars we drive, the advertisements in our mailbox, the cover art on that new album you just downloaded, all of these are teaching their own little design lessons and if we would but listen, we just might learn something.

Today’s subject is playing cards. At least one pack can be found in almost every home in America, which means they’re a perfect example of ubiquitous design that we take for granted. We’ll take a fresh look at why they’re so perfectly designed and learn a little history along the way.

Practical Design Considerations for Responsive Sites

Layouts / 31 Oct 2011

Practical Design Considerations for Responsive Sites

Responsive design is our current best solution to the phenomenon of the ubiquitous web. The Internet is being accessed by people everywhere on countless incredibly varying devices and responsive pages provide an easy and functional way to account for these differences.

Today we’re going to take a step back from discussions of media queries and technical jargon and focus on the core aspects of how responsive techniques affect your design process. What major points do you need to keep in mind when approaching a responsive web design project? Read on to find out.

Design Study Into Mac OS X App Websites

Layouts / 26 Oct 2011

Design Study Into Mac OS X App Websites

Apple has always demanded the highest calibre of work from its employees even since its founding in the late 1970s. Many designers have just recently moved into the OS X environment, and most fall in love at first sight. Mac OS X Lion offers so many features that you just can’t find elsewhere – most notably of which may be the App Store.

From here you gain access to a slew of applications both free and paid. These are all built for OS X Lion and can be downloaded directly into Launchpad. In this case study I’ll be looking into design trends for Mac app websites. These are specifically geared towards OS X and do not include iOS apps… the styles are very different. Along with these tips I have also compiled a small showcase gallery of my favourite Mac app sites to share a bit of inspiration.