Design Inspiration RSS Feed Design Inspiration Twitter
Advertise

Sponsors

Very Inspirational Blog

How to make a twitter style “auto load” paging system with jQuery

Paging is a method where you break a record set into multiple parts. Many of us with blogs and websites with multiple pages are used to the common “Prev Next Last” setup that allows us to navigate. If you want something a little more comprehensive, you might even break the records up and show some paging numbers as well like “Prev 4 5 6 7 8 Next Last”.

But that’s just not very cool is it? Twitter uses a system where you dont need to click next. The way that their content is delivered, the newest content is always at the top. Twitter might be a “micro blogging” system at heart, but this idea works with regular blog content as well. I have seen it in action on Tumblr and I have even implemented it on my own Opinion & Discussion website.

We will be using PHP and Jquery to create a similar system.

1: Lets start with setting up our initial data set.

We are just going to pull 25 records from MySql and drop them into a list.

<ul id="Results">
<?php
$getFirstList = mysql_query("SELECT * FROM tableName ORDER BY id DESC Limit 25");
 
while($listData = mysql_fetch_array($getFirstList)){
	echo "<li> Your Data goes Here! </li>";
	$lastId = $listData['id']; //just get keep the last ID of the set.
}
?>
</ul>

Above is a quick list and a simple way to grab the last ID of the result set, we are only getting 25 rows at a time right now so we dont need to be too complex.

2: The trigger.
We need a trigger to action the call for more results. I’m assuming that your 25 results will require the user to scroll to see them all, and with that in mind the trigger will be the final LI element in the list.
Before the closing UL tag, insert this:

<li id="more<?php echo $lastId; ?>" class="morebox">
	<span id="<?php echo $lastId; ?>" class="more"></span>
</li>

This list item will have the ID of the final result making it unique.

3: Ajax processing.
We need a page that will load our extra results. This is a simple PHP/MySql query based on the variables that we send it. Here is a simple example:

<?php
 
$lastId = $_POST['lastId']; 
 
$getMoreList = mysql_query("SELECT * FROM tableName WHERE id > '$listId' ORDER BY id DESC Limit 25");
 
while($listData = mysql_fetch_array($getMoreList)){
	echo "<li> Your Data goes Here! </li>";
	$lastId = $listData['id']; //again, just get keep the last ID of the set.
}
?>
<li id="more<?php echo $lastId; ?>" class="morebox">
	<span id="<?php echo $lastId; ?>" class="more"></span>
</li>

In this, we regenerate the trigger with a new ID.

4: jQuery to tie it all together.

There is only a few steps here so I wont break it down too much. This is what we are going to do:
1: Initiate the script when the document is ready (document.ready function)
2: We set the container variable to “window”, and begin the function by looking for a “scroll” action. jQuery makes this simple by using the .scroll() method.
3: Once we scroll, the ID of the trigger is set. If there is an ID then we can proceed.
4: We check the element’s position by using a custom function called belowFold(). This essentially checks to see if the trigger is NOT on the screen.
5: If it’s on the screen we continue by setting the trigger contents to show a loader.gif image. We then do a simple POST to the PHP document that will load our next set of results. The only data we need to post is the ID of the LAST list element in the first set.
6: If the post was successfull, we load the new LI elements into place and remove the previous used trigger.

Of cause if there is no ID, we set the trigger to be empty as there is no point loading nothing.

The extra belowFold() function.

$.belowFold = function(element,container) {
        if (container === undefined || container === window) {
            var pageFold = $(window).height() + $(window).scrollTop();
        } else {
            var pageFold = $(container).offset().top + $(container).height();
        }
        return pageFold <= $(element).offset().top;
    };

This is a simple funtion that just checks the height of the window against the position of the trigger.

Here is the complete jQuery function:

$(document).ready(function(){
 
	var container = window;
 
	$(container).scroll(function() { 
	var element = $(".morebox");  
	var ID = $('.more').attr("id");
		if(ID){		             
			if (!$.belowFold(element,container)) {
				$("#more"+ID).html('<img src="/images/loader.gif" />');
				$.post("/more.php", { lastmsg:  ID },
						   function(data){
							$("ul#Results").append(data);
							$("#more"+ID).remove();
						   });
				}
		}else{
			$(".morebox").html('');
		}
	});
 
$.belowFold = function(element,container) {
        if (container === undefined || container === window) {
            var pageFold = $(window).height() + $(window).scrollTop();
        } else {
            var pageFold = $(container).offset().top + $(container).height();
        }
        return pageFold <= $(element).offset().top;
    };
 
});

And thats it.


Amazing uses of JavaScript

The internet has become a much more colorful and moveable world since the advancement is JavaScript, CSS and other web languages. We are now able to breath new life into website design without using clunky 3rd party plugins. Although some of these effects can not be created for all Internet web browsers, if you know your market and you are confident that your website would still be functional with the effect removed, then why not add some new dimension to your design.

Lets take a look at some outstanding uses of JavaScript (and their other supporting languages).


Apple’s mobile me website is using a combination of canvas tag and thousands of lines of JS to acheive its outstanding interface effects.


Amazing. Simply amazing combination of JavaScript and CSS. You have to hand it to dragoninteractive, they really know how to turn heads with their experiments.


Seriously cool setup. Page scrolling, interactive everything and all with JavaScript.
Just navigating around this website is a great user experience. This to me breaks the ‘flat page’ feel that a website can have.


The cloud moving background that gives this website its dimension is using a JavaScript background positioning system. Scroll down to the footer and you will see the same thing with a nice city horizon. It give the website a great visual experince.


Not only is this website pretty, the page curl in the top right is a neat JavaScript effect.


Fuel’s website shows a great use of color transitions and movement. It’s simple design and clean navigation lets your eyes be filled with the smooth transitions, resulting is a very professional experience.


While the effects are not very “fancy”, they are elegant transitions and fades that all use JavaScript and CSS to deliver a very nice website that has class.


This portfolio website has simple actions, but with the help of JavaScript and CSS it is delivered with a solid app feel.


MonoFactor uses a nice scrolling system that shuffles both content and showcase images in two different areas.


And just for fun, to show the power of what can be done. Here is Wolfenstein 3D using javascript and the canvas tag.


15 Very Creative Business Card Designs

First impressions are everything, and when you are working in the creative industry your personal stationary should not only be high quality but also well planned and thought out. Take these business cards as an example. Each has taken the business that it represents and crafted a high quality, funtional and most importantly rememberable business card.

So after looking at these fine examples of creative business cards. How important is a business card to you?


The design evolution of Twitter

From SMS to Web and Twttr.com to Twitter.com, this little blue bird has changed the way we communicate possibly forever. But where did it all start and how did Twitter go from a brainstorming idea to a world leading social network with one of the most unique simplistic designs around? For the designers out there here is a small visual showcase of the evolution of Twitter and how it’s look has developed over time.

We can all benefit and learn from these examples. What this shows is that when you are developing a website it’s the idea that is important. When you craft your idea, be it a blog or a service, getting the function right is the most important step. Once you have the website working as you want it, refining the design becomes a task of updating the look the a more modern feel while accommodating for extra features.

It’s the golden rule of SEO, Content is king. And it when it comes to service websites content, being the functions, is king. Nail this and then refine your design.

So lets take a look at the design evolution of Twitter.

As with most projects, it all starts with a sketch and the idea is born.

Almost all early concepts are nice and basic to allow all the user functionality to be refined and mastered.

Initial designs take form using a color system and logo with main elements placed.

Another design revision sees the entry of the Twitter bird

Possibly the first design of what we all know Twitter to look like now.

And now we have the latest,  most “movable” front page of Twitter. It’s stylish. I’ts dynamic. And it shows what Twitter is all about.

While the Internal view of Twitter has also changed a bit, here is the major change in their layout structure and functionality


Halloween 2010 Inspiration

With Halloween on the way we thought it would be a good idea to showcase some great Halloween digital art.

So without delay, here is some great Halloween inspiration from deviant art.


15 Detailed Vector Cars and Motorbikes

One thing that every design can appreciate is great detailed vector artwork.
Here is a collection of vector cars and motorbikes for your visual pleasure.


9 Websites offering Quality Free WordPress Themes

When you are starting out designing for WordPress it can be daunting to understand just how those fantastically designed websites that you see are constructed. How do they get their custom designs to display particular data and just how did they manage to get their layout to look so good and yet so different from the default WordPress themes?, you ask.

One of the best ways to learn is through example. So here is a small list of websites that you can keep an eye on and get some great free WordPress themes.

These are free themes and we encourage you to download them and learn form their structure and then create your own themes with a better understanding of how they come together.

http://www.woothemes.com
Woo Themes are one of the best theme creation companies around. All their designs are solid and the code behind their themes are clean and professional. While Woo Themes sell great themes they also offer some free themes.

http://newwpthemes.com
NewWPThemes.com is a leading and trustworthy free WordPress themes provider. All themes listed are 100% unique, designed and developed by their staff, 100% free for personal or commercial use and licensed under creative commons license. All of their themes are updated, supported and always compatible with latest WordPress versions.

http://www.skinpress.com
Skinpress.com offer high quality free wordpress themes that support widgets, adsense and banner advertising slots. Their templates also have twitter support.
They also offer blogger, zen cart, website templates and flash intro files.

http://freebiesdock.com
FreebiesDock.com is a collection of completely free design resources. All the products you’ll see there are created exclusively for FreebiesDock and you won’t see them anywhere else.

http://wpcrunchy.com
Wpcrunchy is a place where you can find premium quality wordpress themes. All themes come packed with handy features to get your website up and running with minimal effort.

http://www.organicthemes.com
Organic Themes offer a variety of beautifully designed premium WordPress themes for businesses and blogs. Although Organic Themes are mainly a paid theme website, they do offer some free wordpress themes and they are great quality.

http://www.freethemelayouts.com
FreeThemeLayouts.com provides premium WordPress themes absolutely FREE! They have great designers and expert WordPress coders who work together to create outstanding themes.

http://themes.rock-kitty.net
themes.rock-kitty.net is a website where you can upload and share your wordpress theme creations. All their themes are free to download and use.

http://wordpressthemesbase.com
Wordpressthemebase.com have a collection of wordpress themes ranging from simple clean designs to the more advanced. Most of their layouts have a similar blog style theme.


How Attention to Detail will enhance your design skills

If you want to take your design skills to the next level then the first place you should start is with the look and feel. While raising your coding skills and getting into the latest trends of CSS3 and html5 will make you feel all warm and fuzzy in your skill-set, its the visual side of your work that will capture the eye of your next customer.

So what can you do? Crazy layouts? As much movement as you can fit in? Actually no. You need to work on your common elements in design and let the content speak to its audience. You need to apply attention to detail and raise the standard of your design skills.

I will run thought some common elements and how you can improve them.

1: Forms
Forms are one of the most common and important interaction with your audience you will have. This is a great place to start styling into your own custom manor. Everyone knows that text boxes and textareas are bland and buttons grey and ugly. You might already be styling your forms with some color and borders but why not add some custom backgrounds and make your forms come alive. The simplest way to do this is just applying a background to the element with CSS. Here are some examples.

*note, IE has a issue with text-indent so if you want to offset the button text try this method:
background-image: url(‘buttonBackground.png’);
line-height: 999px; /* Set the line height higher than your image height */ overflow: hidden; /* Hide the text */

2: Backgrounds
This is an area where you can really lift the look of your website. By designing a large background you can easily create an atmosphere for your website and give some visual depth to your work. Be sure to keep the file size as low as possible and you will enter a whole new style of design. Take a look at how a website can be transformed with large detailed backgrounds.

3: Menus
When it comes to navigation you don’t want to over complicate it, make sure that it is still usable by the average user. What you can do to spice up your navigation is use background images and stylish dropdown menus where they are needed. Here are some examples of great navigation design that is both clear to understand and visually pleasing.

4: Images
A simple way to add life to your content is to add images. But don’t settle for images with a single border, why not add an overlay to make the image more in line with the overall design of the website. These effects are generally a PNG image that is positioned on top of the image using CSS. Take a look at these great examples.

6: Video
When embedding video into your website it is often preferable to use YouTube as the host. This is for many reasons but the most important is you don’t want to put the drain of streaming media onto your client and leave them with a huge bill at the end of the day.

YouTube’s default embed code is far from pretty so what you want to do is use their API to make your own player.
Using the YouTube Player API you can make yourself a chromeless player. From there you can style your own player and adding the functions that you want. These can all be controlled via javaScript and Actionscript if you wish to control the movie with flash. By using this method you would be able to create player controls to any style.

5: Footers
We all know that a footer is a great place to store quick links and contact info. But if you build on the theme of your website and make the footer a feature in itself you then keep the user from feeling like they have hit the end of the page. Instead you open them up to another sub section of the website where they can navigate to other content. Take a look at these fine examples of footer design.

If you apply these practices and attention to detail then you will create far better website design that don’t interfere with the content that is being delivered. Instead you will create a rich user experience for your audience.


17 Websites that all web designers and developers should know

Every designer has their own set of websites and tools that they prefer. Having a toolkit can help you design and build your project faster and it also helps with the preparation of a design project by giving you a starting point for research. From fonts to backgrounds and code snippets to browser testing, here is an essential list of websites that all designers and developers should have in their list.

http://www.colourlovers.com

Colour Lovers is a community of people who share colours, pallettes and patterns.
This is a great website to get yourself some fresh ideas about what colors to use in your designs.

http://dribbble.com

Dribbble is a community of designers who like to share what they are currently working on.
Right now its invite only, so cross your fingers this opens up!

http://flikode.com

Flikode is a code snippet bookmarking website where you can find bits of code in any language. It also has a help and discussion section so you can have some community support.

http://my.lovelycharts.com

My Lovely Charts is a great online app that lets you well…create charts. I find it useful to make site-maps and other layout diagrams.

http://www.colorcombos.com

Color Combos is a simple website where you can view and test how colors look together. Simple to use and with a huge library of color combinations this is a great addition to your web toolkit.

http://new.myfonts.com/WhatTheFont

Ever wonder what font is being used in an image? Or have you been supplied with a logo to recreate but no fonts? What The Font is your saviour. Just upload your image and it will try and detect what font is used.

http://www.favicon.cc

A simple way to create a favicon. Just upload your image and it will generate an ico file for you.
Or you can try your hand at using their editor.

http://www.stripegenerator.com

Stripe generator is a simple way to create tile background stripes of any style for your website. This is a real time saver! They also have a library of user generated stripes.

http://ajaxload.info

If you are ever needing a loading GIFfor you ajax application then look no further. Ajax Load has a good library of loaders in different shapes. You can also set the color that you need the loader to be in. Fast and handy!

http://www.bgpatterns.com

BG Patterns is exactly as the name suggests. It has a library of patters that can be used for background images.

http://browsershots.org

Browser Shots is a great tool to test your website in a lot of browser conditions. Simple to use and with great results, just select the browsers you want to test against and enter you domain name. The results usually take about 30 minutes to display.

http://sxc.hu

SXC is a community driven image stock exchange. Most of these images are free to use and are high resolution.

http://lipsum.com

When you are pitching to a client it’s handy to have dummy content. A good standard is to use lipsum text. At lipsum.com you can quickly generate as many paragraphs of text to suite your project.

http://validator.w3.org

If you want your website to be 100% web standard, then run it through the W3C validator. You can also find CSS and RSS validators on their website. It gives detailed responses to errors in your markup.

http://tools.pingdom.com

Pingdom offers a page load timer and breakdown of the files that are called from your website as it loads. At its simplest form, it gives some great insight into how your page loads and where you might have a bottleneck file that is holding things up.

http://dafont.com

DaFont is the number 1 place to find fonts. With a great categorisation system and the ability to type in your own text to see the result, this is the perfect font website for designers.

http://www.mockflow.com

Mock Flow is one of the easiest online wire-framing services around. When you need to draft a layout quickly and that is visually pleasing to the eye, then don’t go past this website. It will be a great asset to your toolkit.


Using textures to enhance your design

A problem that I often see in design, and specifically website design, is the lack of life that is brought into the design. While we can all create a lot of very excellent effects using a variety of plug-ins and built in effects from Photoshop etc, you just cant match the quality of importing textures from the real world into your work.

You see its the imperfections found in fabrics, paints, wood and stone to name a few, that set off a design giving it a realistic atmosphere.

While it may be tempting to use a lot of elements to try and bring your website to life it can often end up overloaded, distracting and hard to use. Take a look at some of the websites in our design inspiration gallery and other css galleries around the Internet and you will see that most of the top design all use a variety of texture styles. The best you can see actually seem to lift the content off the page and create depth in their design.

So where do you use textures in your website design?
You want to keep it simple and stick to backgrounds, menu bars, footers and sidebars. If you want to use textures in your content area just be careful and make sure that your text is still 100% readable and not a strain to the eyes.

From the examples you can see below, the best way to use quality textures is to keep them simple and not distract your users from the content they are actually using your website for.

http://www.imagineplus.in

http://www.curiousromain.com

http://arandown.com

http://fortysevenmedia.com

http://www.przeznaczenie.eu

http://bestblogbox.com

http://www.motherearthbrewing.com

http://trentwalton.com

http://jameslaicreative.com

http://www.dnadarwin.org

http://jaredcampbell.com

http://www.healthyharvesthydro.com

You can find a good source of free textures at websites like http://www.sxc.hu and http://www.texturelovers.com


Wolverine Artwork

Seeing as thought Doctors figure out how to make titanium bones we thought we would pay tribute to the man who most probably spawned the idea. So here is a collection of very different Wolverine artworks.


Street Art from around the world

Street Art is one of the most creative forms of art. These artists have created masterpieces wherever they can, to voice their message or to just beautify the streets of their cities. Enjoy.


16 Amazing 3D Illustrations from the DAZ 3D Community

This collection of 3D art has been created using the tools from DAZ 3D.

Daz 3D is a leader in the 3D software industry, providing affordable, yet powerful 3D software including Bryce – a 3D environment and animation package, Carrara – a complete 3D modelling, animation and rendering package, DAZ Studio – a FREE 3D digital art creation tool, Hexagon – a ploygonal modelling software and Mimic – a lip-synching application.

With DAZ 3D you can easily enter the 3D industry and build you skills! Plus they have a great community of support and sharing.


10 Websites using cute avatars and mascots

Here at Very Inspirational we love mascots! That’s why we have our cute little RSS Monster (you can see him at the top of the page).

The use of an avatar or mascot on your website (or any product for that matter) can greatly increase customer loyalty just through the recognition value that they create. Not only that you can easily run themed competitions and create merchendise as extra revenu streams all based on that little charater that you hold dear to your business.

Not convinced? just have a look at reddit.com. Their little Reddit Alien  has taken a lot of the Internet world by storm over the years and they have quite a range of merchandise for this little guy. You can get Reddit shirts, usb drives, bobble heads, soap and not to mention the fans who go on and make soap, cookies and other random stuff!

A mascot can help build a personality to your business, so have a think about it next time your thinking of an addition to your business model.

Here are some website that we think have great little mascots that theme their websites.


Albert Lo – Freelance digital creative

One of the best ways to get inspiration and motivation is to look at our peers in the industries that we work in. If we get the chance to see what goes through the mind of the people we respect in our industry we can use this to further our own skills and refine our working practice.

At Very Inspirational we try to help our community out by running small interviews to give you some insight into how these great artists work.

We hope you enjoy this quick interview with Alber Lo, a fantastic UX web designer & visit his website.

Read the rest of this entry »


The Iconic Fail Whale

By now I think everyone knows the Fail Whale. While Twitter was gaining in popularity it had quite a reputation of outgrowing itself and just being out of service. The fail whale, created by Yiying Lu has become just an iconic page that there is even a fan club failwhale.com

The fail whale, as a design idea, has made it OK to occasionally fail in your website. No longer is a 404 a complete catastrophe. All you need to do is create yourself a nice, fun error page to let your members know its not the end of the world. Do it right and you might just end up with your own iconic 404 page when your website grows.

As a tribute to the fail whale, here is a collection of wacky, weird and unusual interpretations of the Fail Whale image.

Read the rest of this entry »


Amazing Origami Art!

Origami. That fun paper folding art that has been around longer than anyone can remember produces some of the most amazing and mind challenging art-forms. Just take a look at the following and you will surly feel the need to grab some paper and give it a go.

Visit Origami Instructions for some tips and instructions on origami.

Read the rest of this entry »


Amazing Insect Macro Photography

Macro photography sits in the category of taking very close-up photos that reveal an amazing amount of detail. A lot of the detail is not visible to the naked eye, and when it comes to bugs and insects this is due to the size and also speed. We simply don’t get to see the detail.

This post is about taking the time to look at the beauty of the little creatures that live amoungst us.

Read the rest of this entry »


Awesome High Detail Portrait Digital Illustration

Here is a collection of some very VERY good digital art and illustration.

Read the rest of this entry »


Make your website ‘pop’ with great typography

OK, so the word ‘pop’ is like a needle in the eye for any designer who’s client gives feedback like “it just needs to POP more”, but hey, I think you all know what I mean here.  Typography in design can be the key difference between an average design and a masterpiece of usability.
Below are some ways that you can spice up your website designs and raise the quality of your portfolio. Your clients will love you for it.

Using Custom Fonts
Thanks to CSS we can safely use custom fonts on websites now. Just keep in mind that not all browsers support the use of otf,ttf or eot files. But don’t let this stop you, just make sure that you have a backup default font that still fits with your design. If you cover all bases then you wont have users suffer a horrible website if they are stuck on old browsers.
These are simple to create and implement using a conversion tool like ttf2eot and then use the @font-face to embed the file reference into your style sheet.

The user doesn’t need the font on their system, so don’t forget to upload it to your server.

Read the rest of this entry »


Video Game Website Design Examples

Most of the web designers and developers that I know are also avid gamers. With video games becoming more advanced, larger worlds and greater detail, you can take some great inspiration form a few different places from video games.

The following is a great collection of video game website designs that not only match their theme and market, but also showcase some excellent interactive qualities that most of us don’t get to use in a website.

Read the rest of this entry »


Getting design inspiration when you’re stuck in an office.

Get out of the office for some “research”.

As designers we take inspiration from everywhere and anywhere. Working in an office all day I find that the design life can get sucked right out of me and coming up with creative and fresh ideas is hard with the buzz of a workplace + phones + radio (playing crappy music).

So what do you do? Step one is to envy any full time freelancers who get to design where the want.
This is by far the most flexible way to get the creative juices flowing. Try and take a note out of their book, and if your able to, take your sketch book and wander out of the office. This is a great start that will just let your mind wander in a different direction that it would at your desk.

Read the rest of this entry »


21 Horror Movie Posters for Design Inspiration

Everything old is new again. That’s the saying anyway.

Old movies have played their part in inspiration for years with bands like the Misfits and Rob Zombie breathing life into the artistic style of Horror movies in particular.

The movie posters of yesteryear are not only outrageously designed but they are bold in colour and show great detail in their own quirky way. These posters are very simple and actually lend themselves very well to website design. Just in using similar fonts and creating a web layout with the same theme as some of these posters you get a very unique looking design that is sure to make for an impressive portfolio.

Here they are

Read the rest of this entry »


Designing a creative and useful sidebar

A website is usually made up of standard components. One often overlooked component of a website is the sidebar. When I’m building a website I put a strong emphasis on the layout of the sidebar. The hardest part for me is having the client understand that the sidebar is an important feature of the website rather then just a collection of “stuff” that has nowhere else to go.

The conversation would usually go like this:

Client: “Sidebar? um… Lets do that last, just put anything in. Shouldn’t we just focus on the content pages?”
Me: “Well sure, the page content is the focus and the SEO optimized part of the website. But how often you go to a website and glance over at the sidebar to see how many RSS subscribers the website has? Do you try and look for how many twitter followers the website has? Or Facebook fans? Don’t get me wrong, none of these stats actually make for a good website BUT they do indicate just how many other people might like the content”.
Client : “OK I admit, I do that”.
Me: “Do you also scan the sidebar to see what else the website has to offer, besides the page you are on?”.
Client: “Yes I do that too. OK I see your point and lets get some focus into my sidebar now”.

Read the rest of this entry »


22 Graphically Outstanding Website Designs

As a web designer, you want your website design to leave an impression that gets people scrolling to the footer to see just who built this amazing website! After all, the best sales tool is word of mouth and the best person to sell you skills is your work that’s “in the wild”.

To get that finished level that sets your web design skills apart from the pack, take some tips from these 22 website designs that are graphically outstanding.

Be sure not to over use heavy images. Slice like a ninja and optimise so that you still get a fast load time.

So take a look at the designs below and take what you can and push you own ideas into the next level.

duirwaigh.com

Read the rest of this entry »


The excellent blog design of Splendid Sparrow


I give credit to my wife who actually came across the works of Teresa a few months ago while wandering the Internet looking for blog design inspiration.

There are a lot of blog designers out there, but what I love about Teresa’s work is that its consistent and she designs with a particular style. It’s fresh, creative and is designed with the client/end project in mind.

All the designs feel as if they have had great thought and research put into it in order to give the design a perfect fit for the content that will be going on the target website.

Not all of us take the time to research fully after an initial web design brief and I think this is what sets a good web designer apart from a great web designer. Taking the time to research the industry and matching it to the relevant content that the website will house puts the icing on the cake.

Take a look at the examples below and visit splendidsparrow.com for more of Teresa’s blog design. You can FEEL the love that has been put into these design!

Read the rest of this entry »


Cartoon Inspired Website Design

Most of us only get to design websites for the corporate world. This usually means clean cut designs with solid navigation and a flow of predictable information and product data. I know all of us would like to let loose and do some creative design and for the cartoon lovers out there here is some inspiration for when the time comes!

These are a pick of what I think are great examples of cartoon inspired artistic websites that function great!

Read the rest of this entry »