Design Woop | The Web Design and Development Blog » Web Design

15 Light & Subtle Background Patterns

David — Mon, 21 May 2012 07:00:00 +0000

On a recent design I was working on I wanted to use an extremely subtle and light texture on the background to create a little more depth and dimension to the background, rather then simply just using a solid background color. I tested out many different background textures and patterns so I thought I would share with you some of my favorite light background patterns you can download and use.

Light Mesh

First Aid Kit

French Stucco

Rough diagonal

White Wave

Light Sketch

Farmer

11 Light Subtle Patterns

35 Tiny Pixel Patterns

Minimal Patterns 1

Text2Res3

Minimal Patterns 2

Paper

Church

Cross Scratches

Enhancing Your Typography With CSS3

Tomas Laurinavicius — Thu, 19 Apr 2012 07:00:00 +0000

Information has been vital component of the Internet for ages and that is the reason why people started to design websites – to access all available and needed information easily. Most of the information on the Web is text or typography and it plays very important role in website design too. Appropriate use of typography can improve overall design look so you definitely should pay some attention to this aspect of design.

Today I would like to present you some nice CSS3 techniques for improving your web typography. Unfortunately these experiments won’t work on all browsers because of weak CSS3 support but it is always interesting and fun to give a try on upcoming stuff.

Here are 15 unusual and beautiful CSS3 typography effect examples and explanations how to do them.

Arctext.js – Curving Text with CSS3 and jQuery

3D Text Tower

Using CSS Text-Shadow to Create Cool Text Effects

Subtle CSS3 Typography that you’d Swear was Made in Photoshop

I love blur

3D Text

How to Create a Cool Anaglyphic Text Effect with CSS

Create a Letterpress Effect with CSS Text-Shadow

Create Beautiful CSS3 Typography

CSS3 Background-Clip & @Font-Face

CSS3D

Fun With CSS Text-Shadow

Adding Stroke to Web Text

Quick Tip: Pure CSS Text Gradients

Create Attractive Web Typography with CSS3 and Lettering.js

Inspiration: A Collection Of Retro Web Designs

David — Thu, 05 Apr 2012 07:00:00 +0000

Today’s post is a fantastic collection of inspiring retro web designs, I particularly enjoy the vintage/retro style of design in whatever form it takes, from posters and adverts to web designs. The vintage typographic elements and the attention to detail given to these really stand out to me, the subtle use of background textures in these web designs also appeals to me and I am already thinking how I can incorporate them in in some future projects!

The Soup Peddler

Blind Barber

Wells Riley

Cast Iron Design Company

More Then Twenty

Retro

Braun

Captin Dash

Goliath Sportswear

Tommy

Urbanoff

Neutral Milk Hotel

Rivers & Robots

Tom, Dick & Harry

La Bubbly

Forefathers Group

Bitfoundry

El Passion

Quality Laundry Pros

Beautiful Type

Unusual & Unique Examples Of Website Navigation

Tomas Laurinavicius — Thu, 22 Mar 2012 08:00:00 +0000

Website navigation is one of the most important web usability aspects so you should take this into consideration creating clear and intuitive website navigation design. People coming to your website usually have some web experience and they expect to find simple navigation which should be clean and straightforward for user to find things he wants fast. Otherwise your visitor will get stuck and will leave your website unhappy and with bad experience of your website and possibly brand.

In this post I would like to introduce you unusual and unique examples of website navigation. Although it is really hard to use unusual navigation and achieve its main goal you definitely should give a try with your personal project, blog or portfolio in order to stand out from the crowd and give your visitors the possibility to experience the new level of navigation.

In this post you will see some original and unique navigation design ideas implemented into real websites. Creative and beautiful but is it worth that? Leave your thoughts in comments section below the post.

Unfold

HEARTSHAPEDWORK

CaptainDash

Manic Design

75B

Small Stone

Narrow Design

Yuna Kim

Racket

Organic Grid

Eric Johansson

Stephen Vernon Clarke

Jim Denevan

Corporate Risk Watch

SectionSeven Inc.

Anet Design

We believe in…

Adriano Goncalves

Victoria and Albert Museum

San Antonio Web Design

Permanent

GLEIS3

Yodabaz

Hello Goodlooking

Jeremy Levine

30 Super Minimal Designer Portfolios

David — Mon, 19 Mar 2012 08:00:00 +0000

Web design with a clear and clean architecture with a focus on content is much more intuitive for the end user. Removing the nonessential elements and simply focusing on what is needed not only improves the user experience but also benefits your site in other ways such as improving load times and improving user engagement. Take a look at these 30 minimal web designs that I have collected to showcase these points.

Eleven Made

Damian Simpkins

Futurefabric

Sean Lipidis

Altered Landscape

Simon Foster

Lundgrun + Linqvist

Effektive Design

Yes Studio

Superiest

Anagrama

Temple

Christian Mezofi

Manual

Deaf Pigeon

Swissted

Still Blog

Face Works

Kern And Burn

Made By Wheat

Zola’s

Blind Barber

Salt Surf

Andy Mangold

Planet Propaganda

Unit Portables

Dave Gamache

Becking

Jitto

imjustcreative

25 Awesome Mac Apps For Designers

Tomas Laurinavicius — Thu, 15 Mar 2012 08:00:00 +0000

Apple products with Mac OS X operating system are quite popular among designers and digital artists. So today I have collected 25 awesome apps for designing purposes. Mostly of them are for processing images and editing pictures but you will also find tools for productivity, time management, screen recording, reading, planning as well as coding apps in case you are a web designer. Some of these apps are available for free but most of them will cost you money, but hey it is not so bad to pay few dollars for high quality product and achieve amazing results after.

What do you think about these apps? Which is your favorite one? Share your opinion in comments section below.

Screeny

Screeny makes screen capturing easy and gives you the freedom to capture your videos or images at any size. You can click & drag to resize the capture area or input the exact pixel dimensions to set to the size of the capture area. All the while you will get instant feedback on the capture area’s current pixel dimensions.

Pixelmator

Beautifully designed, easy-to-use, fast and powerful image editing app for Mac OS X

Gradient

Pick the perfect color from your mockups with Gradient’s custom picker or use the standard color window to choose it.

LESS.app

{Less} extends CSS with variables, nested rules, operators and more. If you’re still building websites without it, you’re an idiot. This app makes it dead simple to use {Less} by automatically compiling *.less files into standard CSS.

Strata Design 3D SE

Strata Design 3D SE provides a subset of the tools from our professional level CXi product to create an app capable of accomplishing the most common 3D design tasks quickly and easily.

Reeder

Reeder is a Google Reader client, which means you need a Google Reader account to use the app. Don’t have one? No problem, you can get one here:

Wunderlist

Download Wunderlist, our free cloud-sync task manager, and share your lists with friends and colleagues.

MindNode

MindNode’s focus and flexibility makes it the perfect brainstorming tool. The clutter-free interface lets you concentrate on generating and connecting your ideas, and an infinitely expanding canvas means that no matter how big or complicated your thoughts get, MindNode can keep up.

Sequel Pro

Sequel Pro is a fast, easy-to-use Mac database management application for working with MySQL databases.

Things

Things is a beautifully focused and amazingly intuitive task manager. Other todo applications either oversimplify or are too difficult to use. Things instead offers the perfect balance between ease of use and powerful features.

GuideLiner

With GuideLiner you can measure your web and screen layouts, check and optimize them for smaller screens and work with guidelines in all applications.

Art Directors Toolkit

Art Directors Toolkit (ADT) is the “Designer’s On-screen Toolset” for Artists and Designers working with digital media.

Prototypes

Prototypes is the best way to share and test your iPhone App mockups. Turn your still mockup images from Photoshop, Illustrator, Fireworks (anything!) into a tappable prototype that runs on iPhone and iPod Touch.

Patterno

Patterno is a tiled pattern and background image generator for Mac OS X. It allows to create various images that you may use to design your site, Twitter, MySpace or just to create a new wallpaper for your desktop.

LittleSnapper

LittleSnapper is built to be the designer’s digital scrapbook, allowing creatives to snap, organise, edit and share screenshots and webpages that interest them.

Coda

So, we code web sites by hand. And one day, it hit us: our web workflow was wonky. We’d have our text editor open, with Transmit open to save files to the server. We’d be previewing in Safari, adjusting SQL in a Terminal, using a CSS editor and reading references on the web. “This could be easier,” we declared. “And much cooler.”

Fontcase

Keep your fonts together with Fontcase, a font manager with an elegant and powerful workflow to help you perfectly organise and preview your fonts.

Espresso

You design and develop for the Web? Espresso turbo-charges your workflow with the perfect blend of features. Speed through day-to-day edits with extensive language support, contextual completions, powerful smart snippets, and Zen actions.

Pomodoro

Pomodoro is an antiprocrastination application that helps in Getting Things Done. It is a simple but effective way to manage your time and to boost your productivity to higher levels. Can be used for programming, studying, writing, cooking or simply concentrating on something important.

Griddle

Griddle is the fast and handy pixel grid generator – perfect for your graphics applications and projects. Step aside, overlay grids – now you can bend, warp and integrate grids directly into your work! And say goodbye to the pain of measuring the effects of filters, such as Photoshop®’s Liquify, where overlay grids aren’t even available.

ColorSchemer Studio

ColorSchemer Studio makes it fun, fast and easy to find the perfect palette for your next creative project. Whether you’re designing a web site, magazine layout, picking wedding colors, or painting your living room, get your colors right the first time with ColorSchemer Studio.

Analog

Analog makes it easy to improve your photos with a stunning selection of filters and borders.

Billings

Your invoices should reflect your professionalism. Billings combines powerful features with stylish designs so you can send elegant invoices right out of the box. Choose from any of the customizable templates, or create your own with the built-in WYSIWYG designer. Either way you’ll send polished professional invoices in seconds.

Glyphs

Glyphs’ smart and simple approach helps you draw new fonts, modify existing fonts, and sculpt your letterforms hassle-free.

iArt Pro

Love using paint on your PC? Wish that something similar or better was available for Mac? Wish no more, iArt Pro is here at an unbelievable price!