May 26

A picture tells a better story than your site

onkalo

A common theme that has been discussed on this site over the past couple of weeks is how design can tell a story and yet so often websites don’t do a good job of conveying that. I try to do a decent job of showcasing designs here that are more than a pretty design, but it is still hard to tell a great story when you have other stakeholders involved. Continue reading

May 26

The Difference Between Web Reporting And Web Analysis

Someone asked me this very simple question today. What’s the difference between web reporting and web analysis?

My instinct was to use the wry observation uttered by US Supreme Court Justice Potter Stewart in trying to define
po rn: “I know it when I see it.

That applies to what is analysis. I know it when I see it. : )

That, of course, would have been an unhelpful answer.

So here I what I actually said:

If you see a data puke then you know you are looking at the result of web reporting, even if it is called a dashboard.

If you see words in English outlining actions that need to be taken, and below the fold you see relevant supporting data, then you are looking at the result of web data analysis.

Would you agree? Got an alternative, please submit via comments.

I always find pictures help me learn, so here are some helpful pictures for you. . .

This is web reporting:google analytics report Continue reading

May 20

55 Inspiring and Clever Online Portfolios

If you’re a designer/creative, you probably already know that having an online portfolio is very important. Not only do you need to have something to show your potential clients, but these days it’s important to be present online for many reasons. If you leave the address of your portfolio when you’re communicating in social media, through blog comments, contests and so on, you’ll see that you can even get work from that alone.

Inspiring and Clever Portfolios

A portfolio can make or break you. It’s important to show your best work, your variety and stand out. In this showcase we’ve put together a collection of 55 portfolios we’ve found online that we think stand out as clever, creative and inspiring. We hope these can inspire you when you’re making your own portfolio, when creating web designs and in other projects. We find these pleasant to look at and invite the visitors to want to learn more about the people behind them.

Marie Bocquet
Marie Bocquet Continue reading

May 20

Web Analytics 101: Definitions: Goals, Metrics, KPIs, Dimensions, Targets

clusterIt is surprising how often these “simple” things come up.

“What is the difference between a metric and a key performance indicator (KPI)?”

“What is a dimension in analytics?”

“What is segmentation?”

“Are goals metrics?”

And many more.

There seems to be genuine confusion about the simplest, most foundational, parts of web metrics / analytics. So in this short post let’s try and see if we can fix this really basic problem.

Definitions and standard perspectives on these terms will be covered in this post:

  1. Business Objectives
  2. Goals
  3. Metrics
  4. Key Performance Indicators
  5. Targets
  6. Dimensions
  7. Segments Continue reading
May 20

Optimizing Emotional Engagement In Web Design Through Metrics

Think about what keeps you coming back to your favorite store, your favorite person or even your favorite website. It’s not just a mindless buy-go, hug-go or click-go relationship. It is a complicated, emotional connection. It is what makes relationships with people and brands intoxicating. User engagement must have an equally complex emotional connection. It must affect the user in mind, body and spirit. Anything less is a 1990s brochure website.

You can create strong storytelling strategies based on user personalities and segmentation. However, it seems almost impossible to measure those efforts, let alone know how to optimize them, without access to a neuroscience laboratory. In fact, emotional engagement can be optimized, and quite effectively, using something already at your disposal: performance metrics.

Emotional-Behavioral Response Relationship

Let’s start with the basics: an emotion is a psychophysiological response in your body to a stimulus. It’s an internal process that in turn triggers an external behavioral response. Behavioral responses help you decipher the emotional responses of others. Things like facial expressions and body language give you clues to whether the chef wielding the knife is angry and going to attack you or happy and going to make you dinner.

Stimuluschart in Optimizing Emotional Engagement In Web Design Through Metrics Continue reading

May 13

50 Free and Exclusive Twitter Icons

Today we bring you a set of 50 free and exclusive Twitter icons that you can use for your websites.

The icons are provided in both raster and vector formats: The transparent PNG versions are 256×256, and we have also included Illustrator files so that you can resize the icons as needed.

The icons are completely free for personal and commercial use and they’re being released exclusively to all our readers.

If you’d like to share these icons, please refer your friends to this page so that they can download their copy from here.

Below you’ll find a full preview of all icons included in this set. The download link appears at the bottom. Enjoy! Continue reading

May 13

99 Sites All Designers Must Know About

Below is a list of 99+ graphic design resources, in English and (and a few other languages), that all designers must know about.

It is sorted by category (click to go to category):

For more resources you can check out the 101 Places To Get Design Inspiration. Also don’t forget to subscribe for more graphic design resources.

General Design

1 Spunk United

An excellent magazine with a selection of the worlds best artists providing inspiration, interviews, articles and more.

Spunk United Continue reading

May 06

5 Cool CSS Hover Effects You Can Copy and Paste

Need a cool hover effect for something on your site? Look no further! We’ve created several custom examples that you can view live for inspiration.

If you like the effect, steal it! We’ve got the CSS ready and waiting for you to copy.

Bring Your Boring Site to Life

Hover effects can make your site feel much more dynamic and alive. It used to be the case that JavaScript was required to do anything really interesting with a hover effect but these days CSS3 is capable of doing a ton of really cool stuff if you’re creating enough.

The effects we’ll be using today all use code that is supported by modern browsers, meaning of course Mozilla and Webkit for the most part. IE support is spotty at best across various versions so be sure to test thoroughly in your own implementation. Fancy hover effects are one of those things that you can usually degrade fairly gracefully so that older browsers still see some change.

Bump Up