Noupe.com – Gabriel Catalano®

Facebook? I Don’t Care! – via @NoupeMag / noupe.com

The Maple Kind is a website with a distinct claim that reads “Where infographics meet comics and bullshit!” What urges its creators is to make you chuckle. This sure does sound much simpler than it is, but it definitely implies, how the following infoographic shall be read. Therein, the Maple Kind argues, why we need a new button on Facebook (a few more than one more, in fact). This new button shall be named ” I Don’t Care” and is bound to be the most widely used expression on Facebook, once it has been instated. Though the infographic in fact made me chuckle, The Maple Kind does not follow a far-fetched approach. Take a look at your own use of Facebook. What would you use more often? Like or I Don’t Care? I know what I would do, but I don’t see Facebook as anything of value for modern society anyway…

What One Thing About Web Design Would You Change Today?

As Web designers and developers, much of our time is spent carving out little corners for ourselves: setting up stops along the information superhighway, creating hangouts to populate the virtual landscape. We shape areas of the Web as we choose to or as our clients command—like Neo altering the Matrix. Unlike Neo, though, we have rules to follow, standards to meet. Web development and design exist in a framework that dictates what we can and cannot do. With this idea of molding the Matrix in mind, we once again turned to our followers on Twitter.

In a recent poll, we asked: if you could make one thing about Web design different today, what would it be? To avoid repetition, we included a caveat: other than making IE disappear? With that, a wide range of answers flooded in on hash tags.

As always, we appreciate everyone who took the time to respond to the poll. Having a strong connection with our readers is rewarding—that’s one thing about the Web design and development community that we hope never changes. Below is a peek at what Web development and design would be like if our Twitter followers and Facebook fans had their say in shaping the industry.
Better Browsers…

http://www.noupe.com/design/what-one-thing-about-web-design-would-you-change-today.html
(…)

Better Browsers…

Even with the proviso in our question, most responses dealt with browsers—just not Internet Explorer. They also brought up how we build for the Web and how our work is interacted with, but browsers seemed to be the topic of the day. Judging by the amount of noise about it, the most frustrating problem is cross-compatibility between vendors. A number of different makers build browsers, and each browser has a unique way of rendering code; in this environment, designing and developing can be a burdensome task, and our readers would change it if they could.

Below are selected responses from our followers that offer a number of approaches to bettering the browser experience, and most of them deal with rendering code. There was variety in the responses, but making all browsers adhere to one set of enforced standards is an extremely popular solution. Compatibility was the focus.

I’d make every browser standards-compliant… and every website look amazing!

I would make every browser render the same code the same way.

Kill vendor-specific codes. No more of this -webkit crap.

Make all browsers be in sync. They are out of sync now. That’s the big difference between being a Web and graphic designer.

As many have said, cross-browser standards. So much time is wasted creating cross-browser compatibility. I’d also like to see better methods for separating content and navigation forms.

I’d ask all developers and companies to create one standard all-in-one Web browser. Need competition anyway? Here: plug-ins!

All browsers should have a unified rendering engine.

Standardize form elements across platforms and browsers.

Force standards. The W3C should have to “allow” browsers to browse the Web—and if -webkit, -moz or 90% of IE’s browser-specific bullshit were there, they’d block the browser. In a week, we’d have development heaven for all.

Make every browser read visual elements mathematically the same way so that developers wouldn’t have to care about cross-browsing.

We need a single open-source rendering engine (i.e. WebKit) that every browser could use and contribute to—and then we can scrap all other engines.

Fix font rendering. Continuar leyendo «What One Thing About Web Design Would You Change Today?»

The Ultimate Adobe Fireworks Toolbox

Full article
http://www.noupe.com/how-tos/the-ultimate-adobe-fireworks-toolbox.html

By Robert Bowen

Today we are here to help with the whole getting to know Adobe Fireworks a bit, as we dive deep into the internet to find the most useful sites, resources, tutorials and more to expand your Fireworks knowledge base and skillsets, and we deliver them all right into your readers.

Below is an assortment of various links that will help you assemble the ultimate Fireworks toolbox, so you can get the most out of this under used member of the Adobe Creative Suite family of design tools. So if you are a Fireworks enthusiast, or looking to become one, take a peek through the gathered resources below so that when you dive in to the works, you can dive in with style and preparedness.

Header1 in The Ultimate Adobe Fireworks Toolbox
General Websites

So the first section of our resource gathering finds us with a broad view opened up across the vast network of cyberspace to find you some dedicated sites based around this useful, oft overlooked, graphical and wireframing application. Below are a handful of places that anyone looking to beef up their FW toolbox should be heading first and foremost. Naturally our view will narrow in the sections ahead, but for now, these websites have loads of resources and tutorials for you to expand both your skill and your toolsets.

Adobe Fireworks Team is the FW focused blog from the folks over at Adobe. If you are looking for Fireworks info and insights, then what better place to start than at the source itself. This blog is loaded with all sorts of related tips and talk to help you get more out of the application than you first thought.

Full article
http://www.noupe.com/how-tos/the-ultimate-adobe-fireworks-toolbox.html

By Robert Bowen

Below is an assortment of various links that will help you assemble the ultimate Fireworks toolbox, so you can get the most out of this under used member of the Adobe Creative Suite family of design tools. So if you are a Fireworks enthusiast, or looking to become one, take a peek through the gathered resources below so that when you dive in to the works, you can dive in with style and preparedness.

Header1 in The Ultimate Adobe Fireworks Toolbox

General Websites

40+ Useful Online Generators For Web Designers

By Cameron Chapman

Generators can be a great way to save time in your web design projects. High-quality generators can create graphics or code or even layouts in a matter of seconds or minutes, things that might take an hour or more if done by hand. Below are some useful generators to help you speed up your web design process. There’s everything from color scheme tools to complete layout generators included. If you know of other useful generators out there, please share in the comments!

Color Schemes

A good color scheme is the cornerstone of a good website design. Coming up with unique and appropriate color schemes isn’t always easy. That’s where these color scheme generators come in handy.

Full article
http://www.noupe.com/tools/40-useful-online-generators.html

By Cameron Chapman

Generators can be a great way to save time in your web design projects. High-quality generators can create graphics or code or even layouts in a matter of seconds or minutes, things that might take an hour or more if done by hand. Below are some useful generators to help you speed up your web design process. There’s everything from color scheme tools to complete layout generators included. If you know of other useful generators out there, please share in the comments!

Color Schemes

A good color scheme is the cornerstone of a good website design. Coming up with unique and appropriate color schemes isn’t always easy. That’s where these color scheme generators come in handy. Continuar leyendo «40+ Useful Online Generators For Web Designers»

35 Excellent Wireframing Resources

By Cameron Chapman

Wireframing is an important part of the design process, one that shouldn’t be overlooked by even the most experienced designers. Wireframes can save development time by outlining exactly how a site should look and function, in a manner that can be shown to and approved by your clients.

But wireframing can be confusing, especially to new designers. What’s the right way to create a wireframe? Is there even a right way? Should I use pen and paper or software? Which software? How long should it take? All these questions and more are answered in the resources below.

By Cameron Chapman

Wireframing Articles

The articles featured here discuss wireframing and prototyping both from a theoretical and a practical point of view. If you have questions about how to wireframe or why you should, one of the links below will likely answer your questions.

My Five Commandments for Wireframing
A podcast and article from Boagworld on good practices for wireframing, including why you should wireframe and the benefits of paper wireframing.

Wireframes for the Wicked
Here’s a slideshow that talks about the purpose of wireframes and the different types of wireframes.

Sometimes, the Best Wireframing Tool is a Pencil
A brief post on why wireframing with paper and a pencil sometimes works better than using computer-based tools.

Why Sketching and Wireframing Ideas Strengthens Designs
This post from SpyreStudios covers why sketching and wireframing your ideas leads to the evolution of good designs.

Continuar leyendo «35 Excellent Wireframing Resources»

Stunningly Creative Infographics

http://www.noupe.com/how-tos/creative-examples-of-infographics.html

The Most Dangerous Cities for Walking

What People are Doing Online

Glass Half Empty: The Coming Water Wars

Continuar leyendo «Stunningly Creative Infographics»

What is the worst mistake you see other designers make all the time?

It is always a powerfully intoxicating moment when our design work impresses our peers and garners their attention and praise. We all like to feel as though we are innovators, and so some of us set out to push the envelope to new places. Forgetting all the while that we have no proverbial trail of breadcrumbs to lead any lay person along so they can find their way as well. UI and UX should never be sacrificed for style or presentation.

Yes, we want to strive for originality, but we still need to find ways for our design to remain accessible to all those journeying through the design world. It is not just for the experienced and the worldly wizened that we are creating our design for, it is for everyone. Something that we should never allow ourselves to lose sight of.

* Designing for other designers instead of designing for lay users
* I see many designers focus on making websites look great, without focusing the UX on their primary conversion goal.
* not planning an interface to follow the user’s “train of thought”.
* Forgetting to consider the users.

Not Making Choices

There is a rule of thumb that a lot of writers take on as truth when seeking out a lasting story that will resonate among the masses, and to some extent, designers have this same rule of thumb even if they do not know it. That rule, is that in order for your work to remain effective, we have to make creative choices. These are not necessarily going to be easy to do, in fact, some choices that you face making during the creative process are going to be down right onerous.

But regardless of how difficult they may seem as we approach this crossroads of imagination, these decisions have to be made in order to keep your design as fresh and communicative as it can be. Our imagination is what is supposed to separate us, and make us stand out from the rest of the designers in our field, but only if we employ it.

Now we know that some design choices ultimately end up out of our hands when we are working with a client, no matter how vehemently we object, we may have to make some compromises for the sake of the project. And we sacrifice innovation for mass appeal to reach a more general audience.

By Robert Bowen | http://bit.ly/bjdjAQ

We recently published a post was aimed at learning from the mistakes of others, and we turned to our friends and followers online and asked them to come clean about the biggest mistake they had made so far in their careers. You might have seen it, What is the Worst Design or Programming Mistake You’ve Ever Made?, was received quite well, and not only did we get some great responses initially from which to build the post, but we have got some more revealing replies from our readers. Now we are at it once again, trying to help out the community, one bad experience at a time, with a little more help from our friends, of course.

Just as before, it can be beneficial to learn from mistakes made by someone else who is kind enough to share their experiences with us, only their experience in this case, is more from a critiquing eye, than from their own path. This time out, we asked our social media masses to look outward for the post, rather than looking within, to find a mistake that they see others in the design world making time and again.

This way, we can help each other correct these errors, and without the critique being focused on any one individual. Rather a general observation that only we can know if it applies to us or not. If we are guilty of committing the design sin, now we know to look for it and fix it. Continuar leyendo «What is the worst mistake you see other designers make all the time?»

Showcase of Cartoon Style Web Designs

Do you remember yourself as a kid watching cartoons all the time — even when parents didn’t allow you to? Most of us have watched cartoons and even now, as we get older, cartoons don’t lose popularity. Basically, cartoons are animated illustrations that are mainly designed for kids but which some adults also enjoy watching. Cartoons can be drawn by hand or they can be drawn on digital devices, too.

Web design is a creative art and that’s why cartoon elements can also be used for web design. Actually, a whole website can look like a cartoon. It’s an excellent method to help make your website look more friendly and cheerful. We have pulled together here a few websites which will hopefully be a source of inspiration for your own future cartoon style website!

By Peteris Kelle | http://www.noupe.com

Do you remember yourself as a kid watching cartoons all the time — even when parents didn’t allow you to? Most of us have watched cartoons and even now, as we get older, cartoons don’t lose popularity. Basically, cartoons are animated illustrations that are mainly designed for kids but which some adults also enjoy watching. Cartoons can be drawn by hand or they can be drawn on digital devices, too.

40+ Awesome Keynote and PowerPoint Templates and Resources

Keynote (part of Apple’s iWork office suite) and PowerPoint (part of Microsoft’s Office suite) are likely the two most commonly used presentation software programs out there. PowerPoint is more likely to be found in the corporate world, whereas Keynote may be more popular in creative fields (due to the proliferation of Macs in the design field). Creating presentations in either program is a similar process, though.

Finding good resources for creating presentations isn’t always easy. There’s a definite lack of quality free presentation templates for both PowerPoint and Keynote, though it’s definitely more pronounced with PowerPoint. The good news is that there’s plenty of premium templates available, many for very low cost. And creating your own templates is as easy as creating a slide (just save it as a template file instead of a regular presentation file).

By Cameron Chapman
//www.noupe.com

Keynote (part of Apple’s iWork office suite) and PowerPoint (part of Microsoft’s Office suite) are likely the two most commonly used presentation software programs out there. PowerPoint is more likely to be found in the corporate world, whereas Keynote may be more popular in creative fields (due to the proliferation of Macs in the design field). Creating presentations in either program is a similar process, though.

Finding good resources for creating presentations isn’t always easy. There’s a definite lack of quality free presentation templates for both PowerPoint and Keynote, though it’s definitely more pronounced with PowerPoint. The good news is that there’s plenty of premium templates available, many for very low cost. And creating your own templates is as easy as creating a slide (just save it as a template file instead of a regular presentation file).

Free Keynote Templates

Free templates for Keynote abound, though not all are of particularly high quality. Here are some that are:

Green
This Green template would be perfect for an eco-friendly business. It has a simple green and white color scheme with leaf graphics.

Continuar leyendo «40+ Awesome Keynote and PowerPoint Templates and Resources»

35 Hand-Picked Illustrator Drawing Tutorials From 2010

Noupe.com | passionately delivers stylish and dynamic news for designers and web-developers on all subjects of design, ranging from; CSS, Ajax, Javascript, web design, graphics, typography, advertising & much more.

Adobe Illustrator Tutorials

Create a Painterly Apple with Illustrator CS5’s new Bristle Brush
The new Bristle Brush in Illustrator CS5 gives you the best of both worlds: The painterly effects of real media and the control and flexibility of a vector drawing.

Create a Print Ready Business Card Design in Illustrator
Illustrator has fantastic tools available for creating small print designs such as business cards. Follow this walkthrough on how to create a fun business card design complete with illustrated character.

Japanese Sushi
This tutorial will teach you how to create a plate of yummy Japanese sushi in illustrator.

How to Make Hitman in Adobe Illustrator
This tutorial is on illustration of hitman in Adobe Illustrator. For this tutorial you don’t have need any extra skills if you know basics of Adobe Illustrator you will make it easily.

Continuar leyendo «35 Hand-Picked Illustrator Drawing Tutorials From 2010»

Calculating the Return On Investment (ROI) on Marketing Your Design Skills

By Thursday Bram
//noupe.com

If you want to make a living as a web designer, there’s no option but to market your services. As much as you might hope clients will drop out of the sky, you have to take the steps necessary to make sure that those prospective clients know that you can help them and can easily find you.

But the options for marketing web design skills seem endless: you can network, blog, advertise, cold call and promote yourself until you’re blue in the face. You can spend hours trying to line up clients and be unable to tell if your efforts are having any effect at all. Are the majority of your clients finding you through a specific ad? Or maybe through an article you contributed to a magazine?

If you know what marketing methods are actually helping you to land design clients, you can often focus your efforts on those marketing projects that are the most effective. If something time-intensive, like a blog, isn’t actually bringing in new clients, wouldn’t it be nice to stop investing time in it?

All of that boils down to the fact that, if you’re marketing yourself as a web designer, you need to be calculating the ROI of the time you’re spending on your promotional efforts. ROI — or the return on investment — is a matter of determining if the work you’re bringing in is enough to cover the cost of the time you’re spending on marketing, at least for web designers. For certain organizations, it can get a lot more complicated, but for a small web design shop or a freelancer, that’s really the question that determines if your marketing is worth your while. Continuar leyendo «Calculating the Return On Investment (ROI) on Marketing Your Design Skills»

Tools and Resources for Grammar, Copywriting, Spelling and More

So much of the web is based around written content that it’s important for anyone who works online to have a good grasp of language, including grammar and spelling. But it’s not always easy to find reputable sources that can teach us these things if we didn’t learn them in school (or retain them for long after). Below are over thirty great resources for learning more about grammar, vocabulary, copywriting, and more. If you have more resources you’ve found helpful, please share them in the comments!

Grammar Resources

The resources included here will help you perfect your punctuation and refine your word usage. Some are very practical and down-to-earth while others inject a fair dose of humor into the learning process.

When to Use I.E. in a Sentence
This is a fantastic comic from The Oatmeal that explains exactly how and when to use i.e. in a sentence, complete with angry gorilla.

By Cameron Chapman

So much of the web is based around written content that it’s important for anyone who works online to have a good grasp of language, including grammar and spelling. But it’s not always easy to find reputable sources that can teach us these things if we didn’t learn them in school (or retain them for long after). Below are over thirty great resources for learning more about grammar, vocabulary, copywriting, and more. If you have more resources you’ve found helpful, please share them in the comments!

Grammar Resources

When to Use I.E. in a Sentence
This is a fantastic comic from The Oatmeal that explains exactly how and when to use i.e. in a sentence, complete with angry gorilla.

How to Use a Semicolon
The semicolon is probably the single-most misused punctuation mark out there. This comic from The Oatmeal will show you how to properly use them.

10 Words You Need to Stop Misspelling
This is another great comic from The Oatmeal that talks about 10 commons words a lot of people misspell, and how to remember the proper spellings.

Continuar leyendo «Tools and Resources for Grammar, Copywriting, Spelling and More»

How to Not Catch a Social Media Disease

In speaking to some design students, answering how I got started in the business, I told them I slept my way to the top. They didn’t fall for it but they stood silent for a good, long time. As I laughed and explained how I got started in the days before the internet, dodging velociraptors and flowing hot lava, I quickly realized they had no idea of traditional marketing techniques.

They weren’t tied to business sites as of yet, but in going over the wealth of free exposure one can easily use these days, it struck me about how I forked over thousands of dollars to source books and directories, waiting a year for them to be distributed to art directors and other practitioners during those dark days of the Inquisition. Sending postcard mailers was also the norm and art directors routinely threw away dozens each day, as opposed to now, when art directors call me and relay that I’m the only one who sends cards and they adorn their bulletin boards. How times have changed.

When I started sending e-advertisements in 1993, simple jpegs and animated gifs attached to regular e-mails, people went nuts! When I was asked what it cost, I would reply, “not a penny.” They were blown away at the possibilities. Shows you how far we have come in just a few years.

But, I always knew it was important to keep up with the cutting edge of technology and think I lost it when I got too comfortable with the ease and availability of the interface tools out there on social media sites. Drag and drop, point and click, drool a little less, etc. It’s like the guys on the bridge of the Enterprise (Star Trek) and their rapid-fire button pushing to program the computer to go forward. In reality, in the future, there will be a go and stop button with a simple joystick. Our machinery is getting smarter than we are. Just in time!

By Speider Schneider

I caught a disease from social media and I don’t know if it’s “tweetable” by modern medicine. I am fully vested in all the important social sites; LinkedIn for business, Facebook for friends, old business coworkers and a few “must know” people registered for the big time waster. I even have a fan page. I have a couple of blogs, write for some blogs that aren’t mine, I tweet, I Plaxo, Spock and other social sites I’ve long since deleted the bookmarks. I was one of the first people to discover social media. Not a pat on the back – just a testament to my ability to keep my sanity.

Image credit

In speaking to some design students, answering how I got started in the business, I told them I slept my way to the top. They didn’t fall for it but they stood silent for a good, long time. As I laughed and explained how I got started in the days before the internet, dodging velociraptors and flowing hot lava, I quickly realized they had no idea of traditional marketing techniques.

When I started sending e-advertisements in 1993, simple jpegs and animated gifs attached to regular e-mails, people went nuts! When I was asked what it cost, I would reply, “not a penny.” They were blown away at the possibilities. Shows you how far we have come in just a few years.

But, I always knew it was important to keep up with the cutting edge of technology and think I lost it when I got too comfortable with the ease and availability of the interface tools out there on social media sites. Drag and drop, point and click, drool a little less, etc. It’s like the guys on the bridge of the Enterprise (Star Trek) and their rapid-fire button pushing to program the computer to go forward. In reality, in the future, there will be a go and stop button with a simple joystick. Our machinery is getting smarter than we are. Just in time! Continuar leyendo «How to Not Catch a Social Media Disease»

The Ultimate Photoshop Toolbox

For years now, whenever designers have been asked about their go-to program for image editing and creation, one of the top answers that comes back, is Adobe Photoshop. Its generations of evolution has centered around the growth of any number of digital imaging professionals and has made this software giant a staple in the graphic design community. Since so many of us find this tool in our design arsenals, we thought we would put together a post that would have you get the most out of this dynamic imaging program.

Below is a collection of invaluable Photoshop resources from the online community that runs the proverbial gamut of available PS content. From toolkits full of templates, shapes, gradients, brushes, and so much more, to individual resource downloads of informative PDFs, usable PSDs, and other content galore, this post has everything you will need to amp up your Photoshop toolbox. So if you are a Photoshop devotee, or even just a newb getting started with the program, take a moment to browse down through these useful downloads that we have amassed.

By Robert Bowen

Header2 in The Ultimate Photoshop Toolbox

Print Tutorial: Creating A Magazine Cover

Designing magazine covers can be one of the most fun and challenging print design projects out there. Covers are so visible; it’s something everyone who sees the magazine will definitely see. The same goes for designing covers for brochures, catalogs, or other print pieces.

The tutorial here will show you the basics of creating a cover for a fictitious free travel magazine. It’s meant to be a technical tutorial more than a design tutorial, but the finished product is serviceable and of professional quality. Take what you learn here about print layout and Adobe InDesign and apply it to your own projects. The basic techniques can even be applied to something like a full-page display ad.

Here’s the final cover we’ll be creating:

Finalcroppedcover in Print Tutorial: Creating A Magazine Cover
Before You Begin

Like website design, there are certain things you need to know before designing any kind of print layout. While not complicated, there are many things that we rarely take into consideration when designing a website that are vital to the success of a print project. Key among these is image quality and margins (including bleeds).

When choosing images for a print layout (or when provided with images), you have to make sure they’re both sharp enough and have a high enough resolution. What looks great onscreen may be blurry or pixelated when printed on an offset printer (or even an inkjet). Any images used in a print layout need to be at least 300 dpi in order to look good. Any lower than that and they run the risk of being blurry or pixelated.

When resizing images for print layouts, remember to turn off resampling in your Photoshop settings (or whatever program you’re using to resize them). With very high quality images, you can sometimes get away with using images that are slightly lower resolution (as low as 250dpi at times), but check with your printer to see what they recommend based on your paper and other choices.

By Cameron Chapman

(…)
Designing magazine covers can be one of the most fun and challenging print design projects out there. Covers are so visible; it’s something everyone who sees the magazine will definitely see. The same goes for designing covers for brochures, catalogs, or other print pieces.

Here’s the final cover we’ll be creating: